二、CSS选择器及文本属性,选择器

二、CSS选择器及文本属性

1、css选择器：

（1）基础选择器：基础选择器由单个选择器组成

①选择器：标签选择器、类选择器（一个标签可以多个类名）、id选择 器、通配符选择器。

②类名选择器可设置多类名 例如：<p class=”news  articl”></p>

③id选择器设置id 例如：<p id=“id名”>内容</p>，配合js使用

（2）复合选择器

后代选择器、子代选择器、并集选择器、交集选择器、伪类选择器

（3）伪类选择器

a:link （未访问的）

a:visited（已访问的链接）

a:hover（鼠标放在链接上表现，大多数元素都具有）

a:active（点击时的链接）

（4）选择器优先级（权重）

！Importent >行内样式 >id选择>类选择器>标签选择器>通配符> 继承

权值：无穷大  1,0,0,0  0,1,0,0  0,0,1,0 0,0,0,1 0  0

2、文本属性

（1）font字体的综合写法font：字样式 字粗细 字大小/行高 字类型  

须按顺序写、font-style：normal；文字正常、font-style：italic；倾斜

（2）文本缩进 text-indent：像素/字符数

3、css样式表引入

（1）行内样式（写在标签内），<div style="color: red; font-size: 12px;">青春</div>

（2）内部样式（嵌入式，写在 <style> </style>内）

（3）外部样式（外链式），写在css文件中，<link rel="stylesheet"   href="css文件路径">

4、css的三大特性

（1）层叠性、继承性、优先级；

（2）注意

a标签不能继承 color ；

h 不能继承 font-size font-weight ；

5、元素显示方式

（1）行内

一行显示多个，宽高默认由内容撑开

无法设置有效宽高

行内标签建议只嵌套行内，a 里面不能嵌套 a

（2）块级

独占一行，宽高默认父元素宽高

可以设置有效宽高

块级元素可以嵌套任何元素，p 里面不能套块级标签

（3）行内块

一行显示多个、可以设置有效宽高

（4）元素转换

display:inline行内 | block块 | inline-block行内块