CSS hack
来源:互联网 发布:linux ping指令 编辑:程序博客网 时间:2024/06/11 01:26
- hack
- CSS hack
- IE条件注释
- outline
- outline 与 border 的区别
- outline兼容
- before after
- 清除浮动
- display table-cell
- display inline-block
- hack
- IE Quirks
- 问题
hack
CSS hack
IE6能识别 *
, 但不能识别 !important
,IE6支持属性前加下划线(IE7 FF不支持)。
IE7能识别 *
, 也能识别 !important
。
Firefox不能识别 *
,但能识别 !important
。
-
减号是IE6专有的hack
\9
IE6/IE7/IE8/IE9/IE10都生效
\0
IE8/IE9/IE10都生效,是IE8/9/10的hack
\9\0
只对IE9/IE10生效,是IE9/10的hack
IE条件注释
IE可识别<!--[if IE]> Only IE <![endif]-->只有IE5.0可以识别<!--[if IE 5.0]> Only IE 5.0 <![endif]-->只在IE6以上版本生效<!--[if gte IE 6]>只在IE6以上(包括IE6)版本IE浏览器显示<![endif]-->IE5.0以上版本<!--[if gt IE 5.0]> Only IE 5.0+ <![endif]-->IE6以下版本<!--[if lt IE 6]> Only IE 6- <![endif]-->只在IE8上不生效<!--[if ! IE 8]>非IE8浏览器显示<![endif]-->非IE浏览器生效<!--[if !IE]>非IE浏览器显示<![endif]-->
outline
outline: outline-color outline-style outline-width inherit
inherit:规定是否从父元素继承outline属性的设置
outline 与 border 的区别
border 可应用于几乎所有有形的html元素,而 outline 是针对链接、表单控件和ImageMap等元素设计。从而另一个区别也可以推理出,那就是: outline 的效果将随元素的 focus 而自动出现,相应的由 blur 而自动消失。这些都是浏览器的默认行为,无需JavaScript配合CSS来控制。
outline 不会象border那样影响元素的尺寸或者位置。
outline兼容
如果规定了 !DOCTYPE,则 IE8 支持 outline 属性。
IE为HTML元素扩展了一个hideFoucs
属性 hideFoucs="true"
时则获得焦点的虚线框不出现。
Firefox1.5 全面支持,早期的1.0.x有-moz-outline
::before ::after
伪元素不是伪类,为了和伪类区分,双冒号。
伪类元素也会像其他子元素一样正常继承父元素的一些CSS属性,比如字体等。
伪元素如果没有content属性则不起作用,可设置空字符串。
浏览器支持:
- Chrome 2+,
- Firefox 3.5+ (3.0 had partial support),
- Safari 1.3+,
- Opera 9.2+,
- IE8+ (with some minor bugs),
清除浮动
如果父元素未设置height,那么父元素的height就由子元素撑开,而子元素设置了float脱离了正常的文档流,那么父元素的height就会被忽略。
display: table-cell
浏览器支持:
IE8+
display:table-cell 可能会被float, position: absolute等破坏,
设置了display:table-cell的元素对宽度高度敏感,对margin值无反应,响应padding属性
display: inline-block
IE6/7中的inline元素只要触发了hasLayout其表现就类似inline-block,设置zoom:1
display: inline-block
等其他属性可触发hasLayout。
对于IE6/7中的block元素,即使触发了hasLayout元素也无法不换行,这时可以强制为inline元素不换行,然后通过zoom触发hasLayout就可设置宽高:
{ display: inline-block; *display: inline; *zoom: 1;}
IE Quirks
Q Quirks mode 怪异模式或混杂模式S Standards mode 标准模式- 6SQ* 6SQ 7SQ 8Q 9Q 10Q+ 6SQ 7SQ 8Q 9Q 10Q_ 6SQ 7Q 8Q 9Q# 6SQ 7SQ 8Q 9Q\0 8S 9S\9\0 9S 10S!important 7S 8S 9S 10S 10Q
问题
img标签在a中,ie有蓝色边框?
img设置border: 0px
ie8/9 a标签点击出现边框虚线
a { hidefouce: true;}
其他浏览器a:fouce {outline: 0;}
IE7/8 border-radius 圆角
只能用图片
- CSS Hack
- CSS Hack
- CSS hack
- css hack
- css hack
- CSS hack
- css hack
- css hack
- Css Hack
- CSS Hack
- css hack
- css hack
- css hack
- CSS Hack
- CSS Hack
- css hack
- css hack
- CSS hack
- java字节码(.class)文件深度解析
- 如何进行有效的沟通
- 第0章 理论概要
- 负载均衡算法的种类
- 使用LFM(Latent factor model)隐语义模型进行Top-N推荐
- CSS hack
- 非负矩阵分解 NMF(Non-negative Matrix Factorization )
- eclipse配置tomcat,访问http://localhost:8080出现404错误
- 从MVC到前后端分离
- sql server 时间操作
- 以操作系统的角度述说线程与进程
- 7款免费的IOS9图形用户界面和模板
- 自定义UITableViewCell的背景颜色
- 程序之间的跳转 iOS开发