Border-Klassen
Die W3.CSS Grenze Klassen können auf beliebigen HTML-Elemente verwendet werden.
Ich habe Grenzen auf allen Seiten.
Ich habe eine rote untere Grenze
Ich habe abgerundete Ränder.
Beispiel
<div class="w3-border">
<p>I have borders on all sides.</p>
</div>
<div class="w3-border-bottom w3-border-red">
<p>I have
a red bottom border.</p>
</div>
<div class="w3-border
w3-round-xlarge">
<p>I have rounded borders.</p>
</div>
<div class="w3-container w3-pale-blue w3-leftbar w3-border-blue">
<p>I have a blue leftbar.</p>
</div>
Versuch es selber " Es werden Hinweise
Die Noten werden oft mit einer blassen Farbe und einen farbigen Balken angezeigt:
Beispiel
<div class="w3-container w3-pale-blue w3-leftbar w3-border-blue">
<p>London
is the most populous city in the United Kingdom,
with a
metropolitan area of over 13 million inhabitants.</p>
</div> Versuch es selber " angezeigte Panels
Die Platten können in eine Million verschiedene Arten angezeigt werden:
London ist die Hauptstadt von England. Es ist die bevölkerungsreichste Stadt im Vereinigten Königreich, mit einem Ballungsgebiet von mehr als 13 Millionen Einwohnern.
London ist die Hauptstadt von England. Es ist die bevölkerungsreichste Stadt im Vereinigten Königreich, mit einem Ballungsgebiet von mehr als 13 Millionen Einwohnern.
London ist die Hauptstadt von England. Es ist die bevölkerungsreichste Stadt im Vereinigten Königreich, mit einem Ballungsgebiet von mehr als 13 Millionen Einwohnern.
Beispiel
<div class="w3-container w3-light-grey w3-border">
<p>London is the
most populous city in the United Kingdom,
with a metropolitan area
of over 13 million inhabitants.</p>
</div> Versuch es selber " Anzeige Zitate
Der w3-Container - Klasse kann , verwenden Sie Anführungszeichen angezeigt werden soll .
Beispiel
<div class="w3-container w3-leftbar w3-light-grey">
<p><i>"Make it
as simple as possible, but not simpler."</i></p>
<p>Albert
Einstein</p>
</div> Versuch es selber " Wenn Sie HTML <blockquote>, denken Sie daran, dass HTML eine zusätzliche linken Rand hinzu:
"MachenSiees so einfach wie möglich, aber nicht einfacher."
Albert Einstein
Beispiel
<blockquote class="w3-container w3-leftbar w3-light-grey">
<p><i>"Make
it as simple as possible, but not simpler."</i></p>
<p>Albert Einstein</p>
</blockquote> Versuch es selber " Hoverable Borders
Die w3-Hover-Borderline Farbklassen ändern die Farbe der Grenze bei mouse-over:
Red hoverable Grenze
Lila Grenze, die auf schweben blau leuchtet
Beispiel
<div class="w3-container w3-border w3-hover-border-red">
<p>Red
hoverable border</p>
</div> Versuch es selber "