css称为层叠样式表，用于修饰html网页元素。
css的基本格式: 选择器{属性:值;属性:值;...}
1、行内样式
定义：在标签上增加style属性
特点： 1、方便，简单 2、优先级最高 3、样式过多不好维护 4、不方便多个标签共享
#案例
<h1 style="color:red;"></h1>
2、内联样式
定义：在head中添加style标签,通过选择器定位关联元素。
特点： 1、需要添加选择器 2、实现了多个标签的样式共享
#案例
<style type="text/css">
h1,p {
color:red;
}
/*css结构： 选择器｛属性:值;...｝*/
</style>
3、外联样式
定义：把多个页面共享的css，提取到外部的样式文件（.css）中。然后在html页面中 通过link标签进行引入。
特点： 1、实现多个文件的样式共享。
<link rel="stylesheet" type="text/css" href="样式路径"/>
4、三种引入方式遵从就近原则
就近是针对于网页元素的。与浏览器解析顺序。
三、css选择器
作用： 在内联（内部样式），外联（外部样式）中用于定位html元素的。
1、常用选择器
ID选择器：(#dv)
与id属性相关
id选择器需要使用#+id属性值
id属性具有文档唯一性
标签选择器：(div)
以标签名作为选择器
类别选择器：(.dv)
以class属性作为选择器
在选择器上加"."作为前缀
通配符选择：（*）
可以匹配任意标签元素
通常用于网页的初始化（部分元素具有默认边距，会影响整体布局）
#案例：清空所有元素的内外边距
*{margin: 0;padding: 0;}
2、常用选择器的优先级
从高到底依次如下：
ID选择器>class选择器>标签选择器>通配符选择器
3、其他选择器
分组选择器：
将多个选择器用逗号拼接分为一组
#second,.dv,h2 {
color: red;
}
后代选择器：
基于标签的嵌套（标签嵌套后，外层元素就是内层元素的父元素或祖父元素）
后代选择器之间使用空格分隔
#将div下的所有a标签文本设置为红色
div a{color:red;}
子代选择器：
与后代选择器类似
子代选择器找的是直接子元素
子代选择器之间使用大于号">"分隔
#将div的直接子元素font内的文本设置为orange
div>font{color:orange;}
4、属性选择器
E[att$="val"] #以val作为结尾
E[att*="val"] #包含val
E[att^="val"] #以val作为开头
说明：
E：element元素
att：html元素属性
案例1：匹配包含class属性的div，并且属性值以dv开头
div[class^="dv"] {color: aquamarine;}
5、伪类选择器
E:nth-child(n)
说明：
E: 元素
n:表示匹配第几个子元素
-------------------------------------------
E:nth-last-child(n)
说明：
n： 倒数第几个
四、css中的属性
1、背景
#设置背景颜色
background-color:
#设置背景图片
background-image：url();
说明：
默认情况下，图片会平铺。
#设置背景图的平铺方式
background-repeat：
- repeat-x 横向平铺
- repeat-y 纵向平铺
- no-repeat 不平铺
#背景图定位
background-position： x y;
说明：如果需要让背景图水平或垂直居中，可以设置为50%，
百分比是以图片中心点定位。
#背景图尺寸
background-size：widht height;
#背景图的相对位置定位
#fixed相对于窗口，拖动滚动条，不会随之改变
background-attachment: fixed;
#设置元素半透明
opacity：0-1; //0隐藏，1不透明
2、文本控制
#文本颜色
color
#首行缩进
text-indent: 对文本进行首行缩进,缩进两字符 2em
#设置内容的水平位置
text-align: left/center/right;
#控制单词之间的间隙
word-spacing
#控制字符的间隙
letter-spacing
#设置单词的大小写
text-transform:
- capitalize: 所有单词首字母大写
- uppercase: 所有字母大写
- lowercase: 所有字母小写
#设置文本划线
text-decoration
- underline: 下划线
- line-through: 删除线
- overline: 上划线
- none: 删除所有线
3、字体控制
font-family: 设置字体
说明：如果网站需要引入本地字体，需要在css中进行引入和声明
@font-face {
font-family: "sincity";
src: url(./font/sincity-mpjv.ttf);
}
font-family: sincity; //引用字体
---------------------------------------------------------------
font-style: 设置文字是否倾斜 italic
font-weight: 设置文字加粗 bolder
#文字大小
font-zise: px/em; //em表示当前默认文字大小的倍数
4、超链接状态
:link 未访问状态
:visited 已访问状态
:hover 鼠标悬停状态
:active 鼠标按下
注意: 这四个状态的顺序不能调换
在选择器前面加上冒号(:), 称为伪类选择器
