解決CSS瀏覽器兼容性十則技巧(IE6)
2010/11/18 14:55:00

  
  1、使用!important,或是高級(jí)選擇符替代IE特定代碼

  在外置的CSS文件里,放棄憑借傳統(tǒng)的hacks和條件判斷,使用有效的CSS代碼去針對(duì)IE6仍然是有可能的。例如:最小高度可以使用一下定義。

  #element{min-height:20em;height:auto!important;/*understoodbyallbrowsers*/height:20em;/*IE6incorrectlyusesthisvalue/*}

  2、設(shè)置元素啟動(dòng)hasLayout

  大部分IE6(IE7)的渲染問題都可以通過起來元素的hasLayout屬性來兼容。這是IE內(nèi)置的設(shè)定,確定一個(gè)內(nèi)容塊相對(duì)其它內(nèi)容塊是有界限和位置的。當(dāng)你需要設(shè)置一個(gè)行內(nèi)元素例如一個(gè)連接變成塊狀元素或者是透明效果,設(shè)置hasLayout也是必須的。

  3、為浮動(dòng)元素使用display:inline

  浮動(dòng)元素會(huì)有一個(gè)著名的IE6雙邊距marginbug。假如你設(shè)置了左邊距5px但實(shí)際上得到了10px左邊距。display:inline可以解決這個(gè)問題,盡管它不是必需的,但是CSS仍然有效。

  4、使用a標(biāo)簽完成可點(diǎn)擊和hover原理

  IE6只支持a標(biāo)簽的CSS定義hover效果,你可以使用它去控制javascript啟動(dòng)的widgets,使得他們?nèi)匀槐3宙I盤操作。這里有個(gè)二擇一的問題,但是a標(biāo)簽是所有解決方案中最可靠的。IE6不支持“min-height”并且錯(cuò)誤的將20em重寫為“auto”。不過,當(dāng)內(nèi)容大于設(shè)置的空間時(shí),它會(huì)增加它的尺寸。另外一個(gè)選擇是使用高級(jí)選擇符。例如:

  以下是代碼片段:

  #element{min-height:20em;height:20em;}/*ignoredbyIE6*/#element[id]{height:auto;}

  5、修復(fù)重復(fù)字符的bug

  復(fù)雜的布局會(huì)觸發(fā)一個(gè)bug:浮動(dòng)對(duì)象的最后字符會(huì)出現(xiàn)在已經(jīng)清除浮動(dòng)的元素后面。這里有幾種解決的辦法,部分是理想的,并且一些測(cè)試和出錯(cuò)是必須的。

  ◆確保浮動(dòng)元素都使用:display:inline;

  ◆最后一個(gè)浮動(dòng)元素使用margin-right:-3px;

  ◆在浮動(dòng)對(duì)象最后一個(gè)元素后使用一個(gè)條件注釋。例如這里輸入注釋…

  ◆在容器內(nèi)的最后使用一個(gè)div空標(biāo)簽。

  6、重構(gòu)你的代碼

  經(jīng)常的,修復(fù)會(huì)比重新考慮布局問題更加花費(fèi)時(shí)間。Html細(xì)微的修改和更加簡(jiǎn)單的CSS經(jīng)常是最有效的。這意味著你要放棄完美的合法的代碼,但是將會(huì)更少的問題出現(xiàn),并且你知道怎樣處理將要出現(xiàn)的情況。

  7、使用一個(gè)聲明

  你必須經(jīng)常在HTML網(wǎng)頁頭部放置一個(gè)聲明,推薦使用嚴(yán)格的標(biāo)準(zhǔn)。同時(shí)需要是IE6進(jìn)入兼容模式,這已經(jīng)足夠兼容的了。

  8、避免百分比定義

  百分比在IE下比較混亂。除非你非常小心每個(gè)父元素的尺寸,這樣就大概可以最后避免了。你仍然可以對(duì)其他瀏覽器使用!important來使用百分值。例如:

  body{margin:2%0!important;margin:20px0;/*IE6only*/}

  9、早點(diǎn)和經(jīng)常測(cè)試

  在你的網(wǎng)站和應(yīng)用程序完成之前,不要放棄IE6的測(cè)試。問題將會(huì)更加嚴(yán)重并且需要很長(zhǎng)時(shí)間去修復(fù)。如果你的網(wǎng)站可以運(yùn)行于FireFox和IE6,它將差不多肯定可以在其它瀏覽器下運(yùn)行。

  10、使用position:relative

  設(shè)置一個(gè)標(biāo)簽position:relative可以解決很多問題,特別是曾經(jīng)有過看不見的經(jīng)歷或者奇怪布局的框架。明顯的,你需要小心,絕對(duì)位置放置的子元素是否都參照找到新位置。

返回列表
返回首頁 主站蜘蛛池模板: 夜夜影院未满十八勿进| 粉嫩极品国产在线观看| 女人扒开腿让男人桶个爽| 亚洲午夜无码久久久久| 老八吃屎奥利给原视频带声音的| 在线观看成人网站| 丰满的少妇愉情hd高清果冻传媒| 永久黄色免费网站| 免费观看女子推理社| 国产妇乱子伦视频免费| 好吊妞免费视频| 中文字幕在线永久视频| 欧美亚洲777| 亚洲精品午夜国产va久久成人| 这里只有精品视频在线| 国模丽丽啪啪一区二区| 久久99精品九九九久久婷婷| 欧美黑人xxxx性高清版| 国产一区二区三区在线影院| 67194线路1(点击进入)手机版| 报告夫人漫画画免费读漫画在线观看漫画ag| 亚洲av午夜成人片精品网站| 男女之间差差差| 又黄又爽又色的视频| 久草网在线视频| 国产精品无码专区在线观看| 一级特黄aaa大片大全| 杨贵妃艳史毛片在线播放免费观看| 免费黄色大片网站| 老板在娇妻的身上耸动| 国产精品一区二区三区免费| 一个人看的www免费高清中文字幕 一个人看的www免费高清中文字幕 | 一本色道久久88加勒比—综合| 极品色αv影院| 亚洲成人午夜电影| 毛片免费观看视频| 亚洲精品欧美综合| 激情伊人五月天久久综合| 啊灬啊灬别停啊灬用力啊| 欧美交换性一区二区三区| 夜夜高潮天天爽欧美|