「display: inline-block」は、HTML要素をインラインブロックレベル要素として扱うためのCSSプロパティです。インラインブロックレベル要素は、インライン要素のように同じ行に並べられるが、ブロック要素のように幅や高さを持つことができます。
使用方法は以下のようになります。
1.HTML要素に「display: inline-block」を適用する
例:
<div style="display: inline-block;">これはインラインブロック要素</div>2.CSSファイルに「display: inline-block」を適用する
例:
div {
display: inline-block;
}これにより、「div」要素がインラインブロックレベル要素になり、幅や高さを持って同じ行に並ぶことができます。 このプロパティは、幅を持つ要素を横並びにしながらも、ブロック要素のように幅や高さを持たせることができるので、レイアウトを組む際に便利です。
また、それらインライン要素に対して、width, height, marginなどのプロパティを持っており、見た目を調整することができます。