常用css整理

1、图片遮罩透明渐变

//html
<div class="bg-gradient">
        <div class="pic"></div> 
 </div>
//css
.bg-gradient .pic {
            background-image: linear-gradient(to top, #fff, transparent), url("0101.png");
            background-position: center;
            background-blend-mode: normal;
            position: absolute;
            height: 100%;
            width: 600px;
            right: 0;
}

2、改变第一个字符的样式，不生效的情况下，加上块状元素

div:first-letter {font-size: 18rpx;}

3、文字超过显示省略号

  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;