2016-08-15 14 views
2

私は最近、フレックスボックスについて多くのことを学んできましたが、1つのことはまだ私には不明です。私はいつもflex/inline-flexからdisplayを設定するか、それがblock/inline-blockを使用して、これまで有利であるべきでしょうか?display:blockを使うべきか、display:flexを使うべきですか?

私はいくつかの有用な記事を発見したが、記事のどれもが、この特定の質問に答えるん。 This articleは、display: blockと比較する代わりにflexboxを使用して異なるdisplay値の違いを説明しました。質問は、block/inline-blockを使用していることが古くなったと述べていますが、私はそれを確認する他の情報源は見ていません。 display: blockが時代遅れになった場合、私はW3 Schoolsでそうだと思っていたでしょう(彼らはいつも正しいとは言えませんが、彼らは良いソースのようです)。

いくつかの回答はthis articleと記載されていますが、display: flexの代わりにdisplay: blockを使用する必要がある場合は説明しません。

と同様のの質問は、this onethis oneです。両方とも素晴らしい記事ですが。最初のものは両方に長所と短所を与えていましたが、flexboxの唯一の重大な欠点はこのプロジェクトでは問題にならないブラウザ互換性でした。後者の記事では、display: flexを使用すると、要素にフレックスボックスのプロパティを保持させることができたという私が見ている最高の答えが得られました。フレックスボックスのプロパティが必要ない場合は、私はちょうどdisplay: blockを使うべきですか?パフォーマンスに影響がありますか?または、ちょうど常にdisplay: flexを使用する必要がありますか?

+0

個人的に私は '* {ディスプレイの大リセット好き:フレックスを。 } '、これは驚くほどうまく動作します。それを試してみてください。 –

+0

@torazaburoは、あなたはすべてを表示する必要がありますことを信じて:フレックス? – Taylor

+0

それは一部の人が好きなオプションです。 –

答えて

3

彼らは別のボックスレイアウトモデルです。すべてが有効で、それぞれには長所と短所があります。

blockinline-blockどちらも時代遅れです。それらを使用することはできますが、CSSワーキンググループは、これらの古いレイアウトで使用できる新しい機能を追加しています。フレックスボックスの

だけ重大な欠点が偽のブラウザの互換性

た、フレキシボックスがlack of floating and lack of multicolumnsのように、複数の欠点があります。

Flexのレイアウトは、レイアウトをブロックする表面的に似ています。これは、より複雑なテキストベースあるいはfloatscolumnsとしてブロックレイアウトで を使用することができるドキュメント中心の性質、 の多くを欠いています。リターンでは、そのWebアプリケーションと複雑なWebページは、多くの場合、必要 な方法でコンテンツをスペースを配布し、整列させるための シンプルかつ強力なツールを得ます。

はそれはそれはフレキシボックスのプロパティを必要としない場合は、屈曲を必要としない場合でも、私はちょうど、display: block

フレキシボックスがまだ動作して使用する必要があることを意味しています。しかしその場合、私はそれを落胆させるでしょう。ブロックレイアウトが簡単で、ブラウザが高速にレンダリングできることを意味する場合があります。

関連する問題