這次帶給大家瀏覽器不相容我寫的程式碼怎麼辦,瀏覽器相容性6大問題的總結,以下就是實戰案例,一起來看一下。
1、問題一
問題症狀:隨便寫幾個標籤,不加樣式控制的情況下,各自的margin 和padding差異較大。
解決方案:在CSS裡加入*{margin:0;padding:0;}
2、問題二
問題症狀:IE6、7和遨遊裡這個標籤的高度不受控制,超出自己設定的高度
解決方案:給超出高度的標籤設定overflow:hidden;或設定行高line-height 小於你設定的高度。
3、問題三
問題症狀:css裡dispaly:inline_block不起效果;
解決方案:在dispaly:inline_block後面加入display:inline;
4、問題四
問題症狀:多個img標籤之間的間距去不掉,使用了*{margin:0;padding:0;}也不起作用
解決方案:使用浮動(float);
5、問題五
問題症狀:因為min-height本身就是一個不相容的CSS屬性,所以設定min-height時不能很好的被各個瀏覽器相容
解決方案:如果我們要設定一個標籤的最小高度200px,需要進行的設定為:{min-height:200px; height:auto !important;
height:200px; overflow:visible;}
#6 、問題六
問題症狀: z-index失效
原因:z-index作用有個小小前提,就是元素的position屬性要是relative,absolute或是fixed。
解決方案:
1.position:relative改為position:absolute;
2.移除浮動;
3.浮動元素加入position屬性(如relative,absolute等)。
7、問題七
問題症狀:元素水平居中問題
解決方案:FF: margin:0 auto;
IE: 父級{ text-align:center; }
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
相關閱讀:
以上是瀏覽器不相容我寫的程式碼怎麼辦的詳細內容。更多資訊請關注PHP中文網其他相關文章!