Usare i fogli di stile per accorciare il codice html

[gik25]

<table border="0" style="border-collapse: collapse" width="402" height="100" cellpadding="0" id="table6">
	<tr>
		<td height="20" width="15" background="Pulsanti/top_left.gif"></td>
		<td height="20" width="283" background="Pulsanti/top_center.gif">
		<p align="center"><a href="Fotografia.htm">
		[img]indians_file/pulsanti/button20.gif[/img]</a></p>
		</td>
		<td height="20" width="283" background="Pulsanti/top_center.gif"></td>
		<td height="15" width="15" background="Pulsanti/top_right.gif"></td>
	</tr>
	<tr>
		<td height="80" width="20" background="Pulsanti/left.gif"></td>
		<td height="80" width="566" bgcolor="#DADADA" colspan="2">
		<font color="#FF0000">
		[img]new.gif[/img]:</font><font class="m1">
		</font>
		<a class="titolo" href="Fotografia/Conversione%20unita%20di%20misura.htm">
		<font class="m1">Articolo: </font><font class="m2">Conversione unità di 
		misura</font></a><font class="m2">

		<font class="m3">Un lunghissimo articolo in cui troverete i fattori di conversione 
		per ogni tipo di unità.

		<font class="m4">di Gik25</font></font></font></td>
		<td height="80" width="26" background="Pulsanti/right.gif"></td>
	</tr>
	<tr>
		<td height="16" width="15" background="Pulsanti/bottom_left.gif"></td>
		<td height="16" width="566" background="Pulsanti/bottom_center.gif" colspan="2">
		</td>
		<td height="16" width="15" background="Pulsanti/bottom_right.gif"></td>
	</tr>
</table>

Cosa posso eliminare per ridurre notevolmente la lunghezza di questo codice HTML?

Cosa posso spostare in CSS?

[FreD_TGL]

ti conviene creare un file css in cui metti varie classi di tabelle con i suoi relativi attributi (larghezza, altezza, font etc) e poi richiamarlo nell tag html tramite il tag class

es. mettiamo che nel css hai creato una classe del tipo

.prova {
height: x px; etc etc
}

nel html metti

...
<table (o td se è x una cella) class="prova">testo</table>


in questo modo l html ha già le informazioni che gli arrivano dal css su quella specifica tabella

[gik25]

Quali info posso spostare su css?

height?
Lenght?
background image?

[Jerry Masslo]

Originariamente inviato da gik25
Quali info posso spostare su css?

height?
Lenght?
background image?

tutto e di più - fatto a dovere nello html non ci sarà alcun attributo solo classi o id - non so esattamente cosa ci sia in quel codice ma anche alla tabella si dovrebbe poter rinunciare e si scrive il codice a mano le tabelle sono parecchio più complicate che semplici div e simili

[FreD_TGL]

tutte quelle che vuoi, altezza, larghezza, immagine di background, tipo font, colore font, spazio dalla cella, colore e spessore bordi,

tutto insomma

es.

background-image: url(immagine.gif); font-size : px; color: black; font-family: verdana; width: x px; Padding-left: x px; Padding-right: x px; border-bottom: #c4c4c4 1px solid; border-left: #c4c4c4 1px solid; border-right: #c4c4c4 1px solid; border-top: #c4c4c4 1px solid; height: x px;

[gik25]

Originariamente inviato da FreD_TGL
tutte quelle che vuoi, altezza, larghezza, immagine di background, tipo font, colore font, spazio dalla cella, colore e spessore bordi,

tutto insomma

es.

background-image: url(immagine.gif); font-size : px; color: black; font-family: verdana; width: x px; Padding-left: x px; Padding-right: x px; border-bottom: #c4c4c4 1px solid; border-left: #c4c4c4 1px solid; border-right: #c4c4c4 1px solid; border-top: #c4c4c4 1px solid; height: x px;

La tabella serve a realizzare una cella con i bordi arrotondati (quella nella home page del sito in firma). CSS mi permette di semplificare oltre?