CSS Hacks For Firefox, IE, Opera, Safari

作者:SMbey0nd 日期:2008-08-22

字体大小: 小中大

Let's Learn the CSS Hacks For Firefox, IE, Opera, Safari

程序代码

/* 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), not all and (-webkit-min-device-pixel-ratio:0){head~body #opera { display: block; }}

HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>CSS Hacks For Firefox, IE, Opera, Safari</title>
<style type="text/css">
body p{display: none;}

/* 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), not all and (-webkit-min-device-pixel-ratio:0)
{
head~body #opera { display: block; }
}
</style>
</head>

<body>

Opera 7.2 - 9.5
Safari
Firefox
Firefox 1 - 2 
IE 7
IE 6

</body>

</html>

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

[本日志由 SMbey0nd 于 2008-08-22 04:14 PM 编辑]

文章来自: 本站原创

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

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

发表评论

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

虽然发表评论不用注册，但是为了保护您的发言权，建议您注册帐号.