CSS生僻又实用的代码（持续更新）

otline：none 　　　　　　清除文本框、按钮等默认的选中样式（就是选中时周围那一圈蓝色的框）

text-align-last:justify　　    设置文本两端对齐

contenteditable 　　 　　 设置标签是否为可编辑状态（两个值false、true）

user-select：none　  　　 禁止用户选中文本

filter:grayscale()　　　　   悼念模式(括号里为百分比或者为0-1之间的数)

::selection{}　　　　　　   改变文本选中颜色(括号里填入背景色，比如选中时为红色：background:#f00)

 

文本不换行，超出用省略号显示

overflow: hidden;

white-space: nowrap;

text-overflow:ellipsis;

 

文本多行超出省略号显示（适用了绝大部分现代浏览器）

display: -webkit-box; /*重点，不能用block等其他，将对象作为弹性伸缩盒子模型显示*/
-webkit-box-orient: vertical; /*从上到下垂直排列子元素（设置伸缩盒子的子元素排列方式）*/
-webkit-line-clamp: 3; /*行数，超出三行隐藏且多余的用省略号表示...*/
line-clamp: 3;
word-break: break-all;
overflow: hidden;
max-width: 100%;

 

 

去掉type=“number”右边输入框的三角符号（ie低版本不适用）

//webkit内核的浏览器
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
//mozilla内核的浏览器
input[type="number"] {
    -moz-appearance: textfield;
}
ps:火狐内核对number属性支持不太好，除了数字，其他字符也能输入，输入其他字符，方框失去焦点时，会标红，鼠标移上去会提示：请输入一组数字