Pannelli W3.CSS
Sono un pannello.
Sono un pannello.
sono un contenitore
sono un contenitore
La classe del pannello
La classe w3-panel aggiunge un margine superiore e inferiore di 16px e un riempimento sinistro e destro di 16px a qualsiasi elemento HTML.
Esempio
<div class="w3-panel w3-red">
<p>I am a panel.</p>
</div>
Pannelli per le note
La classe w3-panel è perfetta per visualizzare le note.
Le note sono spesso visualizzate con un colore pallido:
Londra è la città più popolosa del Regno Unito, con un'area metropolitana di oltre 9 milioni di abitanti.
Esempio
<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>
Per ulteriori informazioni su W3.CSS Notes, visitare il capitolo W3.CSS Notes .
Pannelli per preventivi
La classe w3-panel è perfetta per visualizzare le virgolette.
Esempio
<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>
Per ulteriori informazioni sulle quotazioni W3.CSS, visitare il capitolo Quotazioni W3.CSS .
Pannelli per gli avvisi
La classe w3-panel è perfetta per visualizzare gli avvisi.
Gli avvisi vengono spesso visualizzati utilizzando un colore forte:
Pericolo!
Il rosso indica spesso una situazione pericolosa o negativa.
Esempio
<div class="w3-panel w3-red">
<h3>Danger!</h3>
<p>Red often
indicates a dangerous or negative situation.</p>
</div>
Per ulteriori informazioni sugli avvisi W3.CSS, visitare il capitolo Avvisi W3.CSS .
Pannelli come carte
Londra è la città più popolosa del Regno Unito, con un'area metropolitana di oltre 9 milioni di abitanti.
Esempio
<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>
Pannelli arrotondati
Londra è la città più popolosa del Regno Unito, con un'area metropolitana di oltre 9 milioni di abitanti.
Esempio
<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>
Nascondi (Chiudi) un pannello
Nascondere un pannello è facile.
Fare clic sulla X per chiudere questo pannello.
Fare clic sulla X per chiudere questo pannello.
Esempio
<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>
Mostra (Apri) un pannello
Mostrare un pannello (nascosto) è facile:
Esempio
<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>