CSS常用样式-持续更新

1.溢出文本显示省略号

单行：
.single-line{
-o-text-overflow : ellipsis; /*兼容opera*/
text-overflow : ellipsis ; /*这就是省略号*/        
overflow : hidden ; /*设置超过的隐藏*/
white-space : nowrap ; /*设置不折行*/
}

多行：
css3新增text-overflow:ellipse;只支持单行文本
如果是多行文本，在无法完全显示的情况下，可以按下面这样写：
.multi-line{
overflow : hidden ;/*设置超过的隐藏*/
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
}

2.TextBox取消拖拽

.cancel-drag{
    resize:none;
}

 3.div变成可编辑状态

<div contenteditable="true"></div>

4.div禁止选择功能

<div unselectable="on" onselectstart="return false">
      这里面的内容都是不能复制的呦！
</div>

5.给input的placeholder设置颜色

Html:

<input class="inp" type="text" placeholder="输入内容"/>

CSS：

/* WebKit browsers */
.inp::-webkit-input-placeholder { 
    color: red;
}
/* Mozilla Firefox 4 to 18 */
.inp:-moz-placeholder { 
    color: red;
}
/* Mozilla Firefox 19+ */
.inp::-moz-placeholder { 
    color: red;
}
/* Internet Explorer 10+ */
.inp:-ms-input-placeholder { 
    color: red;
}

 6.空格显示完整

在html中,文字之间如果存在多个空格，默认只显示一个空格位置，想要显示完整的空格，使用下面的样式。

.show-all-blank{
      white-space: pre;
}