Einführungs-Tutorial 4 zum CSS-Webseitenlayout: Zwei Spalten mit fester Breite_Grundlegendes Tutorial

Mit einer Spalte fester Breite als Basis sind zwei Spalten fester Breite sehr einfach. Wir wissen, dass div zur Identifizierung eines bestimmten Bereichs verwendet wird und das Layout von zwei Spalten natürlich die Verwendung von zwei divs erfordert Der Code lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

linke Spalte< ;/div>

Rechte Spalte

In der neuen Codestruktur werden zwei IDs verwendet, nämlich links und rechts. Wir müssen zunächst die Breite für sie angeben und dann die beiden Divs nebeneinander in einer horizontalen Zeile anzeigen, um ein zweispaltiges Layout zu bilden lautet wie folgt:

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd

"> http://www.w3.org/1999/xhtmlttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">"> Zwei Spalten mit fester Breite – AA25.CN <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title> </title> <style type="text/css"> <!-- #left { background-color: #E8F5FE; border: 1px solid #A9C9E2; float: left; height: 300px; width: 200px; } #right { background-color: #F2FDDB; border: 1px solid #A5CF3D; float: left; height: 300px; width: 200px; } --> </style>Linke Spalte Rechte Spalte<div id="left"> </div> <div id="right"> </div>
[Strg+A Alle ausw盲hlen Hinweis:

Verwandte Etiketten：

CSS网页布局入门教程4：二列固定宽度

Quelle：php.cn

Vorheriger Artikel：Worauf Sie beim Erlernen des CSS_Basic Tutorials achten sollten Nächster Artikel：Einführungs-Tutorial 3 zum CSS-Webseitenlayout: Eine Spalte mit fester Breite in der Mitte_Grundlegendes Tutorial

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors

• Was ist eine NullPointerException und wie behebe ich sie?
  2024-10-22 09:46:29
• Vom Anfänger zum Programmierer: Ihre Reise beginnt mit C-Grundlagen
  2024-10-13 13:53:41
• Webentwicklung mit PHP freischalten: Ein Leitfaden für Anfänger
  2024-10-12 12:15:51
• C entmystifizieren: Ein klarer und einfacher Weg für neue Programmierer
  2024-10-11 22:47:31
• Entfalten Sie Ihr Programmierpotenzial: C-Programmierung für absolute Anfänger
  2024-10-11 19:36:51
• Entfesseln Sie Ihren inneren Programmierer: C für absolute Anfänger
  2024-10-11 15:50:41
• Automatisieren Sie Ihr Leben mit C: Skripte und Tools für Anfänger
  2024-10-11 15:07:41
• PHP leicht gemacht: Ihre ersten Schritte in der Webentwicklung
  2024-10-11 14:21:21
• Erstellen Sie alles mit Python: Ein Leitfaden für Anfänger, um Ihrer Kreativität freien Lauf zu lassen
  2024-10-11 12:59:11
• Der Schlüssel zum Programmieren: Die Leistungsfähigkeit von Python für Anfänger freischalten
  2024-10-11 12:17:31

Aktuelle Ausgaben

function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...

Aus 2024-04-29 11:01:01

0

3

2225

So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?

Aus 2024-04-23 00:22:19

0

11

2370

Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.

Aus 2024-04-19 15:37:47

0

1

1979

Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...

Aus 2024-04-18 23:52:34

0

1

1864

Wo gibt es die Kursunterlagen zum CSS-Mindmapping? Kursunterlagen

Aus 2024-04-16 10:10:18

0

0

1936

verwandte Themen

Mehr>

• Python führt zwei Listen zusammen
• Was ist eine Dump-Datei?
• So lösen Sie das Problem, dass CAD nicht in die Zwischenablage kopiert werden kann
• Einführung in Laravel-Komponenten
• Was sind MySQL-Engines?
• BTC-Preis heute
• Der Unterschied zwischen den selbst betriebenen und offiziellen Flagship-Stores von JD.com
• So registrieren Sie ein Bitcoin-Wallet