le tabelle
Download
Skip this Video
Download Presentation
Le tabelle

Loading in 2 Seconds...

play fullscreen
1 / 13

Le tabelle - PowerPoint PPT Presentation


  • 127 Views
  • Uploaded on

Le tabelle. Marco Gribaudo marcog @di.unito.it http://www.di.unito.it/~marcog/Savigliano. P.s.: Queste slide sono state adattate da quelle della Prof. Cristina Gena ( http://www.di.unito.it/~cgena ), con spunti tratti dal materiale della Prof. Rossana Damiano

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Le tabelle' - istas


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
le tabelle
Le tabelle

P.s.: Queste slide sono state adattate da quelle della Prof. Cristina Gena (http://www.di.unito.it/~cgena), con spunti tratti dal materiale della Prof. Rossana Damiano

(http://www.di.unito.it/~rossana).

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide2
HTML
  • Le tabelle permettono di:
  • Inserire i testi in un area di dimensioni specificate
  • Allineare differentemente il testo
  • Colorare in modo diverso gli sfondi delle signole celle

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide3
HTML

Tabelle

Per creare una tabella si usa il tag

<table>

istruzioni righe e celle della tabella

</table>

<table> ha vari attributi che servono per stabilire le caratteristiche della tabella

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide4
HTML

<table

border=“numero” {larghezza in pixel dei bordi}

align=“left | right | center”

{allineamento della tabella nella pagina}

{spazio tra bordo e contenuto delle celle}

width=“numero | percentuale”

{larghezza della tabella in pixel o in %}

height=“numero | percentuale”

{lunghezza della tabella in pixel o in %}

>

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide5
HTML

TABELLA: LE RIGHE

Le celle di una tabella vengono elencate riga per riga, partendo dall’alto verso il basso.

Ogni riga viene introdotta con il comando <td>:

<table>

<tr> nuova riga </tr>

</table>

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide6
HTML

TABELLA: LE CELLE

All’interno di una riga, si specificano le varie celle, da sinistra verso destra con il comando <td>

<td> nuova cella all’interno delle righe </td>

<table>

<tr> <td> A1 </td> <td> A2</td> </tr>

<tr> <td> B1 </td> <td> B2</td> </tr>

</table>

L’esempio crea una tabella 2x2 come questa:

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide7
HTML

TABELLA: LE CELLE

Il comando TD ha numerosi attributi, per definire la grandezza della cella, l’allineamento del testo al suo interno, ed il colore del suo sfondo:

<td

align= “left | right | center” {allineamento nella cella}

valign= “top | middle | bottom |baseline”

{allineamento del testo rispetto alle celle}

bgcolor = “colore”

width=“numero”

{larghezza della cella}

height=“numero”

{lunghezza della cella}

>

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide8
HTML

Ci puo’ essere anche una sola cella per riga:

<table> <tr><td>Questa è la prima riga.</td></tr> <tr><td>Questa è la seconda riga.</td></tr></table>

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide9
HTML

In alternativa a <td>, esiste un tag specifico per i titoli delle collonne della tabella (i.e. le celle nella prima riga)

<th> per il titolo delle colonne

<th> titolo della colonna (bold e centrato) </th>

Questo tag visualizza il contenuto della cella in grassetto.

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide10
HTML

E’ possibile creare celle che si estendono su piu’ colonne utilizzando l’attributo colspan:

<td (th)

colspan=“numero”

{numero di colonne nella cella}

>

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide11

ESEMPIO di COLSPAN

Il seguente esempio permette di espandere una cella su 2 colonne

<table border="1" >    <tr>

<td >prima colonna</td>         <td >seconda colonna</td>         <td> terza colonna</td>    </tr> <tr>          <td> come sopra</td>         <td colspan="2">cella che occupa 2 colonne</td>   </tr></table>

Marco Gribaudo - thanks to C. Gena e R. Damiano

esempio di colspan
ESEMPIO di COLSPAN

Marco Gribaudo - thanks to C. Gena e R. Damiano

slide13
HTML

OSS:

le tabelle possono essere annidate le une dentro le altre…

Marco Gribaudo - thanks to C. Gena e R. Damiano