CSS3-Tutorial (6): Erstellen Sie mehrere Spalten für eine Website_css3_CSS_Web-Seitenproduktion

Webseitenerstellung Webjx-Artikeleinführung: Verwenden Sie CSS3, um mehrere Spalten für Ihre Website zu erstellen, ohne für jede Spalte bestimmte Ebenen oder Absätze entwickeln zu müssen. Mit CSS3 können Sie mehrere Spalten für Ihre Website erstellen, ohne dass für jede Spalte bestimmte Ebenen oder Absätze erforderlich sind. Vorheriger Artikel: CSS3-Tutorial (5): Hintergrundbilder für Webseiten und mehrere Hintergrundbilder 1

Mit CSS3 können Sie mehrere Spalten für Ihre Website erstellen, ohne für jede Spalte eine bestimmte Ebene oder einen bestimmten Absatz angeben zu müssen. .
Verwenden Sie CSS3, um mehrere Spalten für Ihre Website zu erstellen, ohne für jede Spalte bestimmte Ebenen oder Absätze erstellen zu müssen.
Vorheriger Artikel: CSS3-Tutorial (5): Hintergrundbild einer Webseite
Wie mehrere Hintergrundbilder ist auch CSS3 mit mehreren Spalten eine meiner Lieblingstechnologien. Ich kann mir vorstellen, dass diese CSS3-Eigenschaft viele potenzielle Verwendungsmöglichkeiten außerhalb von Zeitungs- und Zeitschriftenlayouts bietet. Wenn Sie diese Methode in einer Idee oder auf einer persönlichen Website verwenden, senden Sie bitte Ihren Link in den Kommentaren unten. Ich bestätige gerne, dass diese Methode in vielen Layouts verwendet werden kann.
Browserübergreifende Kompatibilität:
Die besseren Browser, die mehrspaltiges CSS3 unterstützen, sind Firefox, Safari und Google Chrome, daher müssen wir die Präfixe -moz und -webkit verwenden. CSS3 mehrere Spalten (Breite)

Der obige Screenshot ist der Effekt der Verwendung des folgenden CSS3-Stils:
#multiColumnWidth { text-align: justify; -moz-column-width: 20em; -webkit-column-width: 20em; } >Browserunterstützung:

Firefox(3.05…)

Google Chrome(1.0.154…)

Google Chrome(2.0.156…)

Internet Explorer(IE7, IE8 RC1)

Opera(9.6…)

Safari(3.2.1 Windows…) CSS3 mehrere Spalten (Anzahl der Spalten)

Der Screenshot oben zeigt den Effekt der Verwendung des folgenden CSS3-Stils:

#multiColumnCount { text-align: justify; -moz-column-gap: 1.5em; moz-column-rule: 1px solid #dedede; -webkit-column-gap: 1.5em; -webkit-column-rule: 1px solid #dedede; 🎜>
Firefox(3.05…)

Google Chrome(1.0.154…)

Google Chrome(2.0.156…)

Internet Explorer(IE7, IE8 RC1 )

Opera(9.6…)

Safari(3.2.1 Windows…)

Das Obige ist das CSS3-Tutorial (6): Erstellen Sie eine Website mit mehreren Spalten_css3_CSS_webpage Die Inhalte erstellt, weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!