zoukankan      html  css  js  c++  java
  • CSS3 column属性

    css3 column属性的应用

    1、案例源码

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>CSS3 columns 属性</title>
    <style>
    *{margin: 0;padding: 0}
    .container{
    1000px;
    margin: 5px auto;
    column-count: 4;-webkit-column-count: 4;-moz-column-count: 4;
    column-gap: 30px;-webkit-column-gap: 30px;-moz-column-gap: 30px;
    column-rule- 5px;-webkit-column-rule- 5px;-moz-column-rule- 5px;
    column-rule-style: outset;-webkit-column-rule-style: outset;-moz-column-rule-style: outset;
    column-rule-color: #ff0000;-webkit-column-rule-color: #ff0000;-moz-column-rule-color:#ff0000;
    }
    </style>
    </head>
    <body>
    <div class="container">
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    欢迎您欣赏我的博客,希望您能获得意想不到收获。欢迎您欣赏我的博客,希望您能获得意想不到收获。
    </div>
    </body>
    </html>

    2、案例效果

     

  • 相关阅读:
    [POJ1176]Party Lamps(DFS,规律)
    [POJ1598]Excuses, Excuses!(模拟)
    [POJ2192]Zipper(DFS,剪枝)
    [POJ2157]Maze(DFS)
    [POJ1950]Dessert(DFS)
    [HIHO1353]满减优惠(状压,枚举)
    [HIHO1177]顺子(暴力,枚举)
    [HIHO1152]Lucky Substrings(暴力,枚举)
    计蒜客 25985.Goldbach-米勒拉宾素数判定(大素数) (2018 ACM-ICPC 中国大学生程序设计竞赛线上赛 B)
    计蒜客 28206.Runway Planning (BAPC 2014 Preliminary ACM-ICPC Asia Training League 暑假第一阶段第一场 F)
  • 原文地址:https://www.cnblogs.com/qikeyishu/p/7391565.html
Copyright © 2011-2022 走看看