Tabella nidificata Tutorial HTML

November 12

Tabella nidificata Tutorial HTML


HTML è un linguaggio di base di sviluppo di pagine web; utilizza un sistema di tag predefiniti racchiusi tra i simboli "<" e ">". Ogni linea di codice ha un tag aperto e un tag di chiusura: <tag> </ tag>. Le informazioni che si desidera visualizzare sulla pagina si trova tra questi tag aperte e chiuse. Una delle caratteristiche avanzate del linguaggio di programmazione HTML è la tavola; è racchiuso all'interno del set di tag di tabella: <table> </ table>.

Creazione di una tabella in HTML

Utilizzando i tag table aperte e chiuse è possibile creare una semplice struttura di tabella; è possibile utilizzare i molti altri tag disponibili all'interno della famiglia di tag che vengono utilizzati all'interno della vostra tabella HTML per creare qualcosa di molto complesso. elementi di stile definiscono la dimensione, la posizione di confine e altri attributi della tabella. Le informazioni di stile sarebbe stato aggiunto solo per il tag di apertura; a titolo di esempio, per aggiungere un bordo di 1 pixel alla tabella si può usare questo set di tag: <table border = "1"> </ table>.

Il tag tabella stessa non produce le cellule per la visualizzazione, però. Al fine di produrre cellule, è necessario aggiungere un tag set tra i tag table aperti e chiusi. I set di tag utilizzati per la creazione di righe e colonne sono i tag <tr> </ tr> e <td> </ td>; il tag "tr" è per la creazione di una riga e la variabile "td" è per la creazione di una colonna. È inoltre possibile utilizzare il tag "th" al posto del tag "TD" per creare un colpo di testa da tavolo; automaticamente stili il contenuto della cella per distinguerlo come intestazione.

Le regole per la programmazione di un tavolo di stato che è necessario racchiudere i tag "TD" all'interno dei tag "TR" all'interno dei tag "tavola". Una tabella di una cella semplice con un bordo di 1 pixel intorno ad esso sarebbe simile a questa: <table border = "1"> <tr> <td> riga 1, colonna 1 </ td> </ tr> </ table> . Per creare più colonne si dovrebbe semplicemente mettere più <td> </ td> tag all'interno del <tr> </ tr> tag, e di creare più righe si dovrebbe aggiungere altro <tr> </ tr> tag all'interno del <table> </ table> tag.

Le tabelle HTML nidificazione

Tavolini estraibili significa semplicemente mettendo una tabella all'interno di una cella di un'altra tabella. La nuova tabella dovrebbe essere collocato tra i tag <td> </ td> tag della tabella padre. Una tabella di una cella semplice con un bordo di 1 pixel situato all'interno di una tabella a due celle con un bordo di 1 pixel sarebbe simile a questa: <table border = "1"> <tr> <td> riga 1, colonna 1 < / td> <td> <table border = "1"> <tr> <td> riga 1, colonna 2 - tabella nidificata </ ​​td> </ tr> </ table> </ td> </ tr> </ table>. La tabella nidificata in questo esempio si trova nella prima fila e la seconda colonna; si potrebbe aggiungere più "tr" e tag "TD" alla tabella nidificata, aggiungere più "tr" e tag "TD" alla tabella padre, o anche aggiungere più tabelle nidificate all'interno delle celle della tabella padre o la tabella nidificata a creare una struttura più complessa.

Suggerimenti per tavolini impilabili

Quando si inizia a fare tabelle e nidificazione per creare strutture più complesse può diventare piuttosto confusa. E 'una buona idea per disegnare un diagramma delle tabelle prima di iniziare in modo che si può fare riferimento ad esso e prendere appunti mentre si lavora. Quando si crea il codice, ogni nuova serie di tag dovrebbe avere la propria linea; mettere in una tappa dura (enter) dopo ogni tag di chiusura e quindi aggiungere schede per rientrare ogni set di tag. Questo tipo di strutturazione renderà le tabelle più facile da leggere.

È anche possibile commentare le linee nella vostra programmazione utilizzando uno speciale set di tag di commento; usare "<! -" per aprire il commento e "->" per chiuderla. Commentando possono essere posizionati ovunque all'interno del codice HTML ed è un buon modo per aggiungere note per ricordarsi di ciò che hai codificati.

Creazione di nidificato dal basso verso l'alto è anche un buon modo per evitare confusione. Si potrebbe iniziare con il vostro tavolo insieme più profonda (fare riferimento al diagramma che hai creato) e poi racchiuderla nella tabella padre e continuare a lavorare verso l'esterno in questo modo. Salvare il lavoro, spesso e caricare la pagina in un browser per assicurarsi che la struttura sta trasformando il modo immaginate.