日常工作和学习中用的最多的就是css，总结了一些自己常用的css技巧点，欢迎指正和补充。
1.父级flex布局，子级margin：auto; 实现快速居中
2.相邻兄弟选择器+，匹配选择器~。
后台开发中碰到有滚动条公告，在特定的时间点才会出现的场景。因滚动条公告的兄弟节点才用了固定定位，所以当滚动条公告出现时必须要用匹配选择器来重置其样式。
举例：
3.单/多行省略
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
-webkit-line-clamp: 4; /* 控制最多显示几行 */
-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
4.button{ all: unset; }重置
原始的 button 按钮要重置挺麻烦的。洋洋洒洒的要设置好几个属性，就像下面这样：
button {
background: none;
border: none;
color: inherit;
font: inherit;
outline: none;
padding: 0;
}
其实你只需要这样就可以button { all: unset; }
5.线形渐变linear-gradient实现进度条
举例：background: linear-gradient(0deg, black, blue)，三个参数分别设置角度为0，渐变的颜色为black和blue
常见业务场景有进度条等：
6.使用filter滤镜
filter:grayscale()设置灰度模式
filter: grayscale(100%); //灰度
filter: blur(5px); //模糊
filter:brightness(200%); //高亮
filter:saturate(8); //饱和
filter:sepia(100%); //怀旧
7.使用caret-color改变光标颜色
8.writing-mode排版竖文
writing-mode: horizontal-tb | vertical-rl | vertical-lr | sideways-rl | sideways-lr
horizontal-tb：水平方向自上而下的书写方式。即 left-right-top-bottom
vertical-rl：垂直方向自右而左的书写方式。即 top-bottom-right-left
vertical-lr：垂直方向内内容从上到下，水平方向从左到右
sideways-rl：内容垂直方向从上到下排列
sideways-lr：内容垂直方向从下到上排列
9.background-repeat新属性值：round和space。
round表示重复且图片直接不留空隙，space表示重复图片直接留间隙
10.计算函数 Calc()
calc() 函数用于动态计算长度值。
注意：运算符前后都需要保留一个空格
例如：width: calc(100% – 10px)；
任何长度值都可以使用calc()函数进行计算；
calc()函数支持 “+”, “-“, “*”, “/” 运算；
calc()函数使用标准的数学运算优先级规则；
