css伪类时冒号前后多个空格可导致该规则失效

网络整理 - 07-27

有些童鞋为了方便可能会使用CSS格式化程序对网上搜集下载下来的CSS代码进行处理，但是有时候处理后可能会导致伪类时冒号前或者后多个空格，这样有些规则可能就失效了，下面这个例子就是如此。代码如下：

a:link {

color:gray;
}

           a:visited {
               color:red;
            }
          /* 注意下面a:后面多个空格*/
            a: hover {            /* hover{}鼠标放在div上面时的样式*/
                        /* ie6不支持a以外的标签使用伪类:hover*/
                                /*注释:a:hover{}就是链接*/
                color:yellow;
            }
       </style>
</head>
<body>
       <a href="">建站学</a>
</body>
</html>

我们可以看到，当空格去掉以后效果就出来了，空格添上去规则就失效了。在冒号前多了个空格也一样会失效，所有浏览器中测试hover规则没起作用。