ホームページ  >  記事  >  ウェブフロントエンド  >  CSS を使用して 2 つの Div ブロックを同じ行に配置するにはどうすればよいですか?

CSS を使用して 2 つの Div ブロックを同じ行に配置するにはどうすればよいですか?

DDD
DDDオリジナル
2024-11-03 14:02:02554ブラウズ

How to Align Two Div Blocks on the Same Line with CSS?

2 つの Div ブロックを同じ行に配置する

2 つの div ブロックを同じ水平線上に配置するには、CSS と表示プロパティを利用できます。これを実現する方法は次のとおりです。

CSS

<code class="css">#block_container {
    text-align: center;
}

#bloc1, #bloc2 {
    display: inline;
}</code>

HTML

<code class="html"><div id="block_container">
    <div id="bloc1"><?php echo " version ".$version." Copyright &copy; All Rights Reserved."; ?></div>
    <div id="bloc2"><img src="..."></div>
</div></code>

コンテナ div の text-align を中央に設定し、子 div をインライン化する場合、要素がコンテナ内で水平方向に流れ、それに応じて中央に配置されるようにします。

追加メモ

生のコンテンツを div 要素に直接配置しないことをお勧めします。代わりに、

のような適切な HTML タグを使用してください。または <スパン>コンテンツに意味的な意味を与えるため。

以上がCSS を使用して 2 つの Div ブロックを同じ行に配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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