CSS使用笔记

一、文字超过两行隐藏并在末尾添加。。。

.text{
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height:1.2;
}

二、图片的transfrom和计算calc属性

img{
  margin-top:calc(50%) ;
  width: 30%;
  margin-bottom: 3%;
  transform: translate(10%, -10%);
}

三、弹性布局
 

#div{
    width: 500px;
    height: 400px;
    background-color: yellow;
    display: flex;
    flex-direction: column-reverse;/*主轴方向从下往上*/
    flex-wrap: wrap;/*换行，并且第一行在容器最上方*/
    justify-content: space-around;/*每个项目两侧的间隔相等*/
    align-items: stretch;/*如果项目未设置高度或设为auto，将占满整个容器的高度*/
    align-content: stretch;/*轴线占满整个交叉轴*/
}

四、mint ui checklist change事件
mt-checklist 的 bug 解疑 及 防止 this 指针偏移


参考地址：https://www.cnblogs.com/crazycode2/p/7747855.html
总结：解决方案：