快速开始 主题配置
容器
布局 Layout 容器 Docker 定位 Position 外边距 Margin 内边距 Padding 溢出 Overflow
元素
颜色 Color 文字 Font 图标 Icon 图片 Image 按钮 Button 提示 Tip 标签 Tag 徽标 Badge 表格 Table 菜单 Menu 面包屑 Breadcrumb 选项卡 Tab 分页 Pagination 阴影 Shadow
组件
表单 Form 输入框 Input 文本域 Textarea 单选框 Radio 多选框 Checkbox 选择器 Select 计数器 Counter 折叠面板 Collapse 模态框 Modal 动画 Animation
作者
问题反馈

溢出 Overflow

概述

基础组件,触发业务逻辑时使用。

溢出滚动

设置类j-scroll-*或属性scroll="*"定义溢出滚动,*为方向值,包括2个方向:xy。如:

<div class="j-scroll-x">
    容器里的内容超出容器宽后,沿x轴滚动显示。
</div>

j-scroll-*支持元素在移动设备上使用滚动回弹效果。

文字限行

设置类j-line-is-*或属性line="*"定义限定文字行数,*为行数值,包括4个值:1234。如:

<div class="j-line-is-1">
    即代表容器内文字最多仅显示1行,超出自动截断,并在结尾处以省略符标记“...”。
</div>

示例:

测试文字限行,本测试文案的长度已超出容器。但是仅显示1行,自动截断。
<div class="j-border j-padding-large" style="width:200px">
    <span class="j-line-is-1">测试文字限行,本测试文案的长度已超出容器。但是仅显示1行,自动截断。</span>
</div>
上一章:内边距 Padding
下一章:颜色 Color