區別 ff, ie7.0, ie6.0不同瀏覽器,CSS hack寫法

來源:互聯網
上載者:User

1.
*+html 與 *html   是IE特有的標籤, firefox 暫不支援,而*+html 又為 IE7特有標籤。因此便可以很方便的得到一個針對於
FireFox、IE6、IE7三種不通瀏覽器的hack執行個體代碼如下:

<html><br /><head><br /><mce:style><!--<br />#wrapper { width: 120px;height:100px; background:#ff0; } /* FireFox */<br /> *html #wrapper { width: 80px;} /* ie6 fixed */<br />*+html #wrapper { width: 60px;} /* ie7 fixed, 注意順序 */<br />--></mce:style><style mce_bogus="1">#wrapper { width: 120px;height:100px; background:#ff0; } /* FireFox */<br /> *html #wrapper { width: 80px;} /* ie6 fixed */<br />*+html #wrapper { width: 60px;} /* ie7 fixed, 注意順序 */ </style><br /></head><br /><body><br /><div id="wrapper"></div><br /></body><br /></html><br />

 

 

2.
IE6能識別*,但不能識別 !important,IE7能識別*,也能識別!important;FF不能識別*,但能識別!important;因此也可以寫出一個針對於FireFox、IE7、IE6三種不通瀏覽器的hack執行個體代碼如下:

<html><br /><head></p><p><mce:style><!--<br /> #wrapper { width: 120px;*width: 60px !important;*width: 80px;height:100px; background:#ff0;}<br />/*注意 firefox的寫在前面,IE7的寫在中間,IE6的寫在最後面*/<br />--></mce:style><style mce_bogus="1"> #wrapper { width: 120px;*width: 60px !important;*width: 80px;height:100px; background:#ff0;}<br />/*注意 firefox的寫在前面,IE7的寫在中間,IE6的寫在最後面*/</style><br /></head><br /><body><br /><div id="wrapper"></div><br /></body></p><p></html>

 

 

3.
還有可以利用的是ie6.0支援底線(即"_"),因此也能寫出一個針對於FireFox、IE7、IE6三種不通瀏覽器的hack執行個體代碼如下:
<html><br /><head></p><p><mce:style><!--<br />#wrapper { width: 120px;*width: 60px;_width: 80px;height:100px; background:#ff0;}</p><p>/*注意 firefox的寫在前面,IE7的寫在中間,IE6的寫在最後面*/<br />--></mce:style><style mce_bogus="1">#wrapper { width: 120px;*width: 60px;_width: 80px;height:100px; background:#ff0;}</p><p>/*注意 firefox的寫在前面,IE7的寫在中間,IE6的寫在最後面*/</style><br /></head><br /><body><br /><div id="wrapper"></div><br /></body></p><p></html>

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.