W3.CSS Panele
Ek is 'n paneel.
Ek is 'n paneel.
Ek is 'n houer.
Ek is 'n houer.
Die Paneelklas
Die w3-paneelklas voeg 'n 16px boonste en onderste marge en 'n 16px linker- en regtervulling by enige HTML-element.
Voorbeeld
<div class="w3-panel w3-red">
<p>I am a panel.</p>
</div>
Panele vir notas
Die w3-paneelklas is perfek om notas te vertoon.
Notas word dikwels met 'n ligte kleur vertoon:
Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.
Voorbeeld
<div class="w3-panel w3-pale-green">
<p>London
is the most populous city in the United Kingdom,
with a
metropolitan area of over 9 million inhabitants.</p>
</div>
Om meer te wete te kom oor W3.CSS Notes, besoek asseblief die W3.CSS Notes hoofstuk.
Panele vir kwotasies
Die w3-paneelklas is perfek om aanhalings te vertoon.
Voorbeeld
<div class="w3-panel w3-leftbar w3-sand w3-xxlarge w3-serif">
<p><i>"Make it as simple as possible, but not simpler."</i></p>
</div>
Om meer te wete te kom oor W3.CSS Quotes, besoek asseblief die W3.CSS Quotes hoofstuk.
Panele vir waarskuwings
Die w3-paneelklas is perfek om waarskuwings te vertoon.
Waarskuwings word dikwels met 'n sterk kleur vertoon:
Gevaar!
Rooi dui dikwels op 'n gevaarlike of negatiewe situasie.
Voorbeeld
<div class="w3-panel w3-red">
<h3>Danger!</h3>
<p>Red often
indicates a dangerous or negative situation.</p>
</div>
Om meer te wete te kom oor W3.CSS Alerts, besoek asseblief die W3.CSS Alerts hoofstuk.
Panele as kaarte
Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.
Voorbeeld
<div class="w3-panel w3-blue w3-card-4">
<p>London is the most populous city in the United Kingdom,
with a
metropolitan area of over 9 million inhabitants.</p>
</div>
Geronde panele
Londen is die mees bevolkte stad in die Verenigde Koninkryk, met 'n metropolitaanse gebied van meer as 9 miljoen inwoners.
Voorbeeld
<div class="w3-panel w3-blue w3-round-xlarge">
<p>London is the most populous city in the United Kingdom,
with
a metropolitan area of over 9 million inhabitants.</p>
</div>
Versteek (maak toe) 'n paneel
Om 'n paneel weg te steek is maklik.
Klik op die X om hierdie paneel toe te maak.
Klik op die X om hierdie paneel toe te maak.
Voorbeeld
<div class="w3-panel
w3-display-container">
<span onclick="this.parentElement.style.display='none'"
class="w3-button
w3-display-topright">X</span>
<p>Click on the X to close this panel.</p>
<p>Click on the X to close this panel.</p>
</div>
Wys (maak oop) 'n paneel
Om ('n versteekte) paneel te wys is maklik:
Voorbeeld
<button class="w3-btn" onclick="document.getElementById('id01').style.display='block'">Show
panel</button>
<div id="id01" class="w3-panel w3-green
w3-display-container" style="display:none">
<span onclick="this.parentElement.style.display='none'"
class="w3-button
w3-display-topright">X</span>
<p>Click on the X to close this panel.</p>
<p>Click on the X to close this panel.</p>
</div>