选择器
选择器 ----------- 例子 -----------描述
.class ----------- .div -----------选择 class="div" 的所有元素。
div,p -----------选择择所有 <div> 元素和所有 <p> 元素
div p ----------- 选择所有 <div> 元素内部所有 <p> 元素
div>p ----------- 选择父元素为 <div> 元素的所有 <p> 元素
div+p ----------- 选择紧接在 <div> 元素之后的所有 <p> 元素。
[target] -----------选择带有 target 属性所有元素。
伪类选择器:
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。
提示:在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。
提示:伪类名称对大小写不敏感。
参考文案
CSS的继承
1、字体系列属性:
- font-family:字体系列
- font-weight:字体的粗细
- font-size:字体的大小
- font-style:字体的风格
2、文本系列属性
- text-indent:文本缩进
- text-align:文本水平对齐
- line-height:行高
- word-spacing:单词之间的间距
- letter-spacing:中文或者字母之间的间距
- text-transform:控制文本大小写(就是uppercase、lowercase、capitalize这三个)
- color:文本颜色
3、元素可见性
- visibility:控制元素显示隐藏
4、列表布局属性
- list-style:列表风格,包括list-style-type、list-style-image等
5、光标属性:
- cursor:光标显示为何种形态
层叠、样式优先级机制
1.优先级就近原则,同权重情况下样式定义最近者为准;
2.载入样式以最后载入的定位为准;
!important >内联样式> id > class > 标签选择器