华仔博客

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

css兼容问题CSS Hack来帮助你

2013年1月28日 1352点热度 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

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

点赞
< 上一篇
下一篇 >

文章评论

取消回复
广告
搜索
最新 热点 随机
最新 热点 随机
继承之战第四季阿里云盘3月26日更新 太阳召唤第二季阿里云盘 小美人鱼真人版阿里云盘待更新 魔术师的大象阿里网盘待更新 梅森探案集第二季阿里云盘 黑暗荣耀第二季阿里云盘 曼达洛人第三季中字4k阿里网盘 ChatGPT for Wechat-在微信上使用ChatGPT Netflix奈飞,HBO Max,Disney+账号会员合租共享 免费的ChatGPT API接口网站-The Free ChatGPT API 最后的生还者4k阿里云盘分享 Ahrefs账号-Ahrefs的终极使用教程 Moz Pro共享账号-Moz工具完整教程 Moz Pro团购账号 Ahrefs正版账号共享使用 Ahrefs共享团购账号 Wordpress文章列表没有缩略图就显示默认图片 SEMrush 团购账号-SEMrush 的优点 2022最新Semrush正版账号共享使用 Semrush团购账号 SEMrush是什么-semrush使用教程 谷歌SEO关键词调研工具SEMRUSH如何使用 wordpress 产品图片放大镜效果制作 phpmyadmin 修改表 Table 'wp_options' is read only GSA Search Engine Ranker 项目窗口详细介绍 iRedMail 支持的密码 Wild Rift 英雄联盟手游美服转日服(国际服之间的转换)教程 网站更换主题喽 Burn It All Down (ft. PVRIS) _Worlds 2021 - League of Legends iredmail批量导入用户
免费的ChatGPT API接口网站-The Free ChatGPT APINetflix奈飞,HBO Max,Disney+账号会员合租共享ChatGPT for Wechat-在微信上使用ChatGPT曼达洛人第三季中字4k阿里网盘黑暗荣耀第二季阿里云盘梅森探案集第二季阿里云盘魔术师的大象阿里网盘待更新小美人鱼真人版阿里云盘待更新太阳召唤第二季阿里云盘继承之战第四季阿里云盘3月26日更新
兄弟贾磊谈域名注册要领 济南seo告诉你如何吸引搜索引擎抓取 北京seo_网站内部优化不可全少的一部分-友情链接 360搜索独立域名今天正式上线了 软文营销的关键环节有哪些? 宝塔面板编译开启ngx_pagespeed成功版 dedecms 点击加载更多功能的实现 localhost与127.0.0.1的区别 dedecms仿淘宝产品显示效果 seo工具_免费刷百度下拉框,百度相关词 马特·卡茨谈关键字堆砌和隐藏文本 13年四川高考高考满分作文:中国式平衡 迈耶Google高层跳槽,担任雅虎新任CEO 男孩实现11年前的爱情约定,女主播现在如何了结 百度公告:对买卖链接行为的提醒,出售链接同样会受打击 SEMrush 团购账号-SEMrush 的优点 怎样利用网摘收藏做好网站推广? QQ自动加好友,自动加群,QQ营销软件 seo工具_无忧帐号管理软件 ios开发IBAction和IBOutlet的介绍 dedecms自定义表单添加时间 完美解决osx下 eclipse 打不开的情况 竞价必备神器,页面访客QQ提取工具 页面价值的研究重点内容 ios开发笔记 牛哥原创:新浪微博比腾讯微博火原因(好友牛海标写的) Google搜索新算法,严惩侵权的网站 奥巴马再来和你玩网络营销 discuz rss全文输出教程 营销魔术师的最新举动......震撼了100万营销人

© 2012-2023 sem-home.com.版权所有.友情链接:章丘新闻

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

京ICP备12020022号