为什么设置150px 3; 和设置成100px 3 的效果是一样的?

来源:10-1 CSS3 多列布局——Columns

怎么都开心的南哥

2015-02-09 16:54

为什么设置150px 3; 和设置成100px 3 的效果是一样的?

写回答 关注

2回答

  • 郑创洲
    2016-07-26 20:34:56

    试了一下,发现从列宽157px开始就变成两列了。

  • derrick9006
    2015-02-11 23:04:48

    源代码

    .columns {

      width: 500px;

      padding: 5px;

      border: 1px solid green;

      margin: 20px auto; 

      columns: 150px 3;

      -webkit-columns: 100px 3;

      -moz-columns: 100px 3;

      -o-columns:100px 3;

      -ms-columns: 100px 3;  

    }


    源代码显示width为500px当你三个设置为150 总长度为450剩下的50会平分给三个div
    如果你设置colums为100px 3的话电脑会把剩下的200平分出去。以此类推

    但是如果你的设置的总长超过500px(原长度)那么界面就会有所改动


十天精通CSS3

本课程为CSS3入门教程,深刻详解CSS3知识让网页穿上绚丽装备

242553 学习 · 2623 问题

查看课程

相似问题