ホームページ >ウェブフロントエンド >CSSチュートリアル >display:inline とはどういう意味ですか?

display:inline とはどういう意味ですか?

coldplay.xixi
coldplay.xixiオリジナル
2020-06-30 13:41:2314688ブラウズ

display:inline は、インライン要素として表示されるオブジェクトを設定することを意味します。Inline はインライン オブジェクトのデフォルト値であり、一般的に使用される div はブロック レベルの要素です。デフォルトの表示属性は block です。ただし、div の表示は inline に設定すると、複数の div が 1 行に表示されます。

display:inline とはどういう意味ですか?

display:inline の意味:

オブジェクトをインライン要素として表示するように設定します。inline はインラインです。 object のデフォルト値 (ps: インライン オブジェクトは、span など、自動的に改行を生成しない要素です)。通常使用する div はブロック レベルの要素で、デフォルトの表示属性は block です。ただし、 div がインラインに設定され、複数の div がスパンのように 1 行で表示されるようになりました。

行内でブロックとして表示されている要素をインライン表示に変更できます。たとえば、

<div> DIV1 </div>
 
<div> DIV2 </div>

ここでは DIV1 と DIV2 はそれぞれ 1 行を占めていますが、属性を追加すると変更されます。

<div style= "display:inline "> DIV1 </div>
 
<div style= "display:inline "> DIV2 </div>

DIV1 と DIV2 が同じ行に表示されるようになりました。試してみてください。

display:inline に対応するのは、display:block です。block は、CSS 属性が適用された HTML タグをブロックレベルの要素にします。たとえば、SPAN はインラインで表示されますが、display を追加すると、 :block 属性を使用すると、ブロック レベルの要素になります。それは異なります

<span style= "display:block "> SPAN1 </span>
 
<span style= "display:block "> SPAN2 </span>

推奨チュートリアル: "css チュートリアル"

以上がdisplay:inline とはどういう意味ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。