In questa lezione impareremo a costruire le celle. Spero che per il momento il tutto sia chiaro!!!
TABELLA
Un consiglio: Qualsiasi cosa inseriate all'interno di una pagina HTML che sia sempre racchiusa in celle....perché se no è un CASINO ve lo dico per esperienza personale.... Il TAG da inserire ora è <table>
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202">
<tr>
<td>
</td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
All'interno del TAG è stata definita la sua larghezza (width), lo spessore del bordo (border) e la sua altezza (height). Divertitevi a cambiare le dimensioni della cella. Il <tr> determina la riga Il <td> determina la cella Ora definiremo l'allineamento della cella:
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td>
</td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
Il TAG <align> definisce l'allineamento in questo caso centrale della cella rispetto alla pagina.
Se vogliamo la cella a sinistra scriveremo "left" a destra "right" .
Come fareste se vi chiedessi di dividermi questa cella in due righe?
Lo potreste fare da soli se ci pensasse solo un po'....provate da soli prima di vedere come faccio io :-P
Per il momento limitatevi a capire il funzionamento, così com'è stato scritto vi permette di impostare righe e colonne ma non ancore di vederle...non vi preoccupate :)
Divisione di una cella in 2 righe
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td> </td>
</tr>
<tr>
<td></td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
Divisione di una cella in 2 colonne
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td> </td>
<td></td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
Avete capito la differenza?
Nella prima abbiamo scritto di:
1) Determinare la riga
2) Aprire e chiudere una cella
3) Chiudere la riga
4) Determinare una seconda riga
5) Aprire e chiudere una cella
6) Chiudere la seconda riga
Nella seconda chiediamo di:
1) Determinare la riga
2) Aprire e chiudere una cella
3) Aprire e chiudere una cella
4) Chiudere la riga
Per suddividere ora una delle due colonne in due righe si utilizza questo comando <rowspan>...... ma se avessimo avuto due righe e le avessimo volute dividere in due colonne avremmo scritto <colspan>
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td> </td>
<td rowspan="2"></td>
</tr>
<tr>
<td></td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
Visualizziamo le colonne e le righe per far ciò coloriamo i bordi di queste..il suo attributo è <bordercolor="?"> dove ? sta per un valore X
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td bordercolor="#00FF66">1 </td>
<td rowspan="2" align="center"></td>
</tr>
<tr>
<td bordercolor="#FF0000" >2</td>
</tr>
</table>
</body>
</html>
Coloriamo anche la colonna:
<html>
<head>
<title>Home</title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> La mia prima pagina </p>
<table width="309" border="2" height="202" align="center">
<tr>
<td bordercolor="#00FF66">1 </td>
<td rowspan="2" align="center" bordercolor="#0000CC">3</td>
</tr>
<tr>
<td bordercolor="#FF0000" >2</td>
</tr>
</table>
</body>
</html>
SALVATE e AGGIORNATE
Oggi è stata davvero lunga la lezione, visto che cominciano ad aggiungersi i TAG con i loro attributi. Ah! A proposito di attributi per quanto riguarda i colori se non conoscete i codici, tipo quelli che ho inserito io per colorare le celle, potete inserire il nome del colore in inglese. Bravi continuate così!!!!!! Io cerco di riscrivervi ogni volta tutti i comandi in modo tale che vedendoli sempre il vostro cervello riesca a percepirli come qualcosa di familiare :-P
Alla prossima! Un saluto da Lu