帮忙解读CSS样式

html-css021

帮忙解读CSS样式,第1张

1。红色的部分是继承关系 #header是父层 最高级 其次是.tabbar,再其次是.tabs .bg之类的。

#header .tabbar特指的是在id标签为header下的.tabbar,而不是其他处的tabbar,.tabs指的是在.tabbar下并在#header下的,他们是层层深入得关系,不知道你明白了没有。

2。当要调用的时候必须是这样

<div id="header">

<div class="tabbar">

<div class="tabs"><a href="###">链接一</a><a href="###">链接二</a></div>

</div>

</div>

必须是一层包裹一层的方式写,否则css不会生效。

建议你看一下我专栏里关于css的基础文章。

使用>,比如div>p,就是表示选择父元素为 <div>元素的所有 <p>元素。

如果是空格,比如div p,就是选择 <div>元素内部的所有 <p>元素。两个意思是有不同的。

这里.navbar-inverse .nav >li >a:hover,就是表示 navbar-inverse类内部所有父元素为nav类的<li>元素的直接<a>子元素在鼠标经过时的样式

比如类似这样:<div class="navbar-inverse"><ul class="nav"><li><a href="#">selected</a></li></ul></div>