iT邦幫忙

0

請問網頁排版,當瀏覽器顯示比例調整放大到125%時,網頁會出現破版!

您好

請問:當瀏覽器顯示比例調整放大到125%時,網頁會出現破版!
這種問題應該如何修改現有網頁不要出現這種情況呢?

http://library.taiwanschoolnet.org/cyberfair2016/buddhaists/comeback/comeback001.html

看更多先前的討論...收起先前的討論...
newkevin iT邦高手 1 級 ‧ 2017-02-15 20:09:09 檢舉
哪邊破 可以貼一下貼圖 並說是哪個瀏覽器還有版本
myubuntu iT邦新手 4 級 ‧ 2017-02-15 21:02:43 檢舉
https://drive.google.com/drive/folders/0BzlzZ8hgGD0wN3h5M041T095WVk?usp=sharing
myubuntu iT邦新手 4 級 ‧ 2017-02-15 21:02:55 檢舉
https://drive.google.com/drive/folders/0BzlzZ8hgGD0wN3h5M041T095WVk?usp=sharing
這個問題有點深度,要解決要有一點功底,要先看你的要求如果只是不要破版
那麼你的 DIV 物件就必須讓他自適性能夠自動調整大小,但如果遇到 DIV 有設定底圖的狀況下
對某些瀏覽器來說,底圖自動調整大小的語法,並非全部支援,這一點要特別注意
至於 文字大小,個人建議用 em 為單位,不要用 px ,然後適當的用 % 的話,會簡化一些編排的
myubuntu iT邦新手 4 級 ‧ 2017-02-16 09:34:02 檢舉
您好 因為是單純使用table排版,應該要怎麼改會比較好呢?
<table style="display: inline-table;" border="0" cellpadding="0" cellspacing="0" width="1024">
<!-- fwtable fwsrc="comeback.png" fwpage="页面 1" fwbase="comeback.png" fwstyle="Dreamweaver" fwdocid = "946817362" fwnested="1" -->
<tr>
<td><table style="display: inline-table;" align=""left" border="0" cellpadding="0" cellspacing="0" width="1024">
<tr>
<td><img name="comeback_r1_c1" src="images/comeback_r1_c1.png" width="118" height="56" alt=""></td>
<td><a href="../index.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('001','','images/comeback_r1_c2002.png',1)"><img src="images/comeback_r1_c2.png" alt="首頁" width="60" height="56" id="001"></a></td>
<td><a href="comeback001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('002','','images/comeback_r1_c3002.png',1)"><img src="images/comeback_r1_c3002.png" alt="歸來接蒡" width="108" height="56" id="002"></a></td>
<td><a href="../002comelife/comelife001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('003','','images/comeback_r1_c4002.png',1)"><img src="images/comeback_r1_c4.png" alt="歸寶重現" width="102" height="56" id="003"></a></td>
<td><a href="../003vocation/3vocation001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('004','','images/comeback_r1_c6002.png',1)"><img src="images/comeback_r1_c6.png" alt="牛蒡志業" width="106" height="56" id="004"></a></td>
<td><a href="../004combest/4combest001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('005','','images/comeback_r1_c8002.png',1)"><img src="images/comeback_r1_c8.png" alt="超牛栽種" width="106" height="56" id="005"></a></td>
<td><a href="../005betalent/5betalent001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('006','','images/comeback_r1_c9002.png',1)"><img src="images/comeback_r1_c9.png" alt="牛蒡達人" width="102" height="56" id="006"></a></td>
<td><a href="../007teamdiary/teamstudy001.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('007','','images/comeback_r1_c11002.png',1)"><img src="images/comeback_r1_c11.png" alt="學習日誌" width="106" height="56" id="007"></a></td>
<td><a href="../narrative.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('008','','images/comeback_r1_c13002.png',1)"><img src="images/comeback_r1_c13.png" alt="專題簡報" width="98" height="56" id="008"></a></td>
<td><img name="comeback_r1_c14" src="images/comeback_r1_c14.png" width="118" height="56" alt=""></td>
</tr>
</table></td>
</tr>
<tr>
<td><img name="comeback_r2_c1" src="images/comeback_r2_c1.png" width="1024" height="178" alt=""></td>
</tr>
<tr>
<td><table style="display: inline-table;" align=""left" border="0" cellpadding="0" cellspacing="0" width="1024">
<tr>
<td><img name="comeback_r3_c1" src="images/comeback_r3_c1.png" width="358" height="64" alt=""></td>
<td><a href="comeback001.html"><img src="images/comeback_r3_c5002.png" width="128" height="64" alt="歸來再造"></a></td>
<td><a href="comeback002.html"><img name="comeback_r3_c7" src="images/comeback_r3_c7.png" width="132" height="64" alt=""></a></td>
<td><a href="comeback003.html"><img name="comeback_r3_c10" src="images/comeback_r3_c10.png" width="138" height="64" alt=""></a></td>
<td><img name="comeback_r3_c12" src="images/comeback_r3_c12.png" width="268" height="64" alt=""></td>
</tr>
</table></td>
newkevin iT邦高手 1 級 ‧ 2017-02-16 12:25:26 檢舉
N年前
總寬度設100% 然後假設有5格個 就各設寬度20%
高度通常都固定的
因為程式英中對照表
早不知道到哪去了
不知道到怎麼改 呵呵
現在不知道都怎麼設
看各位先進大大了
"九個適應性設計小撇步" 關鍵字 看是否有幫助
table 標籤啊,我已經五年以上沒用過了,目前只用 DIV 排版喔
建議除了套印或輸出之外,請改用 DIV 排版
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友回答

立即登入回答