标签选择器
p {} div {} h1 {} span {} em {} i {} ...
类选择器
.类名 {
属性1:属性值1;
属性2:属性值2;
...
}
多类名选择器
<div class="font1 col-red welcome ...">你好</div>
每个类名之间用空格隔开
ID选择器
#id名 {
属性1:属性值1; 属性2:属性值2;...
}
*通配符选择器
* {
属性1:属性值1; 属性2:属性值2;...
}
伪类选择器
链接伪类选择器(常用的是hover)
:link /*未访问的链接*/
:visited /*已访问的链接 已经点击过一次的状态*/
:hover /*鼠标移动到链接上*/
:active /*选定的链接 点击链接不放开时候的状态*/
注意,顺序不能颠倒,按照lvha的顺序。
love hate记忆法 或者 lv包包 非常 hao
结构(位置)伪类选择器(CSS3)
:first-child /*选取属于其父元素的首个子元素的指定选择器*/
:last-child /*选取属于其父元素的最好一子元素的指定选择器*/
:nth-child(n) /*匹配属于其父元素的第N个子元素,不论元素的类型*/
:nth-last-child(n) /*匹配属于其父元素的第N个子元素,不论元素的类型,后面算起*/
目标伪类选择器
:target /*可用于当前活动的目标元素*/