IE與FF不相容網頁布局CSS問題

2021-04-24 13:00:47 字數 1277 閱讀 8489

css網頁布局中往往會出現很多ie與ff不相容問題,下面整理了一些常見的可能及其解決的辦法!

1、用!important解決ie和mozilla的布局差別

!important是css1就定義的語法,作用是提高指定樣式規則的應用優先權,最重要的一點是:ie一直都不支援這個語法,而其他的瀏覽器都支援。因此我們就可以利用這一點來分別給ie和其他瀏覽器不同的樣式定義,例如,我們定義這樣乙個樣式:

.colortest

在mozilla中瀏覽時候,能夠理解!important的優先順序,因此顯示#60a179的顏色;在ie中瀏覽時候,不能夠理解!important的優先順序,因此顯示#00f的顏色。

2、解決超連結訪問過後hover樣式不顯示的問題

改變css屬性的排列順序: 先後順序標準應為:

a:link—a:visited—a:hover—a:active

3、li中內容超過長度後以省略號顯示的方法

4、margin和padding定義尺寸的縮寫

margin:3px——表示所有邊都是3px;

margin:3px   5px—— 表示top和bottom的值是3px ,right和left的值是5px

margin:3px   5px 7px——表示top的值是3,right和left的值是5,bottom的值是7

margin:3px   5px 7px 5px——四個值依次表示top,right,bottom,left;上右下左。

5、解決ie不能正確顯示透明png——header內加入**

6、ul在firefox和ie下表現不同

使用(padding:0; margin:0; list-style:inside;)

或者(padding:0; margin:0; list-style:none;)實現相容

7、box模型在firefox和ie中的解釋相差2px的解決方法

div注意這兩個margin的順序一定不能寫反。根據上面提到的ie並不支援!important,所以在ie下其實解釋成這樣:

div重複定義的話按照最後乙個來執行,所以不可以只寫margin:xxpx!important;

8、margin的預設效果

div裡的內容,ie預設為居中,而ff預設為左對齊。使ff內容居中的方法是增加**margin:auto;

CSS相容IE6 7 FF之道

1 float的div一定要閉合。例如 其中floata floatb的屬性已經設定為float left div id floata div id floatb div id notfloatc 這裡的notfloatc並不希望繼續平移,而是希望往下排。這段 在ie中毫無問題,問題出在ff。原因是...

css 相容IE和FF的寫法

ie和火狐的css相容性問題歸總 css對瀏覽器器的相容性具有很高的價值,通常情況下ie和firefox存在很大的解析差異,這裡介紹一下相容要點。1 doctype 影響 css 處理 2 ff div 設定 margin left,margin right 為 auto 時已經居中,ie 不行 3...

IE與FF瀏覽器CSS相容技巧

一 important 在ie6及ff中的使用 box1 box1 模板無憂 mb5u com important是說這個設定有優先順序,ie碰到 important不會出錯只是忽略他的功能,假如後面又設定了width,ie會以最後設定的 width為準,假如後面再沒有其它設定,則會用當前這個值,也...