移动开发CSS3:display:box,box-flex属性

心已入冬 提交于 2019-12-02 16:33:59
  1. 必须给父容器div定义css属性display:box,其子容器才可以进行划分(如果定了display:box则该容器定义为内联元素,使用margin让其居中是无效的,可以在其父元素设置text-align:center让其居中);

  2. 子元素属性:box-flex:比例值;                                                                           

  3. 目前box-flex属性还没有得到firefox、Opera、chrome浏览器的完全支持,但可以使用它们的私有属性定义firefox(-moz-)、opera(-o-)、chrome/safari(-webkit-)。

  4. 注:如果子元素设置了固定宽度和margin,则该子元素直接应用宽度值,其它没有设置的则在父容器的宽度基础上减去子容器设置的固定宽度和margin值,在剩下的宽度基础上按一定比例进行划分分配。

  5. 代码块:

    <div>
     <p id="p1">web</p>
     <p id="p2">css</p>
    </div>


对子元素进行设置


效果


获取更多的文章,欢迎关注微信公众号


易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!