ホームページ >ウェブフロントエンド >CSSチュートリアル >DIV 要素を垂直ではなく水平に表示するにはどうすればよいですか?
DIV 要素のインライン表示
提供されている HTML コードは、DIV 要素を上下に積み重ねて表示します。ただし、望ましい結果は、これらの DIV がインラインで水平方向に整列して表示されることです。
提供された HTML:
<div>foo</div><div>bar</div><div>baz</div>
これらの DIV は、「foo」を含む 3 つの別々の行として表示されます。 1 行目に「bar」、3 行目に「baz」を入力します。
これらの DIV をインラインで表示するには、代わりに SPAN 要素を使用することをお勧めします。デフォルトでは、SPAN 要素はインラインで表示されます。つまり、水平に整列します。変更されたコードは次のようになります。
<span>foo</span><span>bar</span><span>baz</span>
これで、レンダリングされると、「foo」、「bar」、および「baz」が同じ行に並んで表示されます。
インライン DIV は標準ではないため、予期しない動作を引き起こす可能性があることに注意することが重要です。ほとんどの場合、代わりにインライン表示に SPAN 要素を使用することがベスト プラクティスです。
以上がDIV 要素を垂直ではなく水平に表示するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。