il design tableless Web utilizza CSS e tag div per disporre i dati sulla pagina. È possibile sostituire le tabelle HTML con tag "div". Per ogni riga della tabella e tag di colonna, si sostituisce il codice HTML esistente con un tag div. Il processo rende il più pulito il codice HTML e più facilmente letto da altri programmatori che hanno bisogno di modificare o aggiungere ai progetti HTML.

istruzione

1 Fare clic sulla pagina Web con le tabelle che si desidera sostituire e selezionare "Apri con" dal menu contestuale. Clicca l'editor HTML o testo che si desidera utilizzare per modificare la pagina.

2 Individuare la tabella che si desidera modificare. Sostituire il tag "<table>" con il primo div, che diventa il contenitore div principale. Sostituire tutte le righe e le colonne all'interno della tabella con i tag div nidificati. Il seguente codice è un esempio di una tabella HTML:

<Table>

<Tr>

<Td> prima colonna </ td>

<Td> seconda colonna </ td>

</ Tr>

</ Table>

Sostituire il tag "<table>" con "<div>" tag e sostituire "</ table>" apertura con una chiusura "</ div>" tag.

3 Sostituire la riga della tabella o "<tr>" tag con i tag div. Utilizzando la tabella dal punto 2, il seguente codice sostituisce i tag riga tabella con i tag div:

<Div id = "maincontainer">

<Div id = "tablerow">

<Td> prima colonna </ td>

<Td> seconda colonna </ td>

</ Div>

</ Div>

4 Sostituire le cellule o le colonne della tabella. Il "<td>" tag contengono i dati. Il seguente codice completa la sostituzione della tabella HTML con i tag div:

<Div id = "maincontainer">

<Div id = "tablerow">

<Div id = "cell1"> prima colonna </ div>

<Div id = "cell2"> seconda colonna </ div>

</ Div>

</ Div>