前端三层
- HTML (HyperText Markup Language)
超文本标记语言
从语义的角度描述页面结构。
- CSS (Cascading Style Sheets)
层叠式样式表
从审美的角度负责页面样式。
JavaScript
从交互的角度描述页面行为。
CSS高级选择器
.div p {
color:red;
}
注意:选择的是所有后代
h1.special {
color:red;
}
必须同时满足两个条件:必须是h3标签,然后必须是special标签。
注意:交集选择器可以连续交(但是一般不要这么写)
h1.special.top {
color:red;
}
逗号分隔
所有元素
div>h1 {
color:red;
}
注意:IE7开始兼容,IE6不兼容
IE8开始兼容;IE6、7都不兼容
选择第1个li:
ul li:first-child{
color:red;
}
选择最后1个li:
1ul li:last-child{
color:red;
}
如果还要求兼容IE6、7,那么就要自己写类名解决
IE7开始兼容,IE6不兼容
h3+p{
color:red;
}
选择上的是h3元素后面紧挨着的第一个兄弟。
<h3>我是一个标题</h3>
<p>我被选择上</p>
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>
<p>我被选择上</p>
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>
<p>我被选择上</p>
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>