CSS Hack - For all browser

作者:Kaman 日期:2009-04-20

字体大小: 小中大

所有浏览器的hack。包含IE8 hack。
利用浏览器执行css的顺序（从左到右书写顺序）覆盖以前的样式和浏览器支持的情况，为每个浏览器筛选出来单独的样式。
先看列子：(推荐一个测试所有版本IE页面的工具-IETester)

HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank" rel="external">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml" target="_blank" rel="external">http://www.w3.org/1999/xhtml</a>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS-Hack - For all browser</title>
<style>
.box{
	width:200px; 
	height:200px;
	text-align:center;
	color:#FFF;
	font:18px/200px Tahoma;
	
	background:#000;     /* 所有浏览器为黑颜 色*/
	background:#903\9;	/* IE6、IE7、IE8 为红颜色 */
	*background:#C93;	/* IE6、IE7 为黄颜色 */
	_background:#06F;	/* IE6 为蓝颜色 */
}

/*Safari和Chrome 下显示为灰颜色*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
.box{background:#888;}
	}
</style>
</head>

<body>
<fieldset><legend>各个浏览器下方块颜色</legend>
<br />
<div class="box">CSS Hack <sub>for all browser</sub></div>
<br />
IE8红色   IE7黄色   IE6蓝色    Firefox黑色    Safair&Chrome灰色
</fieldset>
</body>
</html>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

核心

引用内容

“\9”     IE6 IE7 IE8 可识别
“*”      IE6 IE7       可识别
“_”    IE6        可识别

例句

程序代码

    background:#000;         /* 所有浏览器为黑颜色*/
    background:#903\9;    /* IE6、IE7、IE8 为红颜色 */
    *background:#C93;        /* IE6、IE7 为黄颜色 */
    _background:#06F;        /* IE6 为蓝颜色 */

这样像其他浏览器 firefox等就会呈现最前的样式黑色；注意“\9”的斜杠方向反斜杠；

延伸
Safari和Chrome都是webkit的引擎内核是一样的。

程序代码

/*Safari和Chrome 下显示为灰颜色*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
.box{background:#888;}
}

[本日志由 Kaman 于 2009-04-29 12:06 AM 编辑]

文章来自: 本站原创

引用通告: 查看所有引用 | 我要引用此文章

评论: 1 | 引用: 0 | 查看次数: -

木易[2009-04-27 08:01 AM |

]

老大你的css很有问题需要提高

Kaman 于 2009-04-29 11:27 AM 回复

呵呵要提高

发表评论

昵　称:
密　码:	游客发言不需要密码.
内　容:	正在加载编辑器...
验证码:
选　项:	禁止表情转换禁止自动转换链接禁止自动转换关键字

you can:创建我的帐号.