自適應(yīng)，表單寬高度不一致，單選框、復(fù)選框、下拉框風(fēng)格不統(tǒng)一，滾動(dòng)條效果不同，清楚浮動(dòng)問(wèn)題等等！
其實(shí)也就是 ie8 以及之前的版本 與谷歌的 差異 一般就是圖片透明 圓角 字體大小 包括一些新出的 css3 樣式 這些在ie8 都無(wú)法直接兼容
瀏覽器兼容問(wèn)題一：不同瀏覽器的標(biāo)簽?zāi)J(rèn)的margin和padding不同 問(wèn)題癥狀：隨便寫(xiě)幾個(gè)標(biāo)簽，不加樣式控制的情況下，各自的margin 和padding差異較大。碰到頻率:100% 解決方案： CSS里加一行 1 *{margin:0;padding:0;} 備注：這個(gè)是最常見(jiàn)的也是最易解決的一個(gè)瀏覽器兼容性問(wèn)題，幾乎所有的CSS文件開(kāi)頭都會(huì)用通配符*來(lái)設(shè)置各個(gè)標(biāo)簽的內(nèi)外補(bǔ)丁是0。瀏覽器兼容問(wèn)題二：塊屬性標(biāo)簽float后，又有橫行的margin情況下，在IE6顯示margin比設(shè)置的大 問(wèn)題癥狀:常見(jiàn)癥狀是IE6中后面的一塊被頂?shù)较乱恍? 碰到頻率：90%（稍微復(fù)雜點(diǎn)的頁(yè)面都會(huì)碰到，float布局最常見(jiàn)的瀏覽器兼容問(wèn)題） 解決方案：在float的標(biāo)簽樣式控制中加入 display:inline;將其轉(zhuǎn)化為行內(nèi)屬性 備注：我們最常用的就是div+CSS布局了，而div就是一個(gè)典型的塊屬性標(biāo)簽，橫向布局的時(shí)候我們通常都是用div float實(shí)現(xiàn)的，橫向的間距設(shè)置如果用margin實(shí)現(xiàn)，這就是一個(gè)必然會(huì)碰到的兼容性問(wèn)題。瀏覽器兼容問(wèn)題三：設(shè)置較小高度標(biāo)簽（一般小于10px），在IE6，IE7，遨游中高度超出自己設(shè)置高度 問(wèn)題癥狀：IE6、7和遨游里這個(gè)標(biāo)簽的高度不受控制，超出自己設(shè)置的高度 碰到頻率：60% 解決方案：給超出高度的標(biāo)簽設(shè)置overflow:hidden;或者設(shè)置行高line-height 小于你設(shè)置的高度。備注：這種情況一般出現(xiàn)在我們?cè)O(shè)置小圓角背景的標(biāo)簽里。出現(xiàn)這個(gè)問(wèn)題的原因是IE8之前的瀏覽器都會(huì)給標(biāo)簽一個(gè)最小默認(rèn)的行高的高度。即使你的標(biāo)簽是空的，這個(gè)標(biāo)簽的高度還是會(huì)達(dá)到默認(rèn)的行高。瀏覽器兼容問(wèn)題四：行內(nèi)屬性標(biāo)簽，設(shè)置display:block后采用float布局，又有橫行的margin的情況，IE6間距bug 問(wèn)題癥狀：IE6里的間距比超過(guò)設(shè)置的間距 碰到幾率：20% 解決方案：在display:block;后面加入display:inline;display:table; 備注：行內(nèi)屬性標(biāo)簽，為了設(shè)置寬高，我們需要設(shè)置display:block;(除了input標(biāo)簽比較特殊)。在用float布局并有橫向的margin后，在IE6下，他就具有了塊屬性float后的橫向margin的bug。不過(guò)因?yàn)樗旧砭褪切袃?nèi)屬性標(biāo)簽，所以我們?cè)偌由蟙isplay:inline的話，它的高寬就不可設(shè)了。這時(shí)候我們還需要在display:inline后面加入display:talbe。瀏覽器兼容問(wèn)題五：圖片默認(rèn)有間距 問(wèn)題癥狀：幾個(gè)img標(biāo)簽放在一起的時(shí)候，有些瀏覽器會(huì)有默認(rèn)的間距，加了問(wèn)題一中提到的通配符也不起作用。碰到幾率：20% 解決方案：使用float屬性為img布局 備注：因?yàn)閕mg標(biāo)簽是行內(nèi)屬性標(biāo)簽，所以只要不超出容器寬度，img標(biāo)簽都會(huì)排在一行里，但是部分瀏覽器的img標(biāo)簽之間會(huì)有個(gè)間距。去掉這個(gè)間距使用float是正道。（我的一個(gè)學(xué)生使用負(fù)margin，雖然能解決，但負(fù)margin本身就是容易引起瀏覽器兼容問(wèn)題的用法，所以我禁止他們使用） 瀏覽器兼容問(wèn)題六：標(biāo)簽最低高度設(shè)置min-height不兼容 問(wèn)題癥狀：因?yàn)閙in-height本身就是一個(gè)不兼容的CSS屬性，所以設(shè)置min-height時(shí)不能很好的被各個(gè)瀏覽器兼容 碰到幾率：5% 解決方案：如果我們要設(shè)置一個(gè)標(biāo)簽的最小高度200px，需要進(jìn)行的設(shè)置為：{min-height:200px; height:auto !important; height:200px; overflow:visible;} 備注：在B/S系統(tǒng)前端開(kāi)時(shí)，有很多情況下我們又這種需求。當(dāng)內(nèi)容小于一個(gè)值（如300px）時(shí)。容器的高度為300px；當(dāng)內(nèi)容高度大于這個(gè)值時(shí)，容器高度被撐高，而不是出現(xiàn)滾動(dòng)條。這時(shí)候我們就會(huì)面臨這個(gè)兼容性問(wèn)題。瀏覽器兼容問(wèn)題七：各種特殊樣式的兼容，比如透明度、圓角、陰影等。特殊樣式每個(gè)瀏覽器的代碼區(qū)別很大，所以，只能現(xiàn)查資料通過(guò)給不同瀏覽器寫(xiě)不同的代碼來(lái)解決。JS解決IE6下png透明失效的問(wèn)題 做兼容頁(yè)面的方法是：每寫(xiě)一小段代碼（布局中的一行或者一塊）我們都要在不同的瀏覽器中看是否兼容，當(dāng)然熟練到一定的程度就沒(méi)這么麻煩了。建議經(jīng)常會(huì)碰到兼容性問(wèn)題的新手使用。很多兼容性問(wèn)題都是因?yàn)闉g覽器對(duì)標(biāo)簽的默認(rèn)屬性解析不同造成的，只要我們稍加設(shè)置都能輕松地解決這些兼容問(wèn)題。如果我們熟悉標(biāo)簽的默認(rèn)屬性的話，就能很好的理解為什么會(huì)出現(xiàn)兼容問(wèn)題以及怎么去解決這些兼容問(wèn)題。
一是直接將樣式控制放置于單個(gè)HTML元素內(nèi)，稱為內(nèi)聯(lián)式；二是在網(wǎng)頁(yè)的head部分定義樣式，稱為嵌入式；三是以擴(kuò)展名為.css文件保存樣式，稱為外聯(lián)式。
一、CSS HACK以下兩種方法幾乎能解決現(xiàn)今所有HACK. 1, !important 隨著IE7對(duì)!important的支持, !important 方法現(xiàn)在只針對(duì)IE6的HACK.(注意寫(xiě)法.記得該聲明位置需要提前.) 2, IE6/IE77對(duì)FireFox *+html 與 *html 是IE特有的標(biāo)簽, firefox 暫不支持.而*+html 又為 IE7特有標(biāo)簽. 注意: *+html 對(duì)IE7的HACK 必須保證HTML頂部有如下聲明： 二、萬(wàn)能 float 閉合 關(guān)于 clear float 的原理可參見(jiàn) [How To Clear Floats Without Structural Markup] 將以下代碼加入Global CSS 中,給需要閉合的div加上 class="clearfix" 即可,屢試不爽. 三、其他兼容技巧 1, FF下給 div 設(shè)置 padding 后會(huì)導(dǎo)致 width 和 height 增加, 但I(xiàn)E不會(huì).(可用!important解決) 2, 居中問(wèn)題. 1).垂直居中.將 line-height 設(shè)置為 當(dāng)前 div 相同的高度, 再通過(guò) vertical-align: middle.( 注意內(nèi)容不要換行.) 2).水平居中. margin: 0 auto;(當(dāng)然不是萬(wàn)能) 3, 若需給 a 標(biāo)簽內(nèi)內(nèi)容加上 樣式, 需要設(shè)置 display: block;(常見(jiàn)于導(dǎo)航標(biāo)簽) 4, FF 和 IE 對(duì) BOX 理解的差異導(dǎo)致相差 2px 的還有設(shè)為 float的div在ie下 margin加倍等問(wèn)題. 5, ul 標(biāo)簽在 FF 下面默認(rèn)有 list-style 和 padding . 最好事先聲明, 以避免不必要的麻煩. (常見(jiàn)于導(dǎo)航標(biāo)簽和內(nèi)容列表) 6, 作為外部 wrapper 的 div 不要定死高度, 最好還加上 overflow: hidden.以達(dá)到高度自適應(yīng). 7, 關(guān)于手形光標(biāo). cursor: pointer. 而hand 只適用于 IE.1 針對(duì)firefox ie6 ie7的css樣式現(xiàn)在大部分都是用!important來(lái)hack，對(duì)于ie6和firefox測(cè)試可以正常顯示， 但是ie7對(duì)!important可以正確解釋，會(huì)導(dǎo)致頁(yè)面沒(méi)按要求顯示！找到一個(gè)針 對(duì)IE7不錯(cuò)的hack方式就是使用“*+html”，現(xiàn)在用IE7瀏覽一下，應(yīng)該沒(méi)有問(wèn)題了?，F(xiàn)在寫(xiě)一個(gè)CSS可以這樣： #1 * html #1 *+html #1 那么在firefox下字體顏色顯示為#333，IE6下字體顏色顯示為#666，IE7下字體顏色顯示為#999。
2 css布局中的居中問(wèn)題主要的樣式定義如下： body #center 說(shuō)明： 首先在父級(jí)元素定義TEXT-ALIGN: center;這個(gè)的意思就是在父級(jí)元素內(nèi)的內(nèi)容居中；對(duì)于IE這樣設(shè)定就已經(jīng)可以了。但在mozilla中不能居中。解決辦法就是在子元素定義時(shí)候設(shè)定時(shí)再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ” 需要說(shuō)明的是，如果你想用這個(gè)方法使整個(gè)頁(yè)面要居中，建議不要套在一個(gè)DIV里，你可以依次拆出多個(gè)div， 只要在每個(gè)拆出的div里定義MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。
3 盒模型不同解釋 #box#box4 浮動(dòng)ie產(chǎn)生的雙倍距離 #box這里細(xì)說(shuō)一下block,inline兩個(gè)元素,Block元素的特點(diǎn)是:總是在新行上開(kāi)始,高度,寬度,行高,邊距都可以控制(塊元素);Inline元素的特點(diǎn)是:和其他元素在同一行上,...不可控制(內(nèi)嵌元素); #box5 IE不認(rèn)得min-這個(gè)定義但實(shí)際上它把正常的width和height當(dāng)作有min的情況來(lái)使。這樣問(wèn)題就大了，如果只用寬度和高度，正常的瀏覽器里這兩個(gè)值就不會(huì)變，如果只用min-width和min-height的話，IE下面根本等于沒(méi)有設(shè)置寬度和高度。比如要設(shè)置背景圖片，這個(gè)寬度是比較重要的。要解決這個(gè)問(wèn)題，可以這樣： #box6 頁(yè)面的最小寬度 min-width是個(gè)非常方便的CSS命令，它可以指定元素最小也不能小于某個(gè)寬度，這樣就能保證排版一直正確。但I(xiàn)E不認(rèn)得這個(gè)，而它實(shí)際上把width當(dāng)做最小寬度來(lái)使。為了讓這一命令在IE上也能用，可以把一個(gè)
放到 標(biāo)簽下，然后為div指定一個(gè)類：然后CSS這樣設(shè)計(jì)：#container第一個(gè)min-width是正常的；但第2行的width使用了Javascript，這只有IE才認(rèn)得，這也會(huì)讓你的HTML文檔不太正規(guī)。它實(shí)際上通過(guò)Javascript的判斷來(lái)實(shí)現(xiàn)最小寬度。
7 清除浮動(dòng) .hackbox或者加入:after（偽對(duì)象）,設(shè)置在對(duì)象后發(fā)生的內(nèi)容，通常和content配合使用，IE不支持此偽對(duì)象，非Ie 瀏覽器支持， 所 以并不影響到IE/WIN瀏覽器。這種的最麻煩的......#box:after8 DIV浮動(dòng)IE文本產(chǎn)生3象素的bug 左邊對(duì)象浮動(dòng)，右邊采用外補(bǔ)丁的左邊距來(lái)定位，右邊對(duì)象內(nèi)的文本會(huì)離左邊有3px的間距. #boxHTML代碼
9 屬性選擇器(這個(gè)不能算是兼容,是隱藏css的一個(gè)bug) p[id]這個(gè)對(duì)于IE6.0和IE6.0以下的版本都隱藏,FF和OPera作用 屬性選擇器和子選擇器還是有區(qū)別的,子選擇器的范圍從形式來(lái)說(shuō)縮小了,屬性選擇器的范圍比較大,如p[id]中,所有p標(biāo)簽中有id的都是同樣式的. 10 IE捉迷藏的問(wèn)題 當(dāng)div應(yīng)用復(fù)雜的時(shí)候每個(gè)欄中又有一些鏈接，DIV等這個(gè)時(shí)候容易發(fā)生捉迷藏的問(wèn)題。有些內(nèi)容顯示不出來(lái)，當(dāng)鼠標(biāo)選擇這個(gè)區(qū)域是發(fā)現(xiàn)內(nèi)容確實(shí)在頁(yè)面。解決辦法：對(duì)#layout使用line-height屬性 或者給#layout使用固定高和寬。頁(yè)面結(jié)構(gòu)盡量簡(jiǎn)單。
11 高度不適應(yīng) 高度不適應(yīng)是當(dāng)內(nèi)層對(duì)象的高度發(fā)生變化時(shí)外層高度不能自動(dòng)進(jìn)行調(diào)節(jié)，特別是當(dāng)內(nèi)層對(duì)象使用margin 或paddign 時(shí)。例：
CSS：#box #box p 解決方法：在P對(duì)象上下各加2個(gè)空的div對(duì)象CSS代碼：.1四、CSS兼容要點(diǎn)分析IE vs FF CSS 兼容要點(diǎn)： DOCTYPE 影響 CSS 處理 FF: div 設(shè)置 margin-left, margin-right 為 auto 時(shí)已經(jīng)居中, IE 不行 FF: body 設(shè)置 text-align 時(shí), div 需要設(shè)置 margin: auto(主要是 margin-left,margin-right) 方可居中 FF: 設(shè)置 padding 后, div 會(huì)增加 height 和 width, 但 IE 不會(huì), 故需要用 !important 多設(shè)一個(gè) height 和 width FF: 支持 !important, IE 則忽略, 可用 !important 為 FF 特別設(shè)置樣式 div 的垂直居中問(wèn)題: vertical-align:middle; 將行距增加到和整個(gè)DIV一樣高 line-height:200px; 然后插入文字，就垂直居中了。缺點(diǎn)是要控制內(nèi)容不要換行 cursor: pointer 可以同時(shí)在 IE FF 中顯示游標(biāo)手指狀， hand 僅 IE 可以 FF: 鏈接加邊框和背景色，需設(shè)置 display: block, 同時(shí)設(shè)置 float: left 保證不換行。參照 menubar, 給 a 和 menubar 設(shè)置高度是為了避免底邊顯示錯(cuò)位, 若不設(shè) height, 可以在 menubar 中插入一個(gè)空格XHTML+CSS兼容性解決方案小集 使用XHTML＋CSS構(gòu)架好處不少，但也確實(shí)存在一些問(wèn)題，不論是因?yàn)槭褂貌皇炀氝€是思路不清晰，我就先把一些我遇到的問(wèn)題寫(xiě)在下面，省的大家四處找^^ 1、在mozilla firefox和IE中的BOX模型解釋不一致導(dǎo)致相差2px解決方法： div注意這兩個(gè)margin的順序一定不能寫(xiě)反，據(jù)阿捷的說(shuō)法!important這個(gè)屬性IE不能識(shí)別，但別的瀏覽器可以識(shí)別。所以在IE下其實(shí)解釋成這樣： div重復(fù)定義的話按照最后一個(gè)來(lái)執(zhí)行，所以不可以只寫(xiě)margin:XXpx!important; 2、IE5 和IE6的BOX解釋不一致IE5下divdiv關(guān)于這個(gè)/**/是什么我也不太明白，只知道IE5和firefox都支持但I(xiàn)E6不支持，如果有人理解的話，請(qǐng)告訴我一聲，謝了！：） 3、ul標(biāo)簽在Mozilla中默認(rèn)是有padding值的,而在IE中只有margin有值所以先定義 ul就能解決大部分問(wèn)題 4、關(guān)于腳本，在xhtml1.1中不支持language屬性，只需要把代碼改為 < type="text/java"> 就可以了 五、10個(gè)你未必知道的CSS技巧 1、CSS字體屬性簡(jiǎn)寫(xiě)規(guī)則 一般用CSS設(shè)定字體屬性是這樣做的： font-weight:bold; font-style:italic; font-varient:small-caps; font-size:1em; line-height:1.5em; font-family:verdana,sans-serif; 但也可以把它們?nèi)繉?xiě)到一行上去： font: bold italic small-caps 1em/1.5em verdana,sans-serif; 真不錯(cuò)！只有一點(diǎn)要提醒的：這種簡(jiǎn)寫(xiě)方法只有在同時(shí)指定font-size和font-family屬性時(shí)才起作用。而且，如果你沒(méi)有設(shè)定font-weight, font-style, 以及 font-varient ，他們會(huì)使用缺省值，這點(diǎn)要記上。
2、同時(shí)使用兩個(gè)類 一般只能給一個(gè)元素設(shè)定一個(gè)類（Class），但這并不意味著不能用兩個(gè)。事實(shí)上，你可以這樣：
...
同時(shí)給P元素兩個(gè)類，中間用空格格開(kāi)，這樣所有text和side兩個(gè)類的屬性都會(huì)加到P元素上來(lái)。如果它們兩個(gè)類中的屬性有沖突的話，后設(shè)置的起作用，即在CSS文件中放在后面的類的屬性起作用。補(bǔ)充：對(duì)于一個(gè)ID，不能這樣寫(xiě)
...
也不能這樣寫(xiě) 3、CSS border的缺省值 通?？梢栽O(shè)定邊界的顏色，寬度和風(fēng)格，如： border: 3px solid #000 這位把邊界顯示成3像素寬，黑色，實(shí)線。但實(shí)際上這里只需要指定風(fēng)格即可。如果只指定了風(fēng)格，其他屬性就會(huì)使用缺省值。一般地，Border的寬度缺省是medium，一般等于3到4個(gè)像素；缺省的顏色是其中文字的顏色。如果這個(gè)值正好合適的話，就不用設(shè)那么多了。
4、CSS用于文檔打印 許多網(wǎng)站上都有一個(gè)針對(duì)打印的版本，但實(shí)際上這并不需要，因?yàn)榭梢杂肅SS來(lái)設(shè)定打印風(fēng)格。也就是說(shuō)，可以為頁(yè)面指定兩個(gè)CSS文件，一個(gè)用于屏幕顯示，一個(gè)用于打?。?
第1行就是顯示，第2行是打印，注意其中的media屬性。但應(yīng)該在打印CSS中寫(xiě)什么東西呢？你可以按設(shè)計(jì)普通CSS的方法來(lái)設(shè)定它。設(shè)計(jì)的同時(shí)就可以把這個(gè)CSS設(shè)成顯示CSS來(lái)檢查它的效果。也許你會(huì)使用 display: none 這個(gè)命令來(lái)關(guān)掉一些裝飾圖片，再關(guān)掉一些導(dǎo)航按鈕。要想了解更多，可以看“打印差異”這一篇。
5、圖片替換技巧 一般都建議用標(biāo)準(zhǔn)的HTML來(lái)顯示文字，而不要使用圖片，這樣不但快，也更具可讀性。但如果你想用一些特殊字體時(shí)，就只能用圖片了。比如你想整個(gè)賣東西的圖標(biāo)，你就用了這個(gè)圖片：
這當(dāng)然可以，但對(duì)搜索引擎來(lái)說(shuō)，和正常文字相比，它們對(duì)alt里面的替換文字幾乎沒(méi)有興趣這是因?yàn)樵S多設(shè)計(jì)者在這里放許多關(guān)鍵詞來(lái)騙搜索引擎。所以方法應(yīng)該是這樣的：
Buy widgets
但這樣就沒(méi)有特殊字體了。要想達(dá)到同樣效果，可以這樣設(shè)計(jì)CSS： h1 注意把image height換成真的圖片的高度。這里，圖片會(huì)當(dāng)作背景顯示出來(lái)，而真正的文字由于設(shè)定了-2000像素這個(gè)縮進(jìn)，它們會(huì)出現(xiàn)在屏幕左邊2000點(diǎn)的地方，就看不見(jiàn)了。但這對(duì)于關(guān)閉圖片的人來(lái)說(shuō)，可能全部看不到了，這點(diǎn)要注意。
6、CSS box模型的另一種調(diào)整技巧 這個(gè)Box模型的調(diào)整主要是針對(duì)IE6之前的IE瀏覽器的，它們把邊界寬度和空白都算在元素寬度上。比如： #box 這樣調(diào)用它：
...
這時(shí)盒子的全寬應(yīng)該是150點(diǎn)，這在除IE6之前的IE瀏覽器之外的所有瀏覽器上都是正確的。但在IE5這樣的瀏覽器上，它的全寬仍是100點(diǎn)?？梢杂靡郧叭税l(fā)明的Box調(diào)整方法來(lái)處理這種差異。但用CSS也可以達(dá)到同樣的目的，讓它們顯示效果一致。#box 這樣調(diào)用：
這樣，不管什么瀏覽器，寬度都是150點(diǎn)了。
7、塊元素居中對(duì)齊 如果想做個(gè)固定寬度的網(wǎng)頁(yè)并且想讓網(wǎng)頁(yè)水平居中的話，通常是這樣： #content 你會(huì)使用
來(lái)圍上所有元素。這很簡(jiǎn)單，但不夠好，IE6之前版本會(huì)顯示不出這種效果。改CSS如下： body 這會(huì)把網(wǎng)頁(yè)內(nèi)容都居中，所以在Content中又加入了 text-align: left 。
8、用CSS來(lái)處理垂直對(duì)齊 垂直對(duì)齊用表格可以很方便地實(shí)現(xiàn)，設(shè)定表格單元 vertical-align: middle 就可以了。但對(duì)CSS來(lái)說(shuō)這沒(méi)用。如果你想設(shè)定一個(gè)導(dǎo)航條是2em高，而想讓導(dǎo)航文字垂直居中的話，設(shè)定這個(gè)屬性是沒(méi)用的。CSS方法是什么呢？對(duì)了，把這些文字的行高設(shè)為 2em：line-height: 2em ，這就可以了。
9、CSS在容器內(nèi)定位 CSS的一個(gè)好處是可以把一個(gè)元素任意定位，在一個(gè)容器內(nèi)也可以。比如對(duì)這個(gè)容器： #container 這樣容器內(nèi)所有的元素都會(huì)相對(duì)定位，可以這樣用：
如果想定位到距左30點(diǎn)，距上5點(diǎn)，可以這樣： #navigation 當(dāng)然，你還可以這樣： margin: 5px 0 0 30px 注意4個(gè)數(shù)字的順序是：上、右、下、左。當(dāng)然，有時(shí)候定位的方法而不是邊距的方法更好些。
10、直通到屏幕底部的背景色 在垂直方向是進(jìn)行控制是CSS所不能的。如果你想讓導(dǎo)航欄和內(nèi)容欄一樣直通到頁(yè)面底部，用表格是很方便的，但如果只用這樣的CSS： #navigation 較短的導(dǎo)航條是不會(huì)直通到底部的，半路內(nèi)容結(jié)束時(shí)它就結(jié)束了。該怎么辦呢？ 不幸的是，只能采用欺騙的手段了，給這較短的一欄加上個(gè)背景圖，寬度和欄寬一樣，并讓它的顏色和設(shè)定的背景色一樣。body 此時(shí)不能用em做單位，因?yàn)槟菢拥脑?，一旦讀者改變了字體大小，這個(gè)花招就會(huì)露餡，只能使用px。
5，關(guān)于CSS 瀏覽器兼容問(wèn)題
這個(gè)是普遍的一個(gè)IE BUG， 2像素錯(cuò)誤。
解決方法有幾種，
第一種，不寫(xiě)hack（瀏覽器兼容性）代碼的方法。
CSS如下:
#B {width:500px;height:200px;margin:0; padding:0;}
.b1，.b2{width:250px;height:200px;float: left;}
2個(gè)都用左浮動(dòng)。
用HACK的方法
CSS如下:
#B {width:500px;height:200px;margin:0; padding:0;}
.b1{width:250px;height:200px;float: left;}
.b2{width:250px;height:200px;margin-left:-2px; margin-left:0px!important;}
IE讀取margin-left:-2px; 會(huì)把B2左移2像素。
FF開(kāi)始的時(shí)候讀取margin-left:-2px; 然后后來(lái)的 margin-left:0px會(huì)覆蓋開(kāi)始讀取的margin-left:-2px 所以FF不會(huì)變化。
!importantFF認(rèn)識(shí)，IE6不認(rèn)識(shí)
本文名稱：css可用哪些方式兼容，經(jīng)常遇到的css的兼容性有哪些
標(biāo)題來(lái)源：
http://weahome.cn/article/ejscji.html
重慶分公司
重慶分公司
