旗下导航:搜·么
当前位置:网站首页 > CSS > 正文

column-count属性怎样用【css教程】

作者:搜搜PHP网发布时间:2019-11-26分类:CSS浏览:80


导读:column-count属性时用来指定某个元素应分为多少列数显现的。CSS3column-count属性作用:column-count属性指定某个元素应分为的列数...
column-count属性时用来指定某个元素应分为多少列数显现的。

CSS3 column-count属性

作用:column-count属性指定某个元素应分为的列数。

语法:

column-count: number|auto;

参数:

auto:默认值,列数将取决于其他属性,比方:"column-width"属性。

number:列的最好数量将个中的元素的内容没法流出

注:Internet Explorer 9及更早 IE 版本浏览器不支持 column-count 属性。

CSS3 column-count属性的运用示例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style> 
.newspaper
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
}
</style>
</head>
<body>
<div class="newspaper">
“当我年青的时刻,我妄想转变这个天下;当我成熟今后,我发明我不能够转变这个天下,我将眼光缩短了些,决议只转变我的国度;当我进入晚年今后,我发明我不能够转变我们的国度,我的末了希望仅仅是转变一下我的家庭,然则,这也不能够。当我如今躺在床上,风烛残年时,我倏忽意想到:假如一开始我仅仅去转变我本身,然后,我能够转变我的家庭;在家人的协助和勉励下,我能够为国度做一些事变;然后,谁知道呢?我以至能够转变这个天下。”
</div>
</body>
</html>

效果图:

以上就是column-count属性怎样用的细致内容,更多请关注ki4网别的相干文章!

标签:column-count属性css3