首页 > 代码库 > 布局—column(属性)
布局—column(属性)
column-width:||用来定义多列中每列的宽度,用像素表示
column-count:||用来定义多列中的列数,用数字来表示1-10
columns: 200px 2||列宽和列数
column-gap: normal||默认值,默值为1em
column-gap: length ||用来设置列与列之间的间距,可以用px,em单位的任何整数值,但不能是负值。
column-rule:column-rule-width ||用来定义列与列之间的边框宽度
column-rule:column-rule-style ||用来定义列与列之间的边框样式
column-rule:column-rule-color ||用来定义列与列之间的边框颜色
column-span: none || 默认值,不跨越任何列。
column-span: all ||元素跨越所有列,并定位在列的Z轴之上。
1 <style> 2 .columns{ 3 -webkit-columns:200px 3; /*列宽是200像素,列数为3。*/ 4 -webkit-column-gap:30px; /*列与列之间的间距是30像素*/ 5 -webkit-column-rule:2px solid green; /*列与列之间的边框颜色是2像素的绿色。*/ 6 text-overflow: ellipsis; /*用省略符号来代表被修剪的文本。*/ 7 white-space: nowrap; /*文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。*/ 8 word-wrap: break-word; /*在长单词或 URL 地址内部进行换行。*/ 9 box-sizing: border-box;} /*规定两个并排的带边框的框*/10 </style>
布局—column(属性)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。