CSSの重要なプロパティに、displayがあります。必ず、どこかで使用するといってもいいかと思います。displayは要素の表示方法を制御するために使用されます。下記がよく使用する値です。
①block
ブロックレベル要素として表示されます。(縦並びのイメージです)
要素はコンテナの幅を100%使用し、新しい行で表示されます。
<div>
, <p>
, <h1>
などはデフォルトはblockです。
②inline
インライン要素として表示されます。要素は必要なだけの幅を使用し、同じ行内に他のインライン要素と共に表示されます。 <span>
, <a>
, <strong>
などはデフォルトはinlineです。
③inline-block
インライン要素のように同じ行内に表示されますが、ブロック要素のような幅と高さを持ちます。例: ボタン、画像とキャプションの組み合わせなどで使用します。
④none
要素を非表示にします。レスポンシブなどで使用します。PCサイズで使っていた要素を他のサイズでは隠したい時、使用します。
⑤flex
要素をフレックスコンテナとして表示し、フレックスアイテムとして使用できます。
要素を横並びにする時に、よく使用します。
他にもありますが、上記が頻出の値になります。