Sapete che a noi di LaraMind piace ripassare, dunque capita che prendiamo un argomento un po’ a caso e iniziamo con il ripasso. Vediamo spesso in giro per il web delle “tabelle HTML orrende”, dunque ci siamo chiesti: ok andiamo non alla BASE, andiamo sotto la BASE, dunque all’HTML, a vedere cosa sono le tabelle e come crearle efficacemente e non solo, andiamo anche a vedere gli elenchi in HTML.
Elenchi HTML
Sono due le tipologie di elenchi in HTML:
- elenchi non ordinati: si descrive utilizzando il tag <ul>. Al suo interno possiamo inserire gli elementi della lista (list item) utilizzando il tag <li>
- elenchi ordinati: sono contraddistinti dalla numerazione degli elementi che compongono la lista. Il tag da utilizzare per aprire un elenco ordinato è <ol> e anche in questo caso gli elementi sono individuati dal tag <li>. L’attributo type applicato al tag ol serve per specificare il tipo di enumerazione che vogliamo applicare [type=”1″ – numeri interi “arabi” (valore di default), type=”a” – numeri alfabeto minuscolo, type=”A” – numeri alfabeto maiuscolo, type=”i” – numeri romani minuscoli, type=”I” – numeri romani maiuscoli]
Tabelle HTML
Gli elementi che compongono una tabella sono:
- <table>: è il contenitore di tutta la tabella e la definisce;
- <tr>: “table row” contiene una riga della tabella;
- <td>: “table data” determina una cella che contiene i valori all’interno di una riga;
- <thead>: serve per raggruppare le righe che rappresentano l’intestazione della tabella;
- <th>: “table header” Indica una cella che contiene un’intestazione;
- <tbody>: raggruppa le righe che contengono il corpo della tabella;
- <tfoot>: racchiude le righe che utilizziamo come footer della tabella;
- <colspan>: per ottenere una cella che occupi più colonne;
- <rowspan>: per ottenere una cella che si estenda su più di una riga.
Corsi LaraMind
Per arrivare in alto ragazzi si parte dalla BASE, quindi dalle Basi di programmazione, e se si hanno insicurezze perché no, si ritorna pure a parlare di HTML!
Dai un’occhiata ai Corsi LaraMind, scopri la soluzione più adatta alle tue esigenze!