css 样式设置

前言：

• css有很多实用性的样式设置，经常不实用可能会被忘记，但是一旦使用起来，能解决很多问题

1. 数字、字母在样式中自动换行，

word-break: break-all;  
break-all  ：   严格断字模式，解决问题

2.文本域回车换行，（没有\n）换行

     white-space: pre-line;  

• 解决又是文字或者英文单词在中间换行的问题

3.设置字体间距

 letter-spacing:5px   

4.设置首行缩进字符

    text-indent:80px;

5. 单行文本省略

 overflow: hidden; 
text-overflow:ellipsis;
 white-space: nowrap;  

6.多行文本省略

 text-overflow: ellipsis;
 display: -webkit-box; 
-webkit-line-clamp: 2; 
-webkit-box-orient: vertical;  

7.滚动条样式设置

• 单独写在这里了

8.改变图片颜色

filter: grayscale(0.5);

• 该属性有很多参数，不仅仅是将图片变成黑白色，还有其他色彩