ホームページ  >  記事  >  ウェブフロントエンド  >  display:inline; と float:left;_CSS/HTML について

display:inline; と float:left;_CSS/HTML について

WBOY
WBOYオリジナル
2016-05-16 12:11:141562ブラウズ

まず第一に、display:inline; と float:left; の正しい意味を明確にする必要があります。 display: inline; (inline) 『CSS 決定版ガイド』 中国語テキスト表示: ブロックレベル要素ではない表示要素はすべてインライン要素です。そのパフォーマンスの特徴は「列レイアウト」という形式です。ここでの「列レイアウト」とは、その表現形式が常に列で表示されることを意味します。たとえば、インライン要素 border-bottom:1px Solid #000; を設定すると、それが各行で繰り返され、各行の下に細い黒い線が表示されます。ブロックレベル要素の場合、表示される黒い線はブロックの下にのみ表示されます。

もちろん、これは display:inline; と float:left; の違いのようには見えませんが、float:left; の特性を理解すると、何が起こっているのかが理解できます。 float:left; (left float) は、指定された要素を通常のドキュメント フローから切り離す特別なレイアウト機能です。また、FLOAT はブロックレベルの要素に適用する必要があります。つまり、フローティングはインライン タグには適用されません。言い換えると、FLOAT が適用されると、この要素はブロック レベルの要素として指定されます。

これで、インライン (display:inline;) 要素に幅と高さを設定することはできません。インラインは行レイアウトに属し、その特性は 1 行にレイアウトされるため、幅と高さは設定できません。設定できません。

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