css 样式小结

css多行省略……

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 1;

    -webkit-box-orient: vertical;

一行省略

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    display: block;

清除浮动

.clearfix{zoom:1;}

.clearfix:after{

    display:block;

    content:'clear';

    clear:both;

    line-height:0;

    visibility:hidden;

}

方法二
.clearfix:after,

.clearfix:before{/*before 是为了防止浏览器顶部空白的崩溃*/content:" ";display:table;}.

clearfix:after{clear:both;}

css1，css2 伪元素和伪类  :

css3

伪元素  ::  IE8不支持::

伪类  :

修复iPhone上submit按钮bug

-webkit-appearance: none;

css 去掉input元素默认黄色背景

问题描述：谷歌浏览器默认填充内容是，背景色会变成黄色

解决方法一：使用其他颜色覆盖黄色背景

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

解决方法二：关闭自动填充功能，就不会有黄色背景了

<input id="phone" autocomplete="off" type="text" maxLength="11" placeholder="请输入您的手机号码"  />

修改滚动条默认样式

.video-list ul{

width: 264px;

height: 497px;

overflow: auto;

*position: relative;

scrollbar-base-color: #5A5A5A;

scrollbar-track-color: #262626;

scrollbar-arrow-color: #5A5A5A;

}

.video-list ul::-webkit-scrollbar {

background: #262626;

width: 5px;

}

.video-list ul::-webkit-scrollbar-thumb {

background: #5A5A5A;

}

CSS清除select原始样式

select {

        -webkit-appearance: none;

        -moz-appearance: none;

        -ms-appearance: none;

        appearance: none;

}

清除IE的默认选择框样式，隐藏下拉箭头

select::-ms-expand {        display: none; }

chrome默认定义的background-color，background-image，color不能用!important提升其优先级以外，其他的属性均可使用!important提升其优先级