课程名称：十天精通CSS3

课程章节： 布局样式相关

主讲老师：大漠

课程内容：

今天学习的内容包括：多列布局模块的使用？column-width的使用？column-count的使用？列间距column-gap的使用？列表边框column-rule的使用？

课程收获：

多列布局模块主要应用在文本的多列布局方面，多列布局columns属性参数主要就两个属性参数分别是列宽和列数。使用语法columns：<column-width> || <column-count>，其中column-widt主要用来定义多列中每列的宽度，column-count主要用来定义多列中的列数。

column-width属性在定义元素列宽的时候，既可以单独使用，也可以和多列属性中其他属性配合使用。使用的方法column-width: auto | <length>，其中如果column-width设置值为auto或者没有显式的设置值时，元素多列的列宽将由其他属性来决定。length使用固定值来设置元素列的宽度，其主要是由数值和长度单位组成，不过其值只能是正值，不能为负值。

column-count属性主要用来给元素指定想要的列数和允许的最大列数。属性值有auto和integer。其中auto表示元素只有一列，其主要依靠浏览器计算自动设置。integer值为正整数值，主要用来定义元素的列数，取值为大于0的整数，负值无效。

column-gap主要用来设置列与列之间的间距，属性值有normal和length，normal是默认值，默值为1em，如果字号是px，那么默认值就是font-size值。length用来设置列与列之间的距离，可以使用px,em单位的任何整数值，但不能是负值。

column-rule主要是用来定义列与列之间的边框宽度、边框样式和边框颜色。接收的值有column-rule-width、column-rule-style、column-rule-color，第一个是主要用来定义列边框的宽度，其默认值为medium，接受任意浮点数，但不接收负值。第二个值主要用来定义列边框样式，其默认值为none。第三个主要用来定义列边框颜色，其默认值为前景色color的值，如果不希望显示颜色，也可以将其设置为transparent。

今天学习了边框的10-1到10-5的5个小结，花费了45分钟，今天主要学习了多列布局的各种属性，我们在布局网站的使用的比较多，其中我们可以给每一列定义元素列宽结合显示的列数就可以显示我们的布局。为了更加美观，我们还可以设置每一列之间的间距和边框颜色，从而使我们的布局看起来更好看。