css中很有用的属性

　　有些css属性很实用，但不常用也就被忘记。

　　这里纪录了自己在项目中用过的一些。

　　

html,body{
  -webkit-tap-highlight-color:transparent;
}

这个的用途是：手机端用a标签或是表单的地方，点击时候有闪烁，用户体验很不好。加上它就可以啦~

html,body{
 user-select：none;
}

user-select有4个值，
none：文本不能被选择
all：所有内容作为一个整体时可以被选择
text：可以先择文本
element：可以选择文本，但选择范围受元素边界的约束
 

input:-webkit-autofill {
  -webkit-box-shadow : 0 0 0 100px white inset ;
}

去掉chorme浏览器input表单保存账号密码后默认填充的黄色背景。

div{
        word-break: keep-all;
        white-space:nowrap;
    }

规定自动换行的处理方法，在table中可能用得多一点。

word-break: normal | break-all | keep-all;
分别是使用浏览器默认换行规则，允许在单词内换行，只能在半角空格或连字符处换行。

white-space：normal | pre | nowrap | pre-wrap | pre-line | inherit
分别是 默认。空白会被浏览器忽略。 | 空白会被浏览器保留 | 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止 | 保留空白符序列，但是正常地进行换行。 | 合并空白符序列，但是保留换行符。 | 规定应该从父元素继承 white-space 属性的值。

没有添加前

添加这两个属性后

resize : none | both | horizontal | vertical:

分别是：无法调整大小，可调整宽度和高度，可调整宽度，可调整高度

使用后可让div想textarea那样被拉大，缩小。不过一般都不会用到。

object-fit CSS 属性指定替换元素的内容应该如何适应到其使用的高度和宽度确定的框。

适用于替换元素，如图片。

object-fit: fill / contain / cover / none / scale-down

对比使用后效果，分别用固定大小div，宽高不定div做了测试，用到了横图和长图，cover真好用，再也不用担心图片过长过高后显示不正常了！

暂时只遇到了这些，项目中有新发现再来补充。。。