CSS高级技巧
精灵图 css sprites
为了有效减少服务器接收和发送的频率，减轻服务器的压力；将许多的小图片放到一张大图片上去；就是精灵技术，CSS sprites;
精灵技术主要针对背景图片, 精灵图就是一张大的背景图片
使用时主要移动背景图片位置，使用backgroud-position属性
一般情况下都是往上走，往左走，所以backgroud-position的值都是负值字体图标iconfont
字体图标展示的是图标，本质上是文字；可以改变颜色等属性
字体图标需要下载，下载地址有很多，推荐 https://iconfont.cn/- CSS改变鼠标样式：
CSS设置表单轮廓线outline
input {outline: none};
CSS中的vertical-align属性：
可以使图片，表单和文字对齐，垂直居中
只能应用于行内元素和行内块元素；
vertical-align: baseline | bottom | middle | top |
图片默认是基线对齐，会导致图片底侧和边框会有空隙；可以设置为其他属性，可以解决；
文本溢出隐藏显示省略号：
单行文本溢出
强制一行显示 wihte-space: nowarp
超出部分隐藏 overflow: hidden
文字用省略号代替 text-overflow: ellipsis;多行文件溢出：
在单行下添加如下属性：适用于webkit内核浏览器
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
CSS三角形问题：
css画三角形主要通过边框的宽度和颜色进行设置；
盒子宽度和高度为0
边框设置不同的宽度和颜色，获取不同的三角形代码如下：
.vvv { display: block; width: 0; height: 0; margin: 0 auto; border-top: 50px solid transparent; border-right: 20px solid red; border-bottom: 0px solid red; border-left: 0px solid red; /* 简写如下：*/ border-style: solid; border-color: transparent red transparent transparent; border-width: 50px 20px 0 0; }CSS初始化：
CSS初始化是指重设浏览器的样式，解决兼容性问题；
基本上在编写CSS之前都需要进行初始化；CSS初始化代码基本通用；
CSS初始化代码：
待编码
