工作中使用的css属性 和 布局

自己在工作中使用最多的布局 ： flex 布局

CSS3 新出的布局方式，可能对ie兼容性有点不好，要求有兼容的话就写float或者使用插件来进行布局吧。 我工作中使用的弹性盒子还是比较多的， 但是有后台管理系统，有的时候根本就不需要自己布局，记录一下自己使用过的一些css属性。

弹性盒子 display： flex

在弹性盒子最多使用的是居中， 这也是老生常谈的问题
横向居中
justify-content: center
纵向居中
align-items: center
如果我们要使布局分为左中右 三份，而左右靠边 中间居中就使用
justify-content: space-between

两边距离一样 中间的距离一样使用
justify-content:space-around;

** 靠右**
justify-content: flex-end ;

** 靠左 正好是与它相反**
justify-content: flex-start ;

**改变轴的方向 当我们知道一个盒子 高度为 100px 然后我们怎么知道剩下的盒子为自适应那？ **
我们可以改变轴的方向 让这个盒子占 100px ， 然后剩下的 flex：1; 这只是一个小思路。
flex-direction ： row 默认为 row 如果我们不设置的话就是从左往右
flex-direction ： column 这样设置就是从上到下
换行 当我们按照它自身的大小 换行的时候 我们就使用 **
flex-wrap ： nowrap 它默认为不换行，会不断的挤压我们一行的空间
flex-wrap ： wrap 它到点就会换成下一行
** 子元素 最多使用的就是 flex ： 1 **
** 其实里面还有许多的属性 我都没有写 感兴趣的可以看看 菜鸟教程里面的属性 一定会大有收获，但是也得练习熟能生巧
链接: https://www.runoob.com/css3/css3-flexbox.html.

工作有时候会碰见设置边框padding 之类的事情，还是比较繁琐，有时候1px的距离也得调一下，使用css3 的 box-sizing; border-box ; 怪异盒模型 你会发现无比的好用。

有时候ui 给的设计图字体为9px ？ 我就很奇怪 浏览器最小的字体不是 12px吗 ？ 那9px 是怎么出来的 我当时思来想去不知道怎么去 设置 ，然后去网上看看 用css3 属性 scale 把字体缩放到一定的比例。

当我们也许不知道当前的盒子有多大，但是我们还想给它设置一个高那怎么办那？ 我们这里使用 vh vw 是对于浏览器的视口来决定的 然后 我们再设置里面的属性， 然后也可以 使用 calc(100vh - 100px) 可以计算盒子的高度。

css 多行文本溢出隐藏

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

标题还有许多…