Nwlapcug.com


Come fare le colonne delle pagine Web della stessa lunghezza

Come fare le colonne delle pagine Web della stessa lunghezza


Un disegno di pagina web comune ha colonne su ogni lato della pagina. Le colonne sono componenti di una tabella. Le tabelle sono elementi della pagina web che estendono su una pagina e formattare la larghezza di ciascuna area. Con le tabelle, è possibile assegnare una lunghezza di colonna uguali che crea un layout accattivante. Tavoli sono semplici componenti HTML, quindi per progettare il layout del sito Web non è necessaria alcuna conoscenza avanzata di HTML.

Istruzioni

1

Creare un elemento di tabella nella pagina web. Un elemento table può occupare una parte del vostro spazio di pagina web, o si può rendere l'intera larghezza della pagina. In questo esempio, la tabella viene creata per un completo lato destro e la colonna di sinistra. Per creare una tabella per la tua pagina, utilizzare il codice riportato di seguito:
< table width = "100%" >
< / tabella >
Il valore "100%" larghezza fa sì che la tabella da occupare l'intera larghezza della pagina nel browser dell'utente. È inoltre possibile impostare una tabella per coprire solo una zona parziale della pagina.

2

Creare due colonne della tabella sono di dimensioni uguali. In questo esempio vengono creati una colonna di sinistra, centrale e destra. Vengono utilizzate le colonne sinistra e destra per i menu, e la colonna centrale è utilizzata per il contenuto della pagina. Il codice seguente crea una colonna di destra e sinistra della stessa larghezza:
< table width = "100%" >
< tr >
< larghezza td = "25%" >< /td >
< larghezza td = "50%" >< /td >
< larghezza td = "25%" >< /td >
< /tr >
< / tabella >
In questo codice, le colonne a sinistra e a destra sono impostate come 25% della larghezza totale della tabella. L'indicazione del 50 per cento è la colonna centrale utilizzata per aggiungere contenuto alle pagine.

3

Aggiungere contenuto alle colonne della tabella. Se le colonne della tabella non vengono popolate, non mostrerà nelle vostre pagine. In questo esempio, a sinistra e il testo sul lato destro sono inseriti. È inoltre possibile compilare la tabella con un carattere di spazio () per attivare le cellule. Il codice seguente è un esempio di una tabella con il contenuto aggiunto:
< table width = "100%" >
< tr >
< larghezza td = "25%" > < /td > navigazione a sinistra
< larghezza td = "50%" > mio contenuto della pagina < /td >
< larghezza td = "25%" > < /td > navigazione a destra
< /tr >
< / tabella >

4

Salvare le modifiche al codice e aprire la pagina web in un browser web. Notare che le colonne nella tabella sono della stessa larghezza della pagina.