CSS样式优先级：
不同级 ID > Class > Html，
同级 离元素最近的一个有效，
伪类选择器：
a:link 超链接未被访问，
a:hover 鼠标停留在元素上，
a:active 鼠标点击元素时，
a:visited 超链接已被访问，
E:focus 元素获得焦点，
伪元素选择器：
E:first-letter 设置对象内的第一个字符的样式，
E:first-line 设置对象内的第一行的样式，
E:before 设置在对象前发生的内容，和content属性一起使用，必须定义content属性，
E:after 设置在对象后发生的内容，和content属性一起使用，必须定义content属性，
E::placeholder 设置对象文字占位符的样式，
E::selection 设置对象被选择时的样式
常见属性：
颜色属性：
color 定义文本的颜色：
red等颜色，
#CCCCCC等颜色，
rgb(255,255,255)等颜色，红(R)、绿(G)、蓝(B)数值取值范围0~255，
rgba(255,255,255,1)等颜色，Alpha的(色彩空间)透明；
字体属性：
font-style 字体样式：
normal 正常(标准)，
italic 斜体，
oblique 倾斜，
inherit 继承；
font-weight 字体加粗：
normal 默认值(400)，
bold 粗体(700)，
bolder 更粗，
lighter 更细；
font-size 字体大小：
px 设置一个固定的值，
% 父元素的百分比，
smaller 比父元素更小，
larger 比父元素更大，
inherit 继承父元素的；
font-family 定义字体：
微软雅黑,serif 前面的优先级高，可用","连接多个字体；
font-variant 小型大写字母显示文本：
normal 标准，
small-caps 小型大写字母显示文本，
inherit 继承；
文本属性：
text-align 横向排列：
left，
center，
right；
line-height 文本行高：
% 基于字体大小的百分比行高，
数值 设置固定值；
text-indent 首行缩进：
% 父元素的百分比，
px 固定值，默认0，
inherit 继承；
letter-spacing 字符间距：
normal 默认，
数值 设置具体的数值，可以为负值，
inherit 继承；
word-spacing 单词间距：
normal 标准间距，
px 固定值，
inherit 继承；
direction 文本方向：
ltr 从左到右，默认值，
rtl 从右到左。
inherit 继承；
text-transform 文本大小写：
none 默认，
capitalize 每个单词以大写字母开头，
uppercase 定义仅有大写字母，
lowercase 定义仅有小写字母，
inherit 规定从父元素继承text-transform属性的值；
背景属性：
background-color 背景颜色；
background-image 背景图片：
url(图片路径)，
none 没有背景图片；
background-repeat 背景重复：
repeat 重复平铺满，
repeat-x X轴方向重复，
repeat-y Y轴方向重复，
no-repeat 不重复；
background-position 背景位置，第一个参数表示X轴，第二个参数表示Y轴：
left center right 表示横向位置，
top center bottom 表示纵向位置；
简写方式：background:url(图像) 位置 重复 背景颜色;
边框属性：
border-style 可单独定义某一方向的边框样式：
border-top-style 上边框样式，
border-bottom-style 下边框样式，
border-left-style 左边框样式，
border-right-style 右边框样式，
边框风格属性值：
none 无边框，
solid 实线边框，
dashed 虚线边框，
dotted 点状边框，
double 双线边框，
groove 吐槽边框，依托border-color属性值，
ridge 垫状边框，依托border-color属性值，
inset inset边框，依托border-color属性值，
outset outset边框，依托border-color属性值，
inherit 继承；
border-width 可单独定义某一方向的边框宽度：
border-top-width 上边框宽度，
border-bottom-width 下边框宽度，
border-left-width 左边框宽度，
border-right-width 右边框宽度，
边框宽度属性值：
thin 细边框，
medium 中等边框，
thick 粗边框，
px 固定值边框，
inherit 继承；
border-color 可单独定义某一方向的边框颜色：
border-top-color 上边框颜色，
border-bottom-color 下边框颜色，
border-left-color 左边框颜色，
border-right-color 右边框颜色，
边框颜色属性值：
red 等颜色值的名称，
rgb(255,255,0)，
rgba(255,255,0,0.5)，
#FF0、#FF0000 十六进制，
inherit 继承；
属性值四种情况：
border-color:(上下左右); 一个值，
border-color:(上下)(左右); 两个值，
border-color:(上)(左右)(下); 三个值，
border-color:(上)(下)(左)(右); 四个值，
列表属性：
list-style-type 标记的类型：
none 无标记，
disc 实心圆(默认)，
circle 空心圆，
square 实心方块，
decimal 数字；
list-style-position 标记的位置：
inside 列表项目标记放在文本以内，且环绕文本根据标记对齐，
outside 默认值，保持标记位于文本左侧，列表项目标记放在文本以外，且环绕文本不根据标记对齐，
inherit 继承；
list-style-image 设置图像列表标记：
url 图像的路径，
none 默认，没有图像，
inherit 继承；
list-style 简写方式：
aquare inside url("demo.jpg");
DIV+CSS布局：
<div> 块元素；
<span> 内联元素；
盒模型：
margin 盒子外边距；
padding 盒子内边距；
border 盒子边框宽度；
width 盒子宽度；
height 盒子高度；
布局相关属性：
position 定位方式：
relative 正常定位，
absolute 根据父元素定位，
fixed 根据浏览器窗口固定定位，
static 没有定位，
inherit 继承；
left 距页面左边的距离；
right 距页面右边的距离；
top 距页面上边的距离；
bottom 距页面下边的距离；
z-index 层覆盖先后顺序(优先级)；
display 显示属性：
none 不显示，
block 块状显示，
inline 内联显示；
float 浮动属性：
left 左浮动，
right 右浮动；
clear 清除浮动：
both 清除浮动；
overflow 溢出处理：
hidden 隐藏超出层大小的内容，
scroll 无论内容是否超出层大小都添加滚动条，
auto 超出时自动添加滚动条；
平移：transform: translate(50%, -50%);
文本过长时，显示省略效果：
white-space: nowrap; //强制文本在一行(不能换行)
overflow: hidden; //超过长度的不显示
text-overflow: ellipsis; //显示省略效果
vertical-align属性：
top 顶端对齐
middle 中部对齐
bottom 底部对齐
弹性布局：
父级的属性：
display:flex;
display:-webkit-box;
父级的其它属性：
justify-content：子元素水平排列方式
center 居中
space-between 两端对齐
space-around 子元素平均分布
flex-start 居左
flex-end 居右
align-items属性：子元素垂直排列
center 居中
flex-end 底部
flex-start 开始
align-content：多行的时候，垂直排列
center 居中
flex-direction：排列方式
row 横向排列
row-reverse 横向反序排列
column 纵向排列
column-reverse 纵向反序排列
flex-wrap：子元素是否在一行显示
no-wrap 不换行(在一行，默认)
wrap 换行
子元素的属性：
flex:1
align-self
flex-grow:1 定义子元素的放大比例