Wie richtet man mehrere DIV-Blöcke horizontal aus?

Mehrere DIV-Blöcke horizontal ausrichten

Das Platzieren mehrerer DIV-Blöcke auf derselben horizontalen Linie ist eine häufige Layoutaufgabe in der Webentwicklung. Um dies zu erreichen, befolgen Sie die unten beschriebenen Schritte:

Setzen Sie einen Parent DIV mit text-align: center; um die untergeordneten Elemente horizontal auszurichten.

Stellen Sie innerhalb des übergeordneten DIV die untergeordneten DIVs so ein, dass Folgendes angezeigt wird: inline;. Dadurch können sie Seite an Seite in derselben Linie sitzen.

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

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

Beispielinhalt:

<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>

Zusätzliche Überlegungen:

• Vermeiden Sie es, Rohinhalte direkt in DIV-Elementen zu platzieren. Verwenden Sie geeignete Tags wie

  oder stattdessen.

• Beispiel:

  <p id="bloc1"><?php echo " version ".$version." Copyright &copy; Alle Rechte vorbehalten."; ?></p>

Demo:
https://jsfiddle.net/

Das obige ist der detaillierte Inhalt vonWie richtet man mehrere DIV-Blöcke horizontal aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!