Imposta la spaziatura delle cellule in CSS - HTML
Diverse proprietà CSS sono utilizzate per modellare il tavolo in HTML, come colore, bordo, margine, imbottitura e molti altri. Sfortunatamente, il "spaziatura cellulare" E "cellpadding"Gli attributi non sono supportati in HTML5. Tuttavia, il CSS "spaziatura del confine"La proprietà viene utilizzata per impostare la spaziatura delle cellule e il CSS"imbottitura"La proprietà è per impostare l'imbottitura delle celle delle celle della tabella.
I risultati del post sono:
- Come creare la tabella in HTML?
- Come impostare l'imbottitura delle celle in CSS?
- Come impostare la spaziatura cellulare nelle tabelle HTML usando CSS?
Come creare la tabella in HTML?
Per creare una tabella in HTML, seguire le istruzioni sotto l'elenco:
- Nella pagina HTML, prima, aggiungi un html "
"Elemento.
- Quindi, aggiungi il
tag che viene utilizzato per specificare la riga di intestazione con "Colspan"Valore dell'attributo"3". Questo attributo renderà la cella uguale a tre colonne. - Dopodiché, aggiungi un po '
Tag per creare righe in una tabella. - La prima riga contiene le intestazioni con il
tag. - Altre righe contengono HTML
Tag per specificare le colonne. Ecco il codice HTML per la creazione di una tabella semplice:
Tavolo Rotolare n Nome dello studente Corsi 1 John Fondamenti di c++ 2 Lisa Fondamenti di Java 3 Diana Interazione umano-computer Passiamo alla sezione CSS per lo styling del tavolo.
Elemento "tavolo" di stile
tavolo
Margine: auto;
bordo: 2px solido #0e5e6f;
background-color: #fdf3e1;
Font-size: 16px;
La spiegazione delle proprietà CSS sopra è elencata di seguito:
- "margine"La proprietà aggiunge spazi attorno all'elemento.
- "confine"È una proprietà stentata che aggiunge un bordo attorno all'elemento specificando la larghezza del bordo, lo stile del bordo e il colore del bordo.
- "colore di sfondo"La proprietà applica il colore allo sfondo dell'elemento.
- "dimensione del font"È la proprietà per impostare la dimensione del carattere dell'elemento.
Elementi di stile "Th" e "TD"
th, td
bordo: 2px solido #404258;
Background-color: #9ad2d8;
L'HTML
E Gli elementi sono disegnati usando le proprietà "bordo" e "colore di fondo". Produzione
Andiamo per impostare la spaziatura cellulare e l'imbottitura cellulare del tavolo HTML.
Come impostare la spaziatura cellulare in CSS?
Come sappiamo, HTML5 non supporta il "spaziatura cellulare" E "cellpadding"Attributi. Tuttavia, la proprietà CSS "spaziatura del confine"Può impostare la distanza tra i bordi della cellula adiacente in questo modo:
tavolo
Spazio di confine: 15px;
Ecco l'output che mostra l'effetto di "spaziatura del confine"Proprietà sull'elemento del tavolo:
Come impostare l'imbottitura delle celle in CSS?
Per impostare l'imbottitura delle celle nella tabella HTML, il CSS "imbottitura"La proprietà è specificata. La proprietà di imbottitura aggiunge spazio all'interno del bordo della cella.
Ora, applica la proprietà di imbottitura CSS su "th" E "td"Elementi della tabella come segue:
th, td
imbottitura: 10px;
Dall'output seguente, si può osservare che gli spazi vengono aggiunti attorno al contenuto della cella:
Abbiamo compilato esempi per impostare la spaziatura delle cellule e l'imbottitura cellulare in HTML usando CSS.
Conclusione
HTML5 non supporta gli attributi di spaziatura e imbottitura cellulare. Per impostare questi fattori, in primo luogo, creare una tabella in HTML e applicare il CSS "spaziatura del confine"Proprietà e"imbottitura" proprietà. La proprietà di spaziatura del bordo CSS viene utilizzata per impostare la spaziatura cellulare. Tuttavia, l'imbottitura viene utilizzata per regolare l'imbottitura delle celle. Questo post ha fornito esempi dettagliati su come impostare la spaziatura delle cellule e l'imbottitura cellulare in CSS.
- Quindi, aggiungi il