.footer p
{
line-height: 30px;
margin-top: 10px;
margin-bottom: 10px;
}
}
.header
{
height:64px;
background-color: #fff;
border-bottom: 1px solid #1cb234;
position: fixed;
z-index: 2;
width: 1100px;
margin: 0 auto;
left: 0;
right: 0;
}
为什么上面多了一个结束花括号会导致下面的.header的样式失效,求解析原理,半天没想明白,跪谢!!!
PS:补充一下,这是在一个很长的CSS文件里面蛮靠前的位置,结果失效的仅仅是.header部分,其他部分的样式完全没有受到影响。
语法错误,无法解析
由于不知道如何翻译,所以先解释一下几个概念:declaration
:空值或者由属性名,冒号(:),属性值组成。statement
:@规则或者规则集(包括selector
,{
,}
以及之间的所有declaration block
)。selector
:在{
之前,}
之后的内容
当浏览器解析css的statement的时候,首先会确定selector
,然后{
,declaration block
,},浏览器会把}\n\n.header
当成selector
,因为无法解析这个selector
,所以会忽略后面的declaration block
,所以只有.header
选择器的内容出错,后面的依然可以正常解析.
参考:css syndata
上面是我看了w3c文档之后的理解,不一定,有什么不对的敬请指正。
这是语法错误吧。。。
纠结这干啥!知道多一个括号有影响删除就是了!顶多就语法错误!
这样的语法错误 会使得浏览器无法解析下去 导致下文的CSS样式不会生效 建议配合一些CSS检查工具