css总结

1.图片居中，通过固定图片高度 

#settings .item > img{
 position:absolute;
 right:13px;
 top: 50%;
 margin-top: -6px;/*图片高度的-1/2 */
 }

　　

　2. 多行省略

/*html代码*/
<h2>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et.</h2>
/*css代码*/
$font-size: 26px;
$line-height: 1.4;
$lines-to-show: 3;

h2 {
  display: block; /* Fallback for non-webkit */
  display: -webkit-box;
  max-width: 400px;
  height: $font-size*$line-height*$lines-to-show; /* Fallback for non-webkit */
  margin: 0 auto;
  font-size: $font-size;
  line-height: $line-height;
  -webkit-line-clamp: $lines-to-show;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

 

3. 移动端基本css

　　

/* 快速滚动和回弹效果 */
-moz-overflow-scrolling: touch;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;

/* 字体设置 */
font-family: Helvetica,Arial, SimHei, '微软雅黑', Helvetica;
font-size:13px;

 4.禁止点击元素： 可通过设置 pointer-events: none;来禁止，非常好用。

 5. css转换大小写： text-transform:lowercase/uppercase