用户登录

在这个 table 元素上,添加一个 compact .. 可以让表格变得更紧凑一些 .. 也就是表格里的内容的边距会缩小 .. 如果想增大内容与单元格边框之间的边距,这里需要用一个 padded .. 在这个 padded 前面加上一个 very ... 可以让这个边距更大一些 ..

我们也可以通过表示大小的单词来改变表格内容的尺寸 .. 比如用一个 small .. 这样表格里的内容会比默认的小一些 .. 如果想用大号的文字 .. 可以使用 large ...

默认的表格的每列内容的宽度是自动的 .. 我们也可以手工调节一下 .. 比如可以让每列内容等分容器的宽度 .. 这个表格里有四排内容,等分成四份 .. 可以在这个 table 上面,可以加上一个 four .. 后面再用一个 column .. 为了更容易区分列的宽度,我们再加上一个 celled .. ui four column celled table .. 表示这是一个有四列内容的表格 .. 每列内容会占用容器的四分之一的宽度 ..

除了等分,我们也可以单独指定每列内容的宽度 .. Semantic 默认用了一个 16 栏的网格系统 .. 也就是它把容器的宽度分成了 16 份 .. 你可以指定让每列内容占用多少份的宽度 ..

比如我们让名称还有创建者这两列内容各占用 5 栏的宽度 .. 让年代还有 LESS 各占用 3 栏的宽度 .. 这样加起来正好是 16 ..

在表格头部的单元格上可以添加点东西 .. 鼠标指针放在这里 .. 按住 shift 还有 ctrl 键 .. 再按向下箭头 .. 可以同时选中多个编辑点 .. 输入 class="five wide" .. 在名称,还有创建者这两列内容上 .. 用一个 five wide .. 表示 5个宽度 .. 或者叫 5栏宽度,5份宽度 ..

年代还有 LESS 占用 3 个宽度 .. 输入 three wide ... 保存 .. 现在表格的每列内容,都会使用我们手工设置的宽度 ..

表格的尺寸《 Semantic UI 集合 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点