华仔博客

  • 首页
  • seo
  • 网站建设
  • 工具资源
  • 生活
  • 程序开发
  • 网上那点事
  • 网络营销
华仔博客
一个经验分享的博客
  1. 首页
  2. 程序开发
  3. 正文

css兼容问题CSS Hack来帮助你

2013年1月28日 1452点热度 0人点赞 0条评论

曾经以前虽然了解过css,div 但对浏览器的兼容问题真的一无所知。这次折腾商城,经过朋友介绍等,还有css hack 这个神奇的东西。我试用之后发现真的很好用。很多人都为了浏览器的兼容问题而烦恼,亲用了css hack 一切都解决了呼呼。直接分享下整理的css hack
CSS Hack是在标准CSS没办法兼容各浏览器显示效果时才会用上的补救方法,在各浏览器厂商解析CSS没有达成一致前,我们只能用这样的方法来完成这样的任务.

我进行前端开发的时候,测试用的浏览器大致有: IE7, IE6, Opera9(文章撰写时版本为9.25 8825), Safari3(文章撰写时版本为3.0.4 523.15), Firefox2(文章撰写时版本为2.0.0.11).

在正常的 selector { property:value; } 的基础上常会根据具体情况为相同元素使用Hack以达到浏览器间统一.

IE系列:

selector { +property:value; } 在属性名前加上加号"+",这个Hack只有IE系列可以识别.
selector { *property:value; } 在属性名前加上星号"*",这个Hack只有IE系列可以识别.
selector { _property:value; } 在属性名前加上下划线"_",这个Hack只有IE系列 (除IE7外) 识别.
* html selector{ property:value; } 在选择器上运用继承法 * html selector, 这个Hack只有IE系列 (除IE7外) 可以识别.
html/**/ >body selector { property:value; } 在选择器上运用继承法 html/**/ >body selector ,这个Hack只有IE系列 (除IE7外) 可以识别.
selector { property/**/:value; } 在属性名和冒号":"之间加入注释,屏蔽IE6用.
selector/**/ { property/**/:value; } 在选择器和花括号"{"之间以及在属性名和冒号":"之间加入注释,屏蔽IE5和IE6用 (不屏蔽IE5.5) .
select/**/ { property:value; } 在选择器和花括号"{"之间加入注释,屏蔽IE5用.
*+html selector { property:value !important; } 在选择器上运用继承法 *+html selector 再加上 !important, 这个Hack只有IE7可以识别.

Firefox:

*:lang(lang) selector { property:value !important; } 用伪类lang(语言)再加上!important进行定义的话,目前只有Firefox可以识别.

Safari:

selector:empty { property:value !important; } 用伪类empty再加上!important进行定义的话,目前只有Safari可以识别.

Opera:

@media all and (min-width: 0px){ selector { property:value; } } 利用特殊继承法进行定义的话,目前只有Opera可以识别.

以上的Hack并不完整,大家一起补充.

对Hack的运用,最普遍的是CSS盒模型Hack,清除浮动Hack.

CSS盒模型在IE5.X上是有严重解析错误的.这个Hack针对IE5.X:

selctor { width:IE5.X宽度; voice-family :""}""; voice-family:inherit; width:正确宽度; }

清除浮动Hack,相信这个定义用的人很多:

selector:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

另外还有很多很多CSS Hack的运用,一一列举的话可能能写成一本书了...想到再添加吧.

标签: css css hack
最后更新:2013年1月28日

admin

这个人很懒,什么都没留下

点赞
< 上一篇
下一篇 >

文章评论

取消回复
广告
搜索
最新 热点 随机
最新 热点 随机
谷歌SEO的页面标题和元描述的长度多长最合适? 如何利用wordpress编辑网站页面 Hitpaw watermark remover去图片视频水印神器 中国教育报发稿联系方式 WordPress博客页面和文章 如何充分利用您的 SEMrush 帐户 什么是 Robots.txt 文件以及Robots.txt 文件如何工作 ? WordPress列表页分页制作教程 youtube视频响应式插件Simple YouTube Responsive WordPress文章页添加展开/收缩功能 WordPress栏目调用去掉Ul标签 WordPress如何调用置顶文章 《长安三万里》云盘分享 《名侦探柯南:黑铁的鱼影》云盘分享 《变形金刚:超能勇士崛起》云盘分享 如何使用奈飞Netflix cookies登录奈飞Netflix 《蜘蛛侠:纵横宇宙》云盘分享 长空之王云盘分享 阿诺施瓦辛格第一部电视剧《面目全非FUBAR》云盘分享 闪电侠第九季云盘分享 速度与激情10云盘分享 永生战士2022 灌篮高手电影粤语版云盘分享 超级马力欧兄弟大电影云盘分享 银河护卫队3百度云盘阿里云盘 漫长的季节阿里云盘 GSA Search Engine Ranker项目屏幕 GSA Search Engine Ranker内容创建服务推荐 GSA Search Engine Ranker 仿写服务推荐 GSA Search Engine Ranker电子邮件账户推荐
谷歌SEO的页面标题和元描述的长度多长最合适?
为什么要研究页面价值 dedecms当前栏目高亮以及主页高亮的方法 网站更换主题喽 js实现的最简单的滑动门 泰坦第四季第二部分阿里云盘 一位做10年seo的老外经验之谈 百度搜索上线ICP备案信息展示 迈耶Google高层跳槽,担任雅虎新任CEO seo博客_关键词的密度及提高关键词密度的方法 北京seo详细介绍如何获取sitemap激活码 apache服务器默认首页的设置方面 北京seo_网站内部优化不可全少的一部分-友情链接 360和百度大战之百度开始反击 谷歌SEO的页面标题和元描述的长度多长最合适? SEMrush 团购账号-SEMrush 的优点 银河护卫队3百度云盘阿里云盘 win8 三个版本的详细介绍(附加各版本的下载地址) 如何将你裂变与转换的效率提升10倍 如何判断页面价值 兄弟贾磊谈域名注册要领 怒呛人生阿里云盘 谷歌feedburner邮件订阅详细介绍 马特·卡茨谈关键字堆砌和隐藏文本 ios开发笔记 keepalived 安装教程 年度最给力,冰点促销来袭,你准备好了吗? GSA Search Engine Ranker内容创建服务推荐 号外号外谷歌字体国内已经正常打开 网站必备神器,页面即时QQ提取并发起会话发送邮件 你若不离不弃,我必生死相依(雅安地震爱情集锦)

© 2012-2023 sem-home.com.版权所有.

主题KRATOS貌似作者网站打不开了,就没加,嗯就这样

京ICP备12020022号