Nwlapcug.com


Come avere una tabella HTML con un bordo intorno ad esso, ma non intorno le righe

Sebbene i tag di tabella HTML possono richiedere un attributo di "confine", questo attributo si applica solo per l'intera tabella e aggiungerà i bordi intorno a tutte le celle della tabella pure. Poiché l'attributo border è considerato obsoleto in ogni caso, è possibile utilizzare codice di Cascading Style Sheets (CSS) per definire gli stili del bordo per qualsiasi parte della vostra tabella basata su HTML.

Istruzioni

1

Aprire il tuo file HTML contenente la tabella nell'editor di testo o codice di vostra scelta. Buoni programmi includono NotePad + +, BBedit e jEdit, ma il vecchio standby del blocco note in Windows funziona pure.

2

Individuare il tag di tabella nel file HTML. Tutte le tabelle iniziano con il tag < table > e terminano con il < / tavolo > tag. Tra questi tag < thead > definisce la sezione di intestazione, < tbody > definisce il corpo della tabella e < tr > Tag definire righe. Singola cella dati ottiene avvolto in < td > e < /td > Tag. Questi tag non sono troppo importanti qui, però, dato che è solo necessario impostare uno stile per il tag < table >.

3

Aggiungere < style > e < / stile > tags all'interno del file HTML < head > Tag. All'interno di questi tag, digitare la seguente regola di stile CSS: table {border: 1px solid black;}. Questa regola afferma che tutte le tabelle nella pagina Web ottengono un bordo largo un pixel nero. Interruttore "nero" nell'esempio dato a qualsiasi colore con nome (dei 256 colori "Web-safe") o il codice esadecimale del colore, che si può ottenere utilizzando un selettore di colori. Stili di bordo disponibili includono inizio, ridge, inset e solido, punteggiato, tratteggiato, doppio, groove.

4

Aggiungere una nuova regola di stile con lo stesso codice, ma passare la parola "table" a qualunque altri tag di tabella che si desidera fare riferimento. Per aggiungere bordi a righe solo, ad esempio, modificare "tabella" a "tr" nell'esempio.

5

Modificare il tag di tabella di file HTML per leggere "< id tabella ="il tuo nome identificativo">" per dare il vostro tavolo un ID. Per impostare come destinazione solo quella tabella specifica nel codice CSS, è possibile passare la parola "table" nell'esempio di codice CSS per "#your-id-name". Aggiungere una classe anziché un ID alla tabella se si desidera invece un gruppo di tabelle di destinazione. In CSS, anteporre al nome della classe con un puntino invece il simbolo di cancelletto.

Consigli & Avvertenze

  • Come supporto del browser per le regole di stile CSS3 aumenta, puoi provare a utilizzare la nuova proprietà del bordo come border-radius e border-image. Al momento, però, non tutti i browser supportano questi.
  • Rimuovere gli attributi obsoleti del "bordo" o "cellpadding" dai tag di tabella HTML. Questi interferiscono con gli stili CSS e non eseguono il rendering in modo prevedibile in tutti i browser.