【CSS3创建多列布局的属性使用详解】新建一个html文件, 定名为test.html, 用于讲解CSS3中多列结构属性利用 。

2在test.html页面, 建立一个div块, div内添加测试的文字, 下面将对这部门文字利用多列结构 。

3多列结构属性column-count, 本家儿要用来设置内容的列数, 例如, 下面设置为3列 。


4多列结构属性column-gap, 本家儿要用来设置列之间的距离, 例如, 下面设置列之间的距离为40px 。


5多列结构属性column-rule-width, 本家儿要用来设置列之间的竖线分隔的宽度, 例如, 下面设置列之间的竖线的宽度为3px 。

6多列结构属性column-rule-style, 本家儿要用来设置列之间的竖线分隔的样式, 例如, 下面设置列之间的竖线的样式为虚线 。


7多列结构属性column-rule-color, 本家儿要用来设置列之间的竖线分隔线的颜色, 例如, 下面设置列之间的竖线的颜色为红色 。


以上内容就是CSS3创建多列布局的属性使用详解的内容啦, 希望对你有所帮助哦!
猜你喜欢
- 如何使用CSS3实现html元素旋转的效果
- 12 github使用教程——创建与合并分支
- 怎样创建鹿头图
- 在oracle数据库中,如何使用plsql创建数据库表
- C4D中创建低面结构带闪电的云朵
- 如何创建带阴影的右箭头标注
- java多线程创建方式三Callable
- 平面设计时创建雪山图的方法
- PPT文档怎么在文字下方创建小字符
- 最右如何创建话题
