CSS - 图1

一定要加分号!!!

CSS代码风格

CSS - 图2

CSS - 图3

CSS - 图4

2.基础选择器

2.1选择器的作用

CSS - 图5

选择器就是根据不同需求把不同的标签选出来这就是选择器的作用。简单来说,就是选择标签用的

CSS - 图6

2.2选择器的分类

CSS - 图7

2.3标签选择器

CSS - 图8

CSS - 图9

作用

标签选择器可以把某一类标签全部选择出来,比如所有得分标签

优缺点

CSS - 图10

2.4类选择器

如果想差异化选择不同的标签,单独选一个或者某几个标签,可以使用类选择器

CSS - 图11

类选择器口诀:样式点定义 结构类(class) 调用

开发中最常用的标签

CSS - 图12

案例:使用类选择器画盒子

CSS - 图13

CSS - 图14

多类名

开发中很重要

CSS - 图15

CSS - 图16

CSS - 图17

CSS - 图18

在实际开发中多类名是很重要的,可以减少很多修改的不必要

2.5ID选择器

CSS - 图19

ID选择器的口诀:样式#定义,结构ID调用,只能调用一次,别人切勿使用。

选择器的区别:

CSS - 图20

2.6通配符选择器

CSS - 图21

CSS - 图22

暂时不需要理解

基础选择器总结:

CSS - 图23

3.CSS字体属性

3.1字体系列

CSS - 图24

CSS - 图25

CSS - 图26

CSS - 图27

在body里面修改字体

3.2字体大小

CSS - 图28

CSS - 图29

标题有特殊性,需要单独指定字体大小

3.3字体粗细

CSS - 图30

但是实际开发中最好用数字来表达加粗

用:

  1. font-weight:700

正常来说

normal就等于400,700等于bold

标题默认就是加粗,但是开发中可能不想让他加粗,就设置一个值就好了

3.4文字样式

CSS - 图31

很多时候不用我们加斜体,反而是把斜体正过来

3.5字体复合属性

CSS - 图32

CSS - 图33

正常情况代码很多

CSS - 图34

简写的时候要注意顺序一定要对

CSS - 图35

重点

CSS - 图36

3.6字体属性总结

CSS - 图37

4.CSS文本属性

CSS - 图38

CSS - 图39

平时开发中用的最多的是16进制

4.1对齐文本

CSS - 图40

CSS - 图41