按标签归档 css hack

专属 CSS Hack

转载：浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer
/* Opera */
html:first-child #opera
{
display: block;
}
/* IE 7 */
html > body #ie7
{
*display: block;
}
/* IE 6 */
body #ie6
{
_display: block;
}
/* Firefox 1 – 2 */
body:empty #firefox12
{
display: block;
}
/* Firefox */
@-moz-document url-prefix()
{
#firefox { display: block; }
}
/* Safari */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
#safari { display: block; }
}
/* Opera */
@media all and (-webkit-min-device-pixel-ratio:10000), [...]

IE8的css hack

首先感谢“丸子”提供的这个IE8的css hack；
关注过IE8的css hack的人相信大家都在使用这个hack，就是“\9”的css hack：
.test{
color:#000000;                  /* FF,OP支持 */
color:#0000FF\9;       /* 所有IE浏览器(ie6+)支持 ；但是IE8不能识别“*”和“_”的css hack；所以我们可以这样写hack */
[color:#000000;color:#00FF00;      /* SF,CH支持 */
*color:#FFFF00;                 /* IE7支持 */
_color:#FF0000;               /* IE6支持 */
}
包括我自己也是使用这种的，这是我前段时间整理的《主流浏览器的一些CSS hack》。(转载请注明出处：WEB前端开发 http://www.css88.com/)
很多人再研究color:#0000FF\9;中的为什么IE6-IE8支持“\9”写法，和它的原理，我只是个工程师，不是科学家，我不懂为什么和它的真正原理，真的！很惭愧！
昨天在某个群里也看到部分前端工程师或网页重构师势利的一面，同样的一个解决方案，大公司有名的前端工程师或网页重构师写的东西都追捧，而小公司没名气的前端工程师或网页重构师写的解决方案却被反问：“css有这种写法吗？看来你连最基本的css的几个属性和属性值都没搞懂；就算你解决了问题你写的css也是不规范的，就是规范你跟我讲讲你解决方案的原理；”同样的一个解决方案，大公司有名的前端工程师或网页重构师写的这些反问质疑就全都没了，拼命的去研究他这个解决方案，呵呵，我觉得那些人很可笑。还有很多人问问题只有得到大公司有名的前端工程师或网页重构师的肯定回答后才放心而又开心的走了，甚至不留一句谢谢。当然没人（包括我）否认大公司有名的前端工程师或网页重构师在业界的影响力，他们为前端和重构业界做的贡献大家都是看得到的，只是觉得做人（特别是我们做技术的）不能太势利，多一点技术共享和探讨，多一点感激，学习成长才是最重要的。我承认我以前经常骂人，骂人家SB，内参国王说的对，骂人家SB就等于骂自己SB，我以前是很SB。不想探讨就看着呗，骂人是不对的！(转载请注明出处：WEB前端开发 http://www.css88.com/)
扯远了，回到IE8的CSS hack，讲讲color:#0000FF\9：

主流浏览器的一些CSS hack

前段时间刚刚专门研究了的针对IE8的CSS hack(原文地址： http://www.css88.com/archives/1210 ),不过很多朋友还是问我一些其他浏览器的css hack，其实我还真的没有去研究过，今天有个朋友又问我了，我也称这个机会学习了一下。
主要hack如下：(转载请注明出处：WEB前端开发 http://www.css88.com/)

.test{
 color:#000000;                  /* FF,OP支持 */
 color:#0000FF\9;       /* 所有浏览器IE浏览器(ie6+)支持 ；但是IE8不能识别“*”和“_”的css hack；所以我们可以这样写hack */
 [color:#000000;color:#00FF00;      /* SF,CH支持 */
 *color:#FFFF00;                 /* IE7支持 */
 _color:#FF0000;                 /* IE6支持 */
}

另外随着google Chrome和Safari浏览器的流行，找google Chrome和Safari CSS hack的人也不少。我也找了一下：

针对IE8正式版的CSS hack

IE8正式版出来有一段日志了，但是针对ie8正式版的CSS hack却很少，其实这是值得庆幸的，因为ie8修复了很多IE6和IE7的一些BUG，更加接近W3C标准。
针对IE8正式版的CSS hack目前可以找到的分为2种：(转载请注明出处：WEB前端开发 http://www.css88.com/)
第一种：”\9″：
基本的写法:

.test { color/*\**/: blue\9 }

这个IE6、IE7、IE8都能识别；但是IE8不能识别“*”和“_”的css hack；所以我们可以这样写hack：(转载请注明出处：WEB前端开发 http://www.css88.com/)

.header {width:300px;} /* 所有浏览器*/
.header {width/*\**/:330px\9;} /* 所有浏览器IE浏览器 */
.header {*width:310px;} /* IE7和IE6能识别,IE8和FF不能识别*/
.header {_width:290px;} /* IE6能识别，IE7、IE8和FF不能识别*/