Tabella HTML

**AschenStrom** · 03-07-2010, 15:53

salve a tutti!
ho utilizzato la splendida guida di questo sito per iziare a capire qualcosa di riguardo l'HTML. Devo dire che l'ho trovata molto esaudiente e veloce da consultare.
Avrei tuttavia un paio di domande a cui nn riesco a trovare risposta.
quello che sto costruendo è fondamentalmente una tabella fatta in questo modo

<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> <h1>Titolo</h1> </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table>
<table border="1">
<tr>
<td>

primo elemento
secondo elemento
terzo elemento

</td>
<td>Testo</td>
</tr>
<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table>

vorrei però sapere come è possibile fare alcune cose:
1) come posso fare in modo che le immagini affianco del titolo occupino rispettivamente il 15% della pagina ed il titolo il resto?
2) come posso separare le colonne contenenti rispettivamente "primo,secondo, terzo elemento" e "Testo", tra di loro, di 20pixel?
3) come posso incolonnare le 2 immagini in fondo in modo tale da renderle centrate rispetto alle colonne sovrastanti?
4) come posso fare in modo che clikkando queste 2 immagini si venga reindirizzati ad un altra pagina? quindi un link

grazie mille della pazienza e della disponibilità

**Shores** · 03-07-2010, 16:24

Prima di tutto, ci sono un certo numero di errori nel tuo html, primo tra tutti il fatto che non puoi MAI chiudere una tabella con </table> se non la hai aperta con <table>.

Detto questo, puoi dare a una cella la larghezza che vuoi dando una class al TD e poi mettendo nel css width:15%;

Poi, primo secondo e terzo e Testo sono in due celle diverse, quindi basta che tu dia padding=20px ad una delle due e sei a posto.

Per centrare un qualsiasi oggetto devi dargli tramite css margin-left:auto e margin-right:auto.

Per fare diventare una immagine un link basta che contorni il tag IMG con un tag A:

[img][/img]

Ciao!

**AschenStrom** · 03-07-2010, 16:29

grazie della risposta ma l'ho aperta con <table> anche perché provando questo script funziona, almeno credo.
se no, in soldoni

Detto questo, puoi dare a una cella la larghezza che vuoi dando una class al TD e poi mettendo nel css width:15%;

come risulterebbe?
anche perché non ho idea di cosa significhi "dare una class"
grazie ciao

**Shores** · 06-07-2010, 02:18

Originariamente inviato da AschenStrom
grazie della risposta ma l'ho aperta con <table> anche perché provando questo script funziona, almeno credo.

No, non ci siamo capiti: nel tuo codice NON ci sono tanti <table> quanti ci sono </table> quindi DI CERTO non hai aperto/chiuso bene i tag... Per capirci, per ogni tag che si chiude con </tag> ci deve essere il SUO corrispondente <tag>!

se no, in soldoni come risulterebbe?
anche perché non ho idea di cosa significhi "dare una class"
grazie ciao

Dare una class significa che devi:

1) inserire all'inizio del tuo html, dentro al tag <head>:
<link href="stile.css" media="all" rel="stylesheet" type="text/css" />
2) creare nella stessa cartella del tuo file html un file stile.css
3) nel tag td a cui vuoi dare larghezza 15% mettere:
<td class="largo15">
4) nel file stile.css inserire:
.largo15 {width:15%;}

Ciao!

**AschenStrom** · 06-07-2010, 11:15

si hai ragione per i table ho sbagliato a riportare io.
comunque grazie per le info provo e posto al massimo

**AschenStrom** · 07-07-2010, 10:54

scusate la mia ignoranza,
sto cercando di comprendere come attivare il css.
ho visto che nell'head devo inserire <style type="text/css"> ... </style> con i comandi necessari da eseguire, inquanto "Fogli incorporati".
tuttavia non comprendo come assegnare questi comandi ai singoli elemeneti, se io volessi, come appunto consigliato, dare padding "padding=20px" oppure "margin-left:auto e margin-right:auto" ad un elemento come devo fare e dove devo inseriere il comando?
prendendo sempre come esempio questa tabella. potreste al massimo, se possibile, farmi un esempio per favore?

<head>
<style type="text/css">
</style>
</head>
<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> <h1>Titolo</h1> </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table>
<table border="1";>
<tr>
<td>

primo elemento
secondo elemento
terzo elemento

</td>
<td>Testo</td>
</tr>
</table>
<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table>

grazie della vs pazienza

**Vincent.Zeno** · 07-07-2010, 11:23

NOTA TECNICA

**AschenStrom** · 07-07-2010, 12:02

codice:

<head>
<style type="text/css"> 
</style>
</head>
<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> <h1>Titolo</h1> </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table> 
<table border="1";>
<tr>
<td>
primo elemento
secondo elemento
terzo elemento
</td>
<td>Testo</td>
</tr>
</table>
<table>
<tr>
<td> [img]www.imm.it [/img] </td>
<td> [img]www.imm.it [/img] </td>
</tr>
</table>

grazie

**Shores** · 07-07-2010, 13:06

Originariamente inviato da Shores
...
Dare una class significa che devi:

1) inserire all'inizio del tuo html, dentro al tag <head>:
<link href="stile.css" media="all" rel="stylesheet" type="text/css" />
2) creare nella stessa cartella del tuo file html un file stile.css
3) nel tag td a cui vuoi dare larghezza 15% mettere:
<td class="largo15">
4) nel file stile.css inserire:
.largo15 {width:15%;}

Quoto me stesso: questi sono i passi per usare un foglio di stile esterno, che è MOLTO meglio che usarlo incorporato.

Se proprio vuoi dare uno stile ad un singolo tag, aggiungigli l'attributo style con dentro lo stile che vuoi:

<td style="width:15%;">

Ciao!

**AschenStrom** · 07-07-2010, 13:30

ok ho provato a fare come mi hai suggerito, utilizzando un foglio di stile esterno.
potresti gentilmente dirmi eventuali errori che ho fatto? fatto questo prometto di non tediarti più... almeno per un po'

codice:

<html>
<head>
<link href="stile.css" media="all" rel="stylesheet" type="text/css"/>
</head>
<body bgcolor="gray" text="blue"> 
<table>
<tr>
<td class="largo15">  </td>
<td> <h1><font color="red" size="22">Titolo</font><h1></td>
<td class="largo15">  </td>
</tr>
</table> 
<table border="1";>
<tr>
<td>
<font size="22">
primo elemento
secondo elemento
terzo elemento
</font>
</td>
<td><font size="22">Testo</font></td>
</tr>
</table>
<table>
<tr>
<td>    </td>
<td>    </td>
</tr>
</table> 
</body>
</html>

Discussione: Tabella HTML

Strumenti discussione

Ricerca discussione

Visualizza

Tabella HTML

Permessi di invio