首页 > 网站 > WEB开发 > 正文

css3 多列布局记

2024-04-27 14:25:32
字体:
来源:转载
供稿:网友
CSS3 多列布局记

css3 多列布局

多列布局属性:

columns:column-widht和column-count的缩写。column-width:定义每列列宽度。column-count:定义分列列数。column-gap:定义列间距。column-rule:定义列边框。column-rule-width:定义列边框的宽度。column-rule-style:定义列边框的样式。column-rule-color:定义列边框的颜色。column-span:定义子元素跨列效果。column-fill:控制每列列高效果。

<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="utf-8" /><title></title><style>    body{        -moz-column-count:3;        -webkit-column-count:3;        column-count:3;        -moz-column-gap:20px;        -webkit-column-gap:20px;        column-gap:20px;        -moz-column-rule:double;        -webkit-column-rule:double;        column-rule:double;    }    h1{        -moz-column-span:all;        -webkit-column-span:all;        column-span:all;        text-align:center;        border-bottom:double;    }</style></head><body><h1>淮阴侯韩信</h1><p>后数日,蒯通复说曰:“夫听者事之候也,计者事之机也,听过计失而能久安者,鲜矣。听不失一二者,不可乱以言;计不失本末者,不可纷以辞。夫随厮养之役者,失万乘之权;守儋石之禄者,阙卿相之位。故知者决之断也,疑者事之害也,审豪氂之小计,遗天下之大数,智诚知之,决弗敢行者,百事之祸也。故曰‘猛虎之犹豫,不若蜂虿之致螫;骐骥之局躅,不如驽马之安步;孟贲之狐疑,不如庸夫之必至也;虽有舜禹之智,吟而不言,不如瘖聋之指麾也’。此言贵能行之。夫功者难成而易败,时者难得而易失也。时乎时,不再来。原足下详察之。”韩信犹豫不忍倍汉,又自以为功多,汉终不夺我齐,遂谢蒯通。蒯通说不听,已详狂为巫。</p></body></html>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表