Question

可能重复：
What are the differences between display:box and display:flexbox

我在这里读过一个css3 flex-box demo，父元素的样式是：

  .flexbox {
    display: -webkit-flexbox;    
    -webkit-flex-pack: center;
    -webkit-flex-align: center;
    width: 50%;
    height: 100px;
    background: orange;
  }

将display: -webkit-flexbox;更改为display: -webkit-box;后，页面布局已更改。

购买我阅读了一些关于-webkit-flexbox和-webkit-box的教程，只是语法相同。这是真的吗？它们之间是否存在一些差异？

Answer 1

根据这个source，规格发生了变化：

工作草案已经对flexbox模型中使用的大部分语法进行了更改。例如：

display: box;

这将成为：

display: flexbox;

两种版本的语法都有效（至少在chrome中）。如果您更改display样式，布局看起来不同的原因是，当您使用-webkit-flex-pack: center;

时，您必须将-webkit-box-pack: center;更改为display: -webkit-box;

所以这相当于你上面的css样式，应该产生相同的布局：

.flexbox {
    display: -webkit-box;    
    -webkit-flex-box: center;
    -webkit-flex-box: center;
    width: 50%;
    height: 100px;
    background: orange;
  }

display：box和display：cbox3中的flexbox有什么区别

1 个答案: