上两篇文章“
Div+css浏览器兼容实例分析(一)
和div+css浏览器兼容实例二:css hack的理解”两篇文章都是讲了关于div+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 来很容易的实现。比如,当重写 background 属性的时候,常常会有很多的文字在该属性中(色彩、图片的URL地址、位置等)。所以,与其重新写这些值,你可能仅仅想要考虑中的元素和其父级元素有相同 的背景属性,一个 inherit 值就可以搞定一切——这显然大大的节省了键盘输入。
给大家一个简单的inherit 小实例你会很明白了:
<html><style>
body { color: red; background: green ;}
h1 { color: yellow; background: blue ;}
p {color: white ; background: black ;}
em {color: inherit ;} /*这个"继承"是默认的,可以不写*/
</style><body>
<h1>aaa <em>继承的文字</em> aaa</h1>
<em>继承的文字</em>
<p>P中间的文字</p>
<em>继承的文字</em>
</body></html>
很可惜的是inherit 值在IE6和IE7不被支持(除了用于 direction (文字方向) 和 visibility 属性)。
很可惜的是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 四个值。
由于时间原因就先介绍这几个属性,请继续关注:IE不支持的实用的CSS属性详解(附实例)(二)
转载于:https://blog.51cto.com/listly/202983