zoukankan      html  css  js  c++  java
  • 多列

    1 .newspaper
    2 {
    3 -moz-column-count:3; /* Firefox */
    4 -webkit-column-count:3; /* Safari and Chrome */
    5 column-count:3;
    6 }
    7 在当前div的宽度中,将内容分为3列显示
    View Code
     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.
    View Code
     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 }
    View Code

  • 相关阅读:
    HTML5学习小结
    HTML和CSS的复习总结
    LOL UVALive
    E
    D
    C
    B
    D
    J
    css
  • 原文地址:https://www.cnblogs.com/MdpHappyForEver/p/5326535.html
Copyright © 2011-2022 走看看