清除浮动
// Clearfix
@mixin clearfix {
&:before,
&:after {
content: " "; // 1
display: table; // 2
}
&:after {
clear: both;
}
}
滚动条样式(隐藏)
@mixin scrollHide {
&::-webkit-scrollbar {
display: none;
}
}
强制不换行超出文字省略号
@mixin ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
多行情况下第line行超出文字省略号
@mixin multiEllipsis($line) {
display: -webkit-box;
-webkit-box-orient: vertical; // 从上向下垂直排列子元素。设置或检索伸缩盒对象的子元素的排列方式 。
text-overflow: ellipsis; //文本溢出 用省略号显示
-webkit-line-clamp: $line; // 多少行省略
overflow: hidden;
word-break: break-all;
}
$px为需要转换的rem
// px 转 rem 的默认
$browser-default-font-size: 16px;
@function pxTorem($px){
@return $px / $browser-default-font-size * 1rem;
}
