常用的css优化样式

一、多行文本超出显示省略号

.text{
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;    //表示超出两行后显示省略号
    -webkit-box-orient: vertical;
}

二、隐藏滚动条

.content{
    width: 100%; 
    height: 810px; 
    overflow: auto;
}
.content::-webkit-scrollbar {
    width: 0px;
}

三、在css中使用height和line-height设置select的高度,在有些Android版本中是无效的,可以添加

-webkit-appearance:listbox;

    此属性还可以去除select的一切默认样式,包括边框和下三角。

四、当input的type为number时,会有默认样式

常用的css优化样式_第1张图片

    可使用伪类清除默认样式

input::-webkit-inner-spin-button{
    -webkit-appearance:none;
}

五、白色字看起来比较粗-关闭消除锯齿功能

body{
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
}

 

你可能感兴趣的:(CSS)