css样式常见用的像width,height,float....但是也有一些样式虽然不常用，但是在搭建结构的时候用到会让页面看起来非常注重细节的出来，用户体验大大提升
1.vertical-align：像素值
像这样的图标和文字结合的div，一般图标会向上或者向下偏移2px，结构
<a class="fl_l clearfix" href="#">分享<i class="Share"></i></a> <a class="fl_l clearfix" href="#">收藏<i class="start"></i></a>
这种情况我们就可以使用给<i>标签加上vertical-align：-2px使其与文字在同一水平上
2.<em></em>和<i></i>标签去掉默认样式斜体： font-style: normal;
3.渐变色
.div1{ background-image:-webkit-linear-gradient(red 25%,orange 50%); } .div2{ background-image:-webkit-linear-gradient(left,red,orange); } .div3{ background-image:-webkit-linear-gradient(0deg,red,orange); } .div4{ background-image:-webkit-linear-gradient(45deg,red,orange); } .div5{ background-image:-webkit-radial-gradient(red,orange); } .div6{ background-image:-webkit-radial-gradient(top, red, orange); } 显示效果：
4.超出文本显示为省略号
overflow:hidden;white-space:nowrap;text-overflow:ellipsis;显示效果：
5.表单：
input,textarea{outline:none}-----------input和textarea谷歌浏览器在获取焦点的时候去掉默认样式的蓝色边框
required---------必填
textarea样式：resize:none;----------禁止文本框放大缩小
6.鼠标
cursor：
auto：标准光标 default：标准箭头 hand：手形光标 wait：等待光标 text：I形光标 vertical-text：水平I形光标 no-drop：不可拖动光标 not-allowed：无效光标 help：?帮助光标 all-scroll：三角方向标 move：移动标 crosshair：十字标
