关于css:常用的css代码片段收集

38次阅读

共计 413 个字符,预计需要花费 2 分钟才能阅读完成。

css 文字过长,显示省略号

单行文本

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

多行文本

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; // 设置须要显示的行数
overflow: hidden;

应用 flex 布局实现 css 超出滑动,代码很简洁

.list{
    display: flex;
    overflow-x: auto;
}

.item{flex-shrink: 0;}

<div class="list">
    <div class="item">item</div>
    <div class="item">item</div>
    <div class="item">item</div>
    <div class="item">item</div>
    <div class="item">item</div>
</div>

正文完
 0