>  기사  >  웹 프론트엔드  >  多列_html/css_WEB-ITnose

多列_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-24 11:22:281275검색

1 .newspaper2 {3 -moz-column-count:3; /* Firefox */4 -webkit-column-count:3; /* Safari and Chrome */5 column-count:3;6 }7 在当前div的宽度中,将内容分为3列显示

 1 .newspaper 2 { 3 -moz-column-count:3; /* Firefox */ 4 -webkit-column-count:3; /* Safari and Chrome */ 5 column-count:3; 6  7 -moz-column-gap:30px; /* Firefox */ 8 -webkit-column-gap:30px; /* Safari and Chrome */ 9 column-gap:30px;10 }11 当前div 中内容分为三列显示,列之间的距离是30px.

 1 .newspaper 2 { 3 -moz-column-count:3; /* Firefox */ 4 -webkit-column-count:3; /* Safari and Chrome */ 5 column-count:3; 6  7 -moz-column-gap:40px; /* Firefox */ 8 -webkit-column-gap:40px; /* Safari and Chrome */ 9 column-gap:40px;10 11 -moz-column-rule:4px outset #ff0000; /* Firefox */12 -webkit-column-rule:4px outset #ff0000; /* Safari and Chrome */13 column-rule:4px outset #ff0000;14 }

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.