CSS
1.CSS 是什么
Cascading Style Sheet
层叠样式表
2.CSS的好处
样式与代码内荣区分开方便阅读，
增加html文件的可重用性和可维护性
3.CSS与html的区别
css:创建网页样式（相当于给人体化妆）
html:创建网页结构和内容（相当于人体骨架）、
4.css的引用方式
4.1、内联
在html标签中使用样式。（<div style="color:red;font-size:20px">为什么我的眼中常含泪水，因为我对这片土地爱的深沉</div>）
4.2、内部样式表
创建内部样式表在HTML文件中的<head></head>标签中。
例：<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<style>
.d1{
color:red;
}
</style>
</head>
<body>
<div class="d1">为什么我的眼中常含泪水，因为我对这片土地爱的深沉</div>
</body>
</html>
4.3、外联样式表
将外部css文件连接入当前网页；
语法：在网页head标签中，加入<link rel="stylesheet" type="text/css" href="样式表文件路径" />
5.css样式表特征
5.1 继承性
为某个标签设置属性，那么这个标签的子标签也会继承该标签的属性；
5.2 层叠性
为某个标签设置多个样式，样式的属性不冲突，那么多个样式会层叠为一个样式。
5.3 优先级
浏览器缺省设置 最低
外部样式表或内部样式表 中
就近原则:就近优先
内联样式 最高
相同样式，以最后一次为主
最近原则：当一个标签的多个样式中有相同的属性，值却不相同时，会使用距离标签最近的样式的属性值；
！important 规则:
调整样式的优先级:
div{
color:red !important;
}
有！important的样式优先级最高
6. 选择器
css中选择器分为:
6.1、标签选择器
标签名{} 例
div{
background-color:red;
}
6.2、类选择器
.类名{} 例：(注：标签的类名、id名不能以数字开头)
.d1{
color:red;
}
<div class="d1">与子同袍，岂曰无衣</div>
6.3、id选择器
#id名{} 例：
#d1{
color:red;
}
<div id="d1">与子同袍，岂曰无衣</div>
6.4、分类选择器
当一个html代码中含有多个标签类名相同时，将类选择器与标签选择器合用确定标签位置。标签选择器.类选择器{}；例：
div.logo{}
6.5、群组选择器
选择器名以，隔开，多个选择器共用一个样式。例：
div,.class1,.class2,a{}
6.6、后代选择器
选中某个标签中所有的后代中某一类型。例：
.d1 a{} (选中所有的div标签后代中的li标签)
<div class=".d1">
<div>
<a></a>（蓝色为该选择器选中的标签）
<a></a>
</div>
<a></a>
</div>
6.7、子代选择器
通过父子关系定位标签。只选中子代中该类标签；
选择器1>选择器2{};
.d1>a{}（蓝色为该选择器选中的标签）
<div class="d1">
<div>
<a></a>
<a></a>
</div>
<a></a>
</div>
6.8通配选择器
*{} 选中所有的标签；
6.9伪类选择器
选择器名：伪类选择器{}
1、链接伪类
:link 匹配尚未访问的超链接
:visited 匹配访问过的超链接
2、动态伪类
:hover 匹配鼠标悬停在html元素的状态
:active 匹配元素被激活时的状态
:focus 匹配元素获取焦点时的状态(多数使用在 文本框 上)
7.颜色单位
rgb(x,x,x)-----x取值0~255，分别代表红、绿、蓝所占比例；也可用%；
#FFFFFF,红绿蓝三色每种颜色用两个字符表示，字符取值0~F；当两个字符一样时，可以写成一个，例：#FF0099==#F09; 三个颜色格式必须相同，即要么都写一个，要 么都写两个，#FF0258 ！=#F0258；
直接写颜色名；例：color：red;
rgba(x,x,x,y);前三位取值与rgb一样，最后一位取值0.0~1；表示透明度；
8.溢出
当块元素的高宽较小，内部内容大时，会产生溢出，就像桶中加水过量就会溢出来
溢出处理
属性：
overflow
overflow-x : 横向溢出处理方式
overflow-y : 纵向溢出处理方式
取值：
visible ：溢出可见
hidden ：溢出隐藏
scroll ：出现滚动条
auto ：自动不溢出不显示滚动条，溢出的话则显示滚动条
只有块级元素才能定义宽和高，行内元素不能定义；
块级元素：div p ul h1~6 ol dt dd
行内元素:a span
存在height width 属性的html元素：img table;
9.边框
border:width style color;例：border:1px solid black;
style取值：solid 实线；
dashed 虚线；
单边边框： border-left/right/top/bottom
左边框/右边框/上边框/下边框
