zoukankan      html  css  js  c++  java
  • -webkit-box

    父容器

    display: flex;
    justify-content: center;/*主轴*/
    align-items: center; /*交叉轴*/

    display: -webkit-box;
    -webkit-box-pack: center;/*主轴*/
    -webkit-box-align: center;/*交叉轴*/

    -webkit-box-pack: justify;   /*主轴 最左的靠最左,最右的靠最右*/

    display: -webkit-box;
    -webkit-box-orient:horizontal; /*默认水平排列,horizontal | vertical | inherit;*/
    -webkit-box-pack:start; /*start end center justify 主轴方向*/
    -webkit-box-align:stretch; /*start | end | center | baseline | stretch; 交叉轴*/

    子容器

    -webkit-box-flex:1.0;     /*占剩下空间的所有*/

    用于父元素的样式:

    display: -webkit-box; 该属性会将此元素及其直系子代加入弹性框模型中。(Flexbox 模型只适用于直系子代)

    -webkit-box-orient:horizontal | vertical | inherit; 该属性定义父元素的子元素是如何排列的。

    -webkit-box-pack: start | end | center | justify; 设置沿 box-orient 轴的父元素中子元素的排列方式。因此,如果 box-orient 是水平方向,则父元素的子元素是水平的排列

    -webkit-box-align:start | end | center | baseline | stretch; 基本上而言是 box-pack 的同级属性。设置框的子代在框中的排列方式。如果方向是水平的,该属性就会决定垂直排

    用于子元素的样式

       box-flex: 0 | 任意数字; 该属性让子容器针对父容器的宽度按一定规则进行划分。

  • 相关阅读:
    Java IO: InputStreamReader和OutputStreamWriter
    Java IO: 序列化与ObjectInputStream、ObjectOutputStream
    Java IO: Buffered和Data
    [Codeforces Round #613 (Div. 2)]
    [算进] 巴士
    [算进] 小木棍
    [算进] 数据备份
    [算进] 双端队列 题解
    [算进] 蚯蚓 题解
    [算进] 赶牛入圈 题解
  • 原文地址:https://www.cnblogs.com/wulinzi/p/8646835.html
Copyright © 2011-2022 走看看