come impostare tre colonne in una pagina

09-07-2008, 20.22.02

Ho creato una pagina web con HTML, vorrei sapere come poter inserire tre colonne nella pagina. Vedo che molti utilizzano dei riquadri o le tabelle per incolonnare una serie di cose a destra, un immagine al centro e altre cose a sinistra. Quali codici vanno inseriti per creare le tabelle?

cerca di mettere titoli più esplicativi

**seneca** · 09-07-2008, 20.28.01

Hai due possibilità, come dici te, i <div> e le tabelle.
Per le tabelle devi usare i tag <table>, <td> e <tr> e relativi attributi.
Con una ricerca sul forum/google trovi facilmente più informazioni a riguardo ed esempi.
Ciao!

09-07-2008, 20.43.00

Grazie, ho trovato una guida su google.

Ho scritto questa parte per la tabella:

<table>
<tr>Regola 1 - Il rettangolo di gioco<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 2 - Il pallone <a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 3<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 4<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 5<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 6<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 7<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 8<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 9<a href="http://www.html.it/">HTML.IT</a>.</tr>
<tr>Regola 10<a href="http://www.html.it/">HTML.IT</a>.</tr>
</table>

Ma non mi appare la tabella. Cosa ho sbagliato?

EDIT:
Ho aggiunto i <br> per andare a capo ma non riesco a vedere le linee della tabella.

**seneca** · 09-07-2008, 20.49.28

Posta il link della pagina dove fai le prove.
I <br> non servono al tuo scopo.

09-07-2008, 20.58.06

Questo e' il link http://arbitrofiero.altervista.org/regole5.html

09-07-2008, 21.54.48

devi scrivere dopo i <tr> i <td>

Praticamente i <tr> sono le righe mentre i <td> le colonne

**seneca** · 09-07-2008, 22.34.21

Esatto, devi fare una cosa cosi:

Codice HTML:

<table>
<tr><td>Regola 1 - Il rettangolo di gioco<a href="http://www.html.it/">HTML.IT</a>.</td></tr>
...
</table>

E comunque, vedendo il tuo codice, non hai messo il tag principale, <table>!

10-07-2008, 00.47.36

Ho scritto questa parte per la tabella: (..) Ma non mi appare la tabella. Cosa ho sbagliato? (..) EDIT:
Ho aggiunto i <br> per andare a capo ma non riesco a vedere le linee della tabella.

A parte i consigli che ti hanno già dato, è necessario specificare la presenza o assenza ( e lo spessore ) dei bordi delle varie celle della tabella per renderli visibili. E poi, per aggiungere altre tabelle potresti usare una combinazione tra tabelle e CSS:

Codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> 

