Aggiunta di imbottitura alle celle del tavolo bootstrap - CSS
Uno dei componenti principali dello sviluppo web è la tabella. Visualizza i dati in forma tabulare su un sito Web. Se i dati nelle celle della tabella sono troppo corti o troppo lunghi, può far apparire irregolare la tabella. Per correggere questo, il "imbottitura"La proprietà viene utilizzata per le celle del tavolo.
Questo post descriverà:
- Come aggiungere l'imbottitura alle celle del tavolo bootstrap?
- Come aggiungere l'imbottitura alle celle del tavolo bootstrap usando CSS?
- Come aggiungere imbottitura al tavolo?
Prerequisito: crea una tabella
Per creare una tabella, seguire i passaggi indicati di seguito:
- Innanzitutto, usa il “
"Tag e assegnalo il"tavolo" E "strisce di tavolo" classi.
- All'interno del "
"Elemento, specificare la parte dell'intestazione utilizzando il""Elemento.
- Al suo interno, crea una riga "
”Delle intestazioni usando il" "Tag. - Quindi, crea la sezione del corpo della tabella usando ""Elemento.
- Infine, creare righe di dati utilizzando il "
Tag e " "Tag. Html
Nome Corso Punto Jake Ingegneria software 90 Tina Introduzione a Java 80 John Sistemi informatici 89 Produzione
Come aggiungere l'imbottitura alle celle del tavolo bootstrap?
Un modo per aggiungere imbottitura all'interno delle celle del tavolo è utilizzare le classi di imbottitura bootstrap. Questi includono "P-*","px-*","py-*", e molti altri.
Esempio
Nell'esempio in corso, usa il "PX-5"Classe per aggiungere imbottitura a sinistra e a destra delle intestazioni:
Nome Corso Punto Produzione
Come aggiungere l'imbottitura alle celle del tavolo bootstrap usando CSS?
CSS offre il modo più semplice per aggiungere imbottitura all'interno di ogni cella del tavolo usando il "imbottitura" proprietà. Ecco un esempio che dimostra come aggiungere l'imbottitura a ogni cella del tavolo:
.Tabella td
imbottitura: 30px;Produzione
Finora abbiamo discusso di come aggiungere l'imbottitura alle celle da tavolo. Nella parte in arrivo, imparerai come regolare l'imbottitura al tavolo.
Come aggiungere imbottitura al tavolo?
In CSS, aggiungi le proprietà di seguito al "tavolo" classe:
.tavolo
bordo: 2px solido darkcyan;
Collapse di confine: separato;
imbottitura: 20px;Qui:
- "confine"La proprietà aggiunge un bordo all'elemento.
- "Collapse al confine"Con il valore"separato"Aggiunge un bordo separato attorno al tavolo.
- "imbottitura"Aggiunge spazio attorno al contenuto del tavolo.
Produzione
Abbiamo compilato i metodi per aggiungere imbottitura alle celle della tabella bootstrap.
Conclusione
Esistono diversi modi per aggiungere imbottitura alle celle di una tabella bootstrap. Questi includono l'uso delle classi di imbottitura, come "P-*","px-*", E "py-*". Più specificamente, l'imbottitura può anche essere aggiunta utilizzando CSS "imbottitura" proprietà. Questo articolo ha spiegato come aggiungere spazio di imbottitura alle celle del tavolo bootstrap.
- All'interno del "