CSS（一）选择器

第一章 CSS选择器

1.1 选择器

• 1、标签选择器：标签{声明}
• 2、上下文选择器：标签1 标签2 {声明}（标签2就是我们想要选择目标，而且只有在标签 1 是其祖先元素（不一定是父元素）的情况下才会被选中。）
• 3、子选择器 > : 标签1>标签2 {声明}
• 4、紧邻同胞选择符+ ：标签1+标签2{声明}（标签2必须紧跟在其同胞标签1的后面)
• 5、一般同胞选择符~ : 标签1~标签2{声明}（标签2必须跟（不一定紧跟）在其同胞标签1后面。）
• 6、通用选择符*：*{声明}
• 7、类选择器：.类名{声明}
• 8、id选择器：#id名{声明}
• 9、属性选择器：标签名[属性名=“属性值”] {声明}

2、伪类

• 1、UI伪类：。最常使用UI伪类的元素是链接（a元素），利用 UI伪类，链接可以在用户鼠标悬停时改变文本颜色，或者去掉文本的下划线。
• • 针对链接的伪类一共有 4 个：

a:link {color:black;} 
a:visited {color:gray;} 
a:hover {text-decoration:none;} 
a:active {color:red;}

• 2、:focus 伪类

• • 表单中的文本字段在用户单击它时会获得焦点，然后用户才能在其中输入字符。

• 3、:target 伪类

• • 如果用户点击一个指向页面中其他元素的链接，则那个元素就是目标（target），可以用:target 伪类选中它。
    
    

• 4、结构化伪类：

• :first-child 和:last-child表示一组同胞元素中的第一个元素和最后一个元素

• :nth-child(n):n表示数值
  
  

• 5、伪元素：

• ::first-letter 伪元素

• ::first-line 伪元素

• ::before 和::after 伪元素

1.2、继承

• 可继承的样式：font-size, font-family, color，ul，li，dl，dt，dd
• 不可继承的样式：border, padding, margin, width, height
• 优先级（就近原则）：!important > [ id > class > tag ]