css3-columns多列布局
浏览数：28 /
时间：2015年06月09日
1 /*css3中的布局*/ 2 .wrapper{ 3 margin:auto; 4 width:300px; 5 height:200px; 6 border:2px dotted blue; 7 -webkit-columns:15px 3;/*表示多列布局，每一列15px 有3列，内容多于3列则该参数失效！例如对一篇文章可以进行多列布局显示*/ 8 9 -webkit-column-count:3; 10 -webkit-column-width:15px;/*将width和count属性拆开来单独使用，弱拆开且同时使用，浏览器根据具体情况会可能会使某一属性失效*/ 11 -webkit-column-gap:2em;/*设置列间距为2字符，不设置默认情况下为1字符间距*/ 12 13 -webkit-column-rule:2px solid red;/*定义列与列之间的分割线为2px 实体 红色 该分割线不占用空间位置 like a ghost*/ 14 15 } 16 h2{ 17 text-align:center;/*文本居中显示*/ 18 -webkit-column-span:all;/*令h2横跨所有列*/ 19 }
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
