#
##<a>元素
为了解决超链接在点击后依旧拥有相关的响应故其link、hover、visited
、active顺序应如下：
a:link{
color: red;
}
a:visited{
color: blue;
}
a:hover{
color: green;
}
a:active{
color: orange;
}
##内联元素和块级元素的区别
**1.文档流**：标准文档流就是指在没有浮动或定位情况下元素按照css的标准来排列，或者说是css默认排列的方式。
**2.块级元素：**
（1）前后换行显示，默认状态下独占一行。
（2）块级元素常作为容器。可以包含其他块级元素，行级元素。
（3）块级元素有一定的高度和宽度，用width、height来表示。
（4）分类：div、p、h1-h6、ul、ol、hr、table、form
**3.内联元素（行级元素，行内标签）**
（1）类似于文本的显示方式，逐行显示。
（2）span、lable、 a、img、input、textarea
##display属性
**定义**：规定了生成框的类型
值：
none:不显示，位置还是在
inline：指定对象为行级元素，行级元素不支持高和宽。
inline-block：行内块级元素。本质是行级元素，但是支持高宽。eg:img
#选择器
##
**1.id选择器**
1.1、在整个网页中必须是唯一的id，#表示id。
1.2、id选择器不能结合使用。
eg: #id_name{
margin:20px 10px;
}
**2.类（class）选择器**
2.1、在整个网页中可以重复使用，**.** 表示class。
2.2、类（class）选择器可以结合使用。
eg: .class_name{
margin:20px 10px;
}
**注：id选择器优先级大于类（class）选择器**
**3.元素选择器**
3.1 w3c元素选择器又称为类型选择器。
eg: p{
margin:20px 10px;
}
**4.分组选择器**
eg: div,p,img{
margin:20px 10px;
}
**5.属性选择器**
5.1 单个属性选择器
eg: [name]{
margin:20px 10px;
}
5.2 多个属性选择器
eg: [name][title]{
margin:20px 10px;
}
5.3属性值选择器
eg: [name=username]{
margin:20px 10px;
}
5.4属性中包含指定词汇的元素
[title~=gyy]
5.5[attribute|=value]
用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
5.6[attribute^=value]
匹配属性值以指定值开头的每个元素。
5.7[attribute$=value]
匹配属性值以指定值结尾的每个元素。
5.8[attribute*=value]
匹配属性值中包含指定值的每个元素。
**6.后代选择器(包含选择器)**
<code> #p1 em{
margin:10px;
}</code>
**7.子元素选择器**
7.1子元素选择器（Child selectors）只能选择作为某元素子元素的元素。（只可以改变）
<code> h1 > strong {
color:red;
}</code>
**8.相邻兄弟选择器**
<code>h1 + p {margin-top:50px;}</code>
<code><div>
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ul>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
</div> </code>
注意： 请记住，用一个结合符只能选择两个相邻兄弟中的第二个元素。请看下面的选择器：
li + li {font-weight:bold;}
上面这个选择器只会把列表中的第二个和第三个列表项变为粗体。第一个列表项不受影响。
**9.通配符**
<code>*{
margin:10px;
}</code>
注意：作用于所有元素，但是***优先级最低***。
**10.伪类 (Pseudo-classes)**
:active 向被激活的元素添加样式。 1
:focus 向拥有键盘输入焦点的元素添加样式。 2
:hover 当鼠标悬浮在元素上方时，向元素添加样式。 1
:link 向未被访问的链接添加样式。 1
:visited 向已被访问的链接添加样式。 1
:first-child 向元素的第一个子元素添加样式。 2
:lang 向带有指定 lang 属性的元素添加 样式。 2
**11.伪元素选择器**
元素：：选择 或者 元素：选择
:first-letter 向文本的第一个字母添加特殊样式。 1
:first-line 向文本的首行添加特殊样式。 1
:before 在元素之前添加内容。 2
:after 在元素之后添加内容。 2
##盒子模型
**padding**
padding:内边距。使用会改变盒子的大小
padding：10px;上下左右都是10px;
padding:20px 10px;上下左右；
padding:20px 10px 5px ;上（左右）下
padding:20px 10px 5px 0px;上右下左（顺时针）
**border**
必须设置样式，像素。
**margin**
使用负边距会是文档流发送偏移，不会占据原来的空间