CSS Hack的工作原理是什么？(页 1) - CSS常见问题和精华 - CSS论坛

divcss5 发表于 2010-10-25 17:12

CSS Hack的工作原理是什么？

[b]CSS Hack的原理是什么[/b]
由于不同的浏览器对[url=http://www.divcss5.com/]CSS[/url]的支持及解析结果不一样，还由于css中的优先级、浏览器读取识别不同符合的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS-这样就制造了CSS HACK。

比如：IE6能识别下划线"_"和星号"*"，IE7能识别星号"*"，但不能识别下划线"_"，而firefox两个都不能认识。
这样我们刚好可以利用CSS读取顺序原理，来达到IE6\IE7\火狐三者读取不同CSS样式[code].divcss5{
float:left; border:1px solid #F00; height:20px;
width:100px; /* 只有火狐能读取 */
*width:150px;/* IE7与IE6能读取 */
_width:200px;/* IE6能读取 */
}[/code]这样的CSS代码写法，将会实现在IE6\IE7\火狐浏览器之间显示宽度不同。
更细解释就不说了，只需您自己亲自实践，琢磨琢磨，得出结论可以跟贴，支持支持

CSS hack运用时注意：
1、书写顺序
2、认识各浏览器读取与识别符合
3、多实践

[b]补充知识：[/b]
什么是CSS Hack？

由于不同的浏览器，比如InternetExplorer6（IE6）,InternetExplorer7（IE7）,MozillaFirefox（火狐）等，对CSS的解析认识不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果。

这个时候我们就需要针对不同的浏览器去写不同的CSS，让它能够同时兼容不同的浏览器，能在不同的浏览器中也能得到我们想要的页面效果。

这个针对不同的浏览器写不同的CSS code的过程，就叫CSS Hack,也叫写CSS Hack。

更多[url=http://www.divcss5.com/css-hack/]CSS hack教程[/url]：[url=http://www.divcss5.com/css-hack/]http://www.divcss5.com/css-hack/[/url]

wuqilong34 发表于 2011-12-16 11:38

谢谢分享学习了

kicen 发表于 2011-12-23 19:45

width:100px; /* 只有火狐能读取 */ 这行IE6,IE7,FF都可以读取并执行。
*width:150px;/* IE7与IE6能读取 */ 这行就只剩IE6和IE7读取了。
_width:200px;/* IE6能读取 */ 这行仅剩IE6能读取了。
执行方式是以样式表最后定义的样式为准的。是这样么？

1627369620 发表于 2012-3-3 11:43

学习了支持一下啦

709787682@qq.co 发表于 2012-3-11 12:18

回复 4# kicen 的帖子

谁识别谁执行

quechenchao 发表于 2012-3-21 14:22

好像看懂了，呵呵

ping781020 发表于 2012-3-22 11:52

说的比较简单明了！

北京手绘墙 发表于 2012-5-23 08:56

让您与众不同的黑白手绘墙与手绘墙画笔

张辽发表于 2012-5-23 15:37

支持一下顶起来

页: [1]

CSS论坛's Archiver