網頁設計中如何解決瀏覽器相容問題

ztguang發表於2016-03-30
網頁瀏覽器
http://zhidao.baidu.com/question/265250845.html

1. 目標不居中； 一般新手都愛出現這個問題，主要原因是對盒子模型不夠理解，如果發現你的頁面沒有居中，基本上有兩種情況： a. 如果是在瀏覽器中沒有居中，就是沒盒子，就是要用一個大DIV把所有需要居中元素裝起來，然後給盒子一個css樣式margin:0 auto; b. 如果想要盒子內的元素居中，必須定義盒子的絕對寬度,然後給盒子一個CSS樣式text-align:center; 2. 目標在不同瀏覽器上的位置不同； a. 首先不要去急著找hack,先看一下自己的程式碼有沒有錯誤，DW裡有一個“檢查瀏覽器相容性”功能特別實用； b. 然後，儘量讓目標的位置初始化，使之在所有瀏覽器都處在同一個位置，這個條件的前提是，不寫hack，最後再一個方位一個方位調整。 3. 目標與目標之間距離在各個瀏覽器上的區別； a. 給其中一個目標加背景顏色； b. 觀察背景色與另外一個目標的距離，檢視是不是這個目標造成的距離問題 c. 如果不是上一個目標，那就給另外一個目標也加上背景顏色。 d. 這樣很容易判斷出那個目標造成的原因，就針對那個目標進行修改。 4. IE6相容問題最多的一個，浮動問題。 a. flaot浮動造成IE6下面雙倍邊距問題，這個最常見，也最好處理，解決方法： 只需要給這個DIV加一個樣式：display:inline; b. 佈局的時候經常會遇到這種情況：發現有一個DIV浮動了，接下來的一個DIV本來是要在下面顯示的，結果跑上面去了，這種情況一般在FF下面會出現。 解決的辦法：清除浮動，在設定過浮動的那個DIV下面加一個DIV，給個樣式clear:both;如下
5. IE8相容問題 ie8下相容問題，這個最好處理，轉化成ie7相容就可以。在頭部加如下一段程式碼，然後只要在IE7下相容了，IE8下面也就相容了 6. 背景相容問題 有的時候明明給一個DIV加了背景顏色或背景圖片，但是卻顯示不出來或者顯示不全。 解決辦法：首先，有可能是DIV沒有設定絕對高度。如果設定了寬度和高度還沒有效果，那麼給DIV一個樣式display:block；（通常a:hover加背景的時候經常遇到）。 另外，如果高度必須要設定成自動的話，那麼就給DIV一個樣式overflow:hidden; 7. IE7和Firefox相容問題 很多朋友DIV+CSS的時候，會出現，在IE的幾個瀏覽器下都好使，就是FF下有問題。 解決方法：height:100px;/*FF下顯示100的高*/ +height:120px;/*IE678下顯示120高*/ 原理：FF不識別加過符號的屬性，而IE識別。
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
閱讀(4209) | 評論(0) | 轉發(1) |
0

上一篇：epoll精髓

下一篇：Apache/RewriteRule

相關熱門文章
給主人留下些什麼吧！~~
評論熱議

相關文章