table.cont { border:1px solid #fff; } td.cont { border:0; padding:7px; 
font:bold 13px tahoma; } table.box { border:1px solid #b00; 
height:570px; } td { border:1px solid #0ae; padding:0 1px 0 6px; } 
td.title { border:0; padding:0 1px 18px 3px; } </style> </head> 

<body bgcolor="pink"> <br> <table class="cont" width="970"><tr><td class="cont">

<table class="box" width="370"><tr><td class="title">REGOLAMENTO CALCIO A 5
</td></tr><tr><td>
Regola 1 - Il rettangolo di gioco <a href="http://www.aia-figc.it/calcioa5/regola01.htm">VAI</a>.
</td></tr><tr><td>
Regola 2 - Il pallone <a href="http://www.aia-figc.it/calcioa5/regola02.htm">VAI</a>.
</td></tr><tr><td>
Regola 3 - Numero dei calciatori <a href="http://www.aia-figc.it/calcioa5/regola03.htm">VAI</a>.
</td></tr><tr><td>
Regola 4 - Equipaggiamento dei calciatori  <a href="http://www.aia-figc.it/calcioa5/regola04.htm">VAI</a>.
</td></tr><tr><td>
Regola 5 - Arbitro <a href="http://www.aia-figc.it/calcioa5/regola05.htm">VAI</a>.
</td></tr><tr><td>
Regola 6 - Secondo arbitro <a href="http://www.aia-figc.it/calcioa5/regola06.htm">VAI</a>.
</td></tr><tr><td>
Regola 7 - Cronometrista e terzo arbitro <a href="http://www.aia-figc.it/calcioa5/regola07.htm">VAI</a>.
</td></tr><tr><td>
Regola 8 - Durata della gara <a href="http://www.aia-figc.it/calcioa5/regola08.htm">VAI</a>.
</td></tr><tr><td>
Regola 9 - Calcio d'inizio e ripresa del giuoco <a href="http://www.aia-figc.it/calcioa5/regola09.htm">VAI</a>.
</td></tr><tr><td>
Regola 10 - Pallone in giuoco e non in giuoco  <a href="http://www.aia-figc.it/calcioa5/regola10.htm">VAI</a>.
</td></tr><tr><td>
Regola 11 - Segnatura di una rete <a href="http://www.aia-figc.it/calcioa5/regola11.htm">VAI</a>.
</td></tr><tr><td>
Regola 12 - Falli e comportamento antisportivo  <a href="http://www.aia-figc.it/calcioa5/regola12.htm">VAI</a>.
</td></tr><tr><td>
Regola 13 - Calci di punizione <a href="http://www.aia-figc.it/calcioa5/regola13.htm">VAI</a>.
</td></tr><tr><td>
Regola 14 - Falli cumulativi <a href="http://www.aia-figc.it/calcioa5/regola14.htm">VAI</a>.
</td></tr><tr><td>
Regola 15 - Calcio di rigore <a href="http://www.aia-figc.it/calcioa5/regola15.htm">VAI</a>.
</td></tr><tr><td>
Regola 16 - Rimessa dalla linea laterale <a href="http://www.aia-figc.it/calcioa5/regola16.htm">VAI</a>.
</td></tr><tr><td>
Regola 17 - Rimessa dal fondo <a href="http://www.aia-figc.it/calcioa5/regola17.htm">VAI</a>.
</td></tr><tr><td>
Regola 18 - Calcio d'angolo <a href="http://www.aia-figc.it/calcioa5/regola18.htm">VAI</a>.</td></tr></table>

</td><td width="260" class="cont">

<table class="box" width="260"><tr><td class="title">...</td></tr></table> 

</td><td width="300" class="cont">

<table class="box" width="300"><tr><td class="title">...</td></tr></table> 

</td></tr></table> </body> </html>

10-07-2008, 02.18.43

Grazie per l'aiuto!

Ho quasi completato la pagina che potete vedere qui: http://arbitrofiero.altervista.org/tabellafine.html

Come faccio a rendere le due tabelle della stessa dimensione?

La tabella di destra e' piu' grande rispetto ai link presenti al suo interno.

**seneca** · 10-07-2008, 11.28.59

Ad una dai width=370 e all'altra width=500.
Ricontrolla anche i tag <td>: ne apri uno tra le due tabelle e poi lo chiudi (?) all'interno della seconda mentre ne apri/chiudi uno alla fine della seconda.
Forse ti conveniva fare una sola tabella, con due colonne

10-07-2008, 13.05.36

Come posso creare una tabella con due colonne?

**seneca** · 10-07-2008, 13.18.26

Originalmente inviato da arbitrofiero

Come posso creare una tabella con due colonne?

Codice HTML:

<table>
  <tr>
    <td>Colonna 1 Riga 1</td>
    <td>Colonna 2 Riga 1</td>
  </tr>
  <tr>
    <td>Colonna 1 Riga 2</td>
    <td>Colonna 2 Riga 2</td>
  </tr>
...
</table>

16-07-2008, 20.34.06

Ho un altro problema con le tre colonne.

Ho creato questo codice per avere tre colonne come segue:

Colonna di Sinistra con immagine

Colonna Centrale con i link

Colonna di destra con immagine

Questo e' il mio codice

Codice HTML:

<table>
<tr>
<td>
<a><img src="http://www.sru.edu/images/School%20Nurse%20pic.jpg" width="250" height="380" ></b></a>

<p align="center">
<table width="75%" border="1">

<table width="75%" border="1">
<td width="75%">
<a href=title="Area 1"><a href="http://arbitrofiero.altervista.org/Infermiere/serviziofferti.html">Servizi Offerti</a>
<br>
<a href=title="Area 2"><a href="http://arbitrofiero.altervista.org/Infermiere/dovesiamo.html">Dove Siamo</a>
<br>
<a href=title="Area 3"><a href="http://arbitrofiero.altervista.org/Infermiere/contatti.html">Contattaci</a>
<br>
<a href=title="Area 3"><a href="http://arbitrofiero.altervista.org/Infermiere/chisiamo.html">Chi Siamo</a>
</div>

<td width="150%">
<td>
<a href="#" title="Chi Siamo"><b><img src="http://www.sru.edu/images/School%20Nurse%20pic.jpg" width="250" height="380" ></b></a>
<br>
</div>
</td>
</table>

La prima immagine non appare allineata alle altre due colonne, cosa ho sbagliato?

**seneca** · 16-07-2008, 21.59.22

Perchè non cominci col pulire il tuo codice?
Se è questo e basta, dentro i tag <body> e </body>, beh, c'è un pò di casino:

3 tabelle aperte e solo una chiusa
4 tag <td> e uno solo chiuso
1 tag <tr> aperto e mai chiuso
...

Discussione: come impostare tre colonne in una pagina

LinkBack

Strumenti discussione

Display

come impostare tre colonne in una pagina

Regole di scrittura