![]() |
当前位置: 电脑软硬件应用网 > 设计学院 > 网络编程 > CSS教程 > 正文 |
|
|||
CSS Hack区分浏览器 IE6 IE7 IE8 Firefox Opera Safari | |||
2010-1-23 9:08:04 文/网络收集 出处:电脑软硬件应用网 | |||
CSS Hack是在标准 CSS 没办法兼容各浏览器显示效果时才会用上的补救方法,我们在52css.com中不泛深入介绍CSS兼容性的文章。在各浏览器厂商解析 CSS 没有达成一致前,我们只能用这样的方法来完成这样的任务。 在45its.com上你可能能搜索到一大堆的 CSS Hack,但是我今天发布的你可能并不都很了解,因为这些都是只针对单独一个浏览器的 CSS Hack。为了向你展示这些 CSS Hack 是否正常运作,我新建六个 P 标签,并给每一个 P 标签一个特有的 id。这将向你展示 CSS Hack 的运作情况。 <p id="opera">我来自 Opera 7.2 - 9.5</p> 然后我让这些 P 标签默认都不显示 <style type="text/css"> body p{display: none;} </style> 使用 IE CSS 条件注释区分 IE 浏览器 <!--[if IE 7]> 使用 CSS 解析器 Hacks 区分 IE html > body #ie7 {*display: block;}
body:empty #firefox12 {display: block;} CSS Hack 区分 Safari @media screen and (-webkit-min-device-pixel-ratio:0) {#safari { display: block; }} 然后,全部合在一起便是 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
html > body #ie7 { body #ie6 { body:empty #firefox12 {
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { CSS Hack 虽好且方便兼容各浏览器,但是通不过 W3C 验证,所以还得自己权衡是否有必要去使用。 |
|||
最新热点 | 最新推荐 | 相关文章 | ||
CSS伪类选择器nth-child() css3教程:background属性调整增强 css教程:CSS3 Media Queries 详解 CSS 类名的长命名和短命名 CSS实例教程:非浮动区域设置宽度 如何使用css约束一个层不可见? CSS的list-style解释 小议使用“完整”的CSS的缺点 CSS中的相对定位与绝对定位详解 实例使用DIV+CSS制作圆角边框加阴影… |
关于45IT | About 45IT | 联系方式 | 版权声明 | 网站导航 | |
Copyright © 2003-2011 45IT. All Rights Reserved 浙ICP备09049068号 |