浅析十个IE不支持的CSS样式属性

开发 前端
我们这里将介绍十个IE不支持的CSS样式属性,希望本文能对大家在IE下使用CSS样式有所帮助。

对于有些CSS样式属性,IE并不支持。掌握这些不支持的属性,我们就可以在今后的网页设计中,避开这些CSS样式属性。

今天的这篇文章主要讲了:IE6对一些CSS样式属性的不支持。了解IE6不支持哪些属性,我们就可以根据浏览器有针对性的去写css样式代码和hack了。 

1.outline属性:

outline(轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。

outline属性是一个简写属性,用于设置元素周围的轮廓线。

注释:轮廓线不会占据空间,也不一定是矩形。我认为outline属性好就好在,字不占据任何的空间。outline的作用就像border一样也是为了突出某个元素,但是如果是某些块及元互的话,如果加border的话,整体的宽度会增加2px. 因为outline不支持IE浏览器,所以我们经常用borde属性。

2. Inherit (值)属性:

inherit故名思意是“继承”的意思。所以它所表达的值也是继承相关的了。
通过在特定元素上设置某些样式来告诉该元素 “继承”它父级元素的所有已添加的属性,这样你就可以避免相当多的键盘输入。
这可以通过设置 inherit 来很容易的实现。比如,当重写 background 属性的时候,常常会有很多的文字在该属性中(色彩、图片的URL地址、位置等)。所以,与其重新写这些值,你可能仅仅想要考虑中的元素和其父级元素有相同 的背景属性,一个 inherit 值就可以搞定一切——这显然大大的节省了键盘输入。
给大家一个简单的inherit 小实例你会很明白了:

  1. <html><style> 
  2. body { color: red; background: green ;}  
  3. h1 { color: yellow; background: blue ;}  
  4. p {color: white ; background: black ;}  
  5. em {color: inherit ;} /*这个"继承"是默认的,可以不写*/  
  6. </style><body> 
  7. <h1>aaa <em>继承的文字</em> aaa</h1> 
  8. <em>继承的文字</em> 
  9. <p>P中间的文字</p> 
  10. <em>继承的文字</em> 
  11. </body></html> 

很可惜的是inherit 值在IE6和IE7不被支持(除了用于 direction (文字方向) 和 visibility 属性)。

3.Empty-Cell属性

empty-cells属性设置是否显示表格中的空单元格(仅用于“分离边框”模式)。

注释: IE浏览器不支持此属性。

继承性:Yes

Empty-Cell属性的两个值:

hide 默认。不在空单元格周围绘制边框。

show 在空单元格周围绘制边框。

实例如下:table{  empty-cell:show; }

该属性只用于table或者”display”属性被设置为”table-cell”的元素。如果你动态的为一个table添加内容,就可能会遇到某个单元格的内容为空的情况,然后你又不希望这个空的单元格的边框、背景色、背景图片等隐藏掉, ”empty-cells: show”解决这一问题。相反可以用”empty-cells: hide”它会将会使单元格完全隐藏掉。

4.Caption-Side属性

设置或检索表格的caption对象是在表格的那一边。它是和caption对象一起使用的属性
说到table 的属性,这个属性用于声明显示在表格的侧栏的表格标题。它接受 top 、 bottom 、 left 和 right 四个值。

Css样式示例:

  1. table caption { caption-side: top; width: auto; text-align: left; } 

原文标题:10个IE不支持的CSS样式属性详解(一)

链接:http://www.cnblogs.com/listly/archive/2009/09/18/1569471.html

【编辑推荐】

  1. CSS 3中的炫目新功能抢先预览
  2. CSS 3备受期待的8大功能
  3. CSS网页布局困扰新手的八个问题
  4. 25个下拉菜单导航脚本下载
  5. HTML 5 正式标准恐将2022年才能正式发布
责任编辑:彭凡 来源: 博客园
相关推荐

2010-09-06 15:35:27

2010-08-20 09:47:54

2010-08-27 16:07:50

2010-08-18 16:34:53

IE6CSS

2010-09-03 14:57:33

CSS样式表CSS

2010-08-23 15:07:28

IE6CSS

2010-09-01 13:08:42

2011-12-09 20:28:50

2012-07-06 09:27:29

jQuery2.0

2023-02-26 21:56:14

2010-09-08 14:35:22

CSS

2013-04-19 14:28:42

jQueryjQuery2.0

2009-11-26 15:53:58

IE9系统发布

2023-11-01 10:14:02

前端CSS属性

2022-07-07 09:19:24

JavaScript代码样式规则

2010-08-19 10:22:11

IE6min-height

2010-12-21 14:59:10

CSS 3IE

2011-03-18 10:37:27

2020-07-02 10:30:52

iPhone苹果北斗

2020-12-01 10:37:13

微软操作系统web
点赞
收藏

51CTO技术栈公众号