易截截图软件、单文件、免安装、纯绿色、仅160KB

CSS Hack 总结


浏览器越来越多,不同的浏览器,不同的版本在页面的渲染上都各不相同。这让网页开发人员很头疼,为了能兼容各个浏览器,人们挖掘出了很多 CSS Hack。下面进行一下总结,如果还有其他的 CSS Hack 欢迎提供。
一) 针对 IE 的 Hack
大部分 CSS Hack 都是针对 IE 的,这是用于我们的 IE "坚强"所致,尤其是 IE6。
#test {
    color:red; /*所有浏览器*/
    +color:blue; /*所有 IE */
    _color:green; /*IE 6及以下*/
    _color /**/:pink; /*IE 5*/
}
由于 CSS 是后面的覆盖前面的。所以以上 CSS 分别对应 非IE,IE7,8,IE6,IE5。以上 Hack 基本可以满足需求。
不过 IE 还有一些其他的 Hack。
\9 Hack:
#test {
    color:red; /*所有浏览器*/
    +color:blue\9; /*IE 5 以上*/
}
在属性后面加个 "\9" 就可以了。你可能会奇怪:其他的数字不行吗?我试了下,好像是不行,不过 9 前面可以加几个 0。我觉得这个不必深究,能用就行了。
* html Hack:
#test { /*所有浏览器*/
    color:red;
}
* html #test { /*IE 6及以下*/
    color:blue;
}
这个 Hack 用于区分 IE6 和其他浏览器。在 CSS 属性比较多的情况下比较有用。值得一提的是,这个 Hack 是符合标准的。
[xmlns] Hack:
刚刚的 "* html" Hack 是 IE6及以下支持,其他浏览器不支持。 "[xmlns]" Hack 刚好相反。
[xmlns] #test { /*IE 6及以下不支持*/
    color:green;
}
注意:这个 Hack 要求HTML 必须要有< !DOCTYPE >头部以及有xmlns属性才会起作用。不过这个问题似乎不大,现在绝大部分网页都有这两个东东,包括 Dreamweaver 默认新建的网页都会自动加上
Mac 下 IE Hack:
/*\*//*/
#test {
    color:blue;
}
/**/
二) 针对 Gecko(Firefox, Netscape) 的 Hack
@-moz-document url-prefix(){
    #test {
        color:yellow;
    }
}
包含在 @-moz-document url-prefix(){} 之间的 CSS 只有 Gecko 内核的浏览器才会支持。所以对于 Firefox 可以用这个 Hack。
三) 针对 KHTML(Chrome, Safari), Opera 的 Hack
@media screen and


相关文档:

div+css冲突

在制作一个浮动图片用于网站显示时,出现图片固定不浮动,最终检查发现 DIV浮动与
http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd冲突
去掉这段可暂时实现浮动。
但此代码不可随意去掉,去掉后又会导致DIV某些属性混乱。幸好此次暂时不使用某些功能
临时解决办法,期待更好的解决办法 ......

css hack 学习总结

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Hack: 区分 I ......

css学习总结

一 关于css的id选择符
      每个html的元素都包含一个id属性,该属性是唯一的,可以唯一标示一个元素,我们就可以选择更具体的元素。is属性由井号加id组成。
p#bulletinContent
{
  color:Yellow ;
  background-color:Maroon ;  
}
  html界面如下:
 &l ......

学习css中的摘录

链接方法:
     外部链接样表:<head><link rel="stylesheet"  type="text/css" href="*.css"></head>
     内部的:1:<head><style type="text/css">  example css </style></head>
     &nbs ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号