1

重複の可能性:
display:box と display:flexbox の違いは何ですか?

ここでcss3flex-box デモを読みました。親要素のスタイルは次のとおりです。

  .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、構文は同じです。それは本当ですか? それらの間にいくつかの違いはありますか？

4

1 に答える 1

2

この情報源によると、仕様が変更されました。

Working Draft では、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;
  }
于 2012-07-20T08:41:33.527 に答える