实用技巧

1.背景模糊：

filter:blur( 10px);
overflow:hidden;

2.超过的文字成省略号：
单行文本溢出

white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;   //单行文本溢出

多行文本溢出

display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
overflow:hidden;    //多行文本溢出

3.清除span之间的间隙

font-size:0;

4.position布局的厉害之处

父元素用relative
当前元素相对父元素移动absolute
top,right,bottom,left

5.z-index层级
6.background

width
height
background-image:url()
background-size:
background-repeat:no-repeat;

7.vertical-align:top
8.cursor:pointer;
9.sticky footer布局
···

10.伪类伪元素
:before :after
:hover

11.清除浮动

.clearfix{
    display: inline-block;
}
.clearfix:after{
    display: block;
    content: ".";
    height: 0;
    line-height: 0;
    clear: both;
    visibility: hidden;
}