014月

CSS hack:区分IE6,IE7,firefox-网站标准化

SEO/网站推广, 前端开发DIV+CSS

今天在看CSS的写法,发现了一个新的名词”CSS hack”,以前可能一直没有注意到这个写法。现在来介绍一下吧。
CSS hack是指我们为了兼容各浏览器,而使用的特别的CSS定义技巧。

区别IE6与FF:
       background:orange;*background:blue;

区别IE6与IE7:
       background:green !important;background:blue;

区别IE7与FF:
       background:orange; *background:green;

区别FF,IE7,IE6:
       background:orange;*background:green !important;*background:blue;

注:IE都能识别*;标准浏览器(如FF)不能识别*;
IE6能识别*,但不能识别 !important,
IE7能识别*,也能识别!important;
FF不能识别*,但能识别!important;

下划线”_”,
IE6支持下划线,IE7和firefox均不支持下划线。

于是大家还可以这样来区分IE6,IE7,firefox
: background:orange;*background:green;_background:blue;

注:不管是什么方法,书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在最后面。

书写顺序
#example { color: #333; } /* Moz */
* html #example { color: #666; } /* IE6 */
*+html #example { color: #999; } /* IE7 */

使用IE专用的条件注释
<!–其他浏览器 –>
<link rel=”stylesheet” type=”text/css” href=”css.css” mce_href=”css.css” />
<!–[if IE 7]>
<!– 适合于IE7 –>
<link rel=”stylesheet” type=”text/css” href=”ie7.css” mce_href=”ie7.css” />
<![endif]–>
<!–[if lte IE 6]>
<!– 适合于IE6及一下 –>
<link rel=”stylesheet” type=”text/css” href=”ie.css” mce_href=”ie.css” />
<![endif]–>


分享到:



No comments

星期二, 4月 1st, 2008 | 分类:SEO/网站推广, 前端开发DIV+CSS | RSS 2.0 | 留言/评论 | Trackback

留言