css是层叠样式表，是对html进行样式修饰的语言
层叠：就是层层覆盖叠加，如果不同的css样式对同一html标签进行修饰，样式有冲突的部分应用优先级高的，不冲突的部分共同作用。
样式表：就是css属性样式的集合
css的作用
（1）修饰html，使html更加美观
（2）提高样式代码的复用性
（3）html的内容与样式相分离，便于后期维护
css的引入方式和书写规范
（1）内嵌样式
内嵌样式是把css样式嵌入到html标签中
1） 使用style属性将样式嵌入到html标签中
2） 属性的写法：属性：属性值
3）多个属性之间使用分号；隔开
（2）内部样式
在head标签中使用style标签进行css的引入
<style type="text/css">
</style>
1)使用style标签进行css的引入
<style type="text/css">
属性：type：告知浏览器使用css解析器去解析
2） 属性的写法：属性：属性值
3）多个属性之间使用分号；隔开
(3)外部样式
将css样式抽取成一个单独css文件，谁去使用谁就引用
<link rel="stylesheet" type="text/css" href="demo.css"/>
1） 创建css文件，将css属性写在css文件中
2）在head标签中使用link标签进行引入
<link rel="stylesheet" type="text/css" href="css文件地址"/>
rel：代表要引入的文件和html的关系
type：告知浏览器使用css解析器去解析
href：css文件地址
3） 属性的写法：属性：属性值
4）多个属性之间使用分号；隔开
(4)@import方式
<style type="text/css">
@import url("demo.css");
</style>
link与@import方式的区别：
1）link所有浏览器都支持 import部分低版本IE不支持
2）import方式是等待html加载完毕之后再加载
3）import方式不支持js的动态修改
css选择器
1、基本选择器
（1）元素选择器
语法：html标签名{css属性}
（2）id选择器
#id的值{css属性}
（3）class选择器
语法：.class的值{css属性}
***选择器的优先级：
id > class > 元素
2、属性选择器
基本选择器[属性='属性值']{css属性}
3、伪元素选择器
a标签的伪元素选择器
静止状态 a:link{css属性}
悬浮状态 a:hover{css属性}
触发状态 a:active{css属性}
完成状态 a:visited{css属性}
4、层级选择器
父级选择器 子级选择器 ...
css属性：
1、文字属性
font-family：字体类型
font-size：大小
2、文本属性
color:颜色
text-decoration:下划线
属性值：none underline
text-align:对齐方式
属性值：left center right
3、背景属性
background-color：背景颜色
background-image：背景图片
属性值：url（“图片地址”）
background-repeat：平铺方式
属性值：默认横向纵向平铺
repeat：横向纵向平铺
no-repeat:不平铺
repeat-y:纵向平铺
repeat-x：横向平铺
4、列表属性
list-style-type:列表项前的小标志
属性值：太多了
list-style-image:
5、尺寸属性
height:
6、显示属性
display:none
block：块级显示
inline：行级显示
7、浮动属性
float：
属性值：left right
clear：清除浮动 属性值：left，right，both
缺点：（1）影响相邻元素不能正常显示
（2）影响父元素不能正常显示
盒子模型：
border-盒子的厚度
padding：盒子内壁与内部元素之间的距离
margin：盒子的外壁与外部元素之间的距离
border-width：边框的宽度
border-color：边框的颜色
border-style：边框的线型
border-top：上边框
border-bottom：下边框
border-left：左边框
border-right：右边框
padding：代表边框内壁与内部元素之间的距离
padding：10px
padding：1px 2px 3px 4px 上右下左
padding：1px 2px 上下/左右
padding：1px 2px 3px； 上（左右）下
padding-top：单独设置
padding-bottom：
padding-left：
padding-right：
margin：代表边框外壁与其他元素之间的距离
margin的用法与padding类似
左右设置为auto可以将div居中，这个非常重要