IE6.0不支持的CSS(不断更新中)....

来源:互联网 发布:高中英语单词录音软件 编辑:程序博客网 时间:2024/06/16 12:32
最近正在学习CSS,有的CSS在IE6.0中并不支持的,现在用IE6.0和7.0的比较多,我用的是IE6.0,所以就在此说说IE6.0不支持的CSS了。

       1、不支持的伪类

       1.1 不支持:first-child伪类

解决方法:用class属性,例如在html的storybody类中的第一个段落为<p class="firstone">,然后将CSS更改为:

.storybody p:first-child, .storybody p.firstone

                   { font-size: large; }

当然,这样前面的选择符变为冗余,因为其他浏览器理解基于类的工作方式。因此,如果用户要添加该工作方式,就可能要完全停止使用:first-child。

         1.2 不支持:lang伪类

         1.3 不支持:focus伪类

          2、不支持的选择符

          2.1 不支持属性选择符

                        举一个属性选择符的例子:

    h1[class] {color: silver;}将会作用于任何带classh1元素,不管class的值是什么。所以<h1 class="hoopla">Hello</h1><h1 class="severe">Serenity</h1><h1 class="fancy">Fooling</h1>h1都会受到这条规则的影响。

                         最后一个属性选择符语法: E1[attr|=value] ,如下例:

                   *[lang|="en"] {color: blue;},这条规则将会选择属性lang的值en或者以en-开始的元素。也就是说,它可以匹配<h1 lang="en">Hello!</h1><p lang="en-us">Greetings!</p><div lang="en-au">G'day!</div>而不匹配<p lang="fr">Bonjour!</p><h3 lang="cy-en">Jrooana!</h3>

        2.2 不支持子选择符

                        子选择符语法:E1 > E2
                       例:body > p { font-size:14px; }                /* 所有作为body的子对象的p对象字体尺寸为14px */

                        说明:子选择符的意思是说直接子代,要区别于包含选择符。

       2.3 不支持近亲选择符

                   近亲选择符语法:E1 +E2

        3. 不支持的规则

                   3.1  不支持@import规则

语法:
@import             url (url) sMedia ;

说明:
url :  使用绝对或相对地址指定导入的外部样式表文件。请参阅link对象
sMedia :  指定设备类型。

指定导入的外部样式表及目标设备类型。

该规则必须在样式表头部最先声明。并且其后的分号是必需的,如果省略了此分号,外部样式表将无法正确导入,并会生成错误信息。

用此规则导入的样式表,其owningElement特性是一个link对象或style对象。导入的外部样式表中的定义将被文档中的同名定义覆盖。

示例:

@import url("foo.css") screen, print;
@import "print.css"

       4、 不支持的字体和文本属性

                4.1 不支持white-space

                               我在Opera9中是支持此属性的

        4.2 不支持text-decoration:blink;(只是不支持闪烁这个属性)

                                我在Opera9中是支持此属性的

      5、 IE对表单样式支持的不是很好,只支持一小部分。

        6、 IE对布局支持不是很好。

               6.1 float属性支持不是很好

                   HTML代码如下:

<html>
        <head>
          <title>Accessibility of Color</title>
          <style type="text/css">
            .pullquote
               { float: right;
                 font-family: Verdana, sans-serif;
                 text-indent: 0;
                 border: 5px solid blue;
                 padding: 0.5em;
                 margin: 2em;
                 background-color: silver; }
            .pullquote img
               { float: right; }
          </style>
        </head>
        <body>
            <p> 第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         第一段         </p>
          <div class="pullquote">
            <img src="aa.bmp" alt="">
            <p>Kynn says:</p>
            <blockquote>
               <p>"Color is very<br>
               useful to those<br>
               who can see it"</p>
            </blockquote>
          </div>
          <p> 第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         第二段         </p>
        </body>
</html>

         IE显示结果:

Opera显示结果:        7、 不支持表格属性table          7.1 不支持empty-cells属性                 在IE6中,不管怎么设置此属性,空单元格都是隐藏的。在Opera9中支持此属性。         7.2 不支持caption-side属性
原创粉丝点击