2019-07-17来黑马程序员的第六天（上课）

今天的讲解的东西不是很多，总结了如下：

一、选择器：标签选择器、类选择器、id选择器、通配符选择器、伪类选择器

---

标签选择器：根据标签的名字进行选择

类选择器：使用步骤：（1）声明类选择器

.选择器 {

属性1:属性值1;

属性2:属性值2；

属性3:属性值3;

}

（2）调用类选择器

class="自定义类名"

注意：一次声明，多次使用

3、id选择器 使用步骤：（1）声明id选择器

#id选择器 {

属性1:属性值1;

属性2:属性值2;

属性3:属性值3;

}

（2）调用id选择器

id=“自定义id名”

注意：声明了id选择器，只能使用一次（原因：每个元素只能有一个id）

4、定义：选择所有的元素，一般用于页面初始化

用法：如下

*{

padding:0;

margin:0;

}

5、解释:它选择的是元素的一种状态

语法:伪类状态 {

}

以下以a标签为例

链接没有访问过的状态

a:link{

color:red;

}

链接访问过的状态

a:visited{

color:green;

}

鼠标悬停在超链接上面的颜色

a:hover{

color:lime;

}

鼠标点击的时候的转态

a:active{

color:black;

}

实际工作中使用简写的方式：

a{

color:red;

}

a:hover{

color:green;

}

---

二、text系列：控制文字相关的属性 常用的有：text-decoration、text-align、text-indent

text-decoration:修饰文字的，如有无下划线、有无管穿线 常用的属性值有：underline下划线、line-through贯穿线、none取消下划线，一般用于a标签较多

text-align:控制文字水平方向上的对齐方式 常用的属性值有：left左对齐、center居中、right右对齐

text-indent:控制一段文字的首行缩进 常用的写法如下：text-indent:10px、text-indent：2em（相对单位，就是缩进两个字的距离）

---

三、行高（line-height）

控制文字与文字之间的距离，常用的单位有px、整数倍数

使用小技巧：设置行高和标签高度一样，可以使标签中的文字垂直居中

---

四、颜色表示法

1、直接写颜色的英文单词

2、使用十六进制的表示法如 #fdeabe

3、使用数字rgb(r,g,b)如rgb(15,45,48)  里面的数字范围在0-255

4、使用rbga(15,45,32,0.5)a表示的是透明度，范围是0到1

---

五、容器标签div和span

div:1、独占一行 2、可以设置宽和高 3、如果没有定义宽和高，宽度默认是父容器的宽度

span:1、可以排成一行 2、不可以定义宽和高 3、大小完全是由内容撑开的。

---

好了，我们明天再见，加油，明天继续！