Andrea Spinelli Linguaggio HTML Lezioni 4-5: Cornici Tabelle Meta-elementi.
-
Upload
raul-mancuso -
Category
Documents
-
view
217 -
download
1
Transcript of Andrea Spinelli Linguaggio HTML Lezioni 4-5: Cornici Tabelle Meta-elementi.
Andrea SpinelliLinguaggio HTML
Lezioni 4-5:CorniciTabelle
Meta-elementi
Cornici
Elemento FRAMESET
● Collezione di riquadri● alternativo a BODY● attributi: ROWS, COLS● contiene
– FRAME
– FRAMESET
Elemento FRAME
● Singolo riquadro● Attributi
– SRC
– NAME
Strutture a frame
FRAMESET
FRAME FRAME
Esercizio04-01.html
● Semplice struttura a due frame, sinistra/destra● A sinistra il vostro curriculum● a destra la lista della spesa
Riferimenti tra frame
● Elemento A: l'attributo TARGET● Combinazione con l'attributo NAME● E' utile HREF con
– file.html#ancora
Esercizio04-02.html
● Indice degli esercizi su riquadri● Creare una struttura a riquadri destra/sinistra
– piccolo frame a sx, restante a dx● a sinistra l'elenco degli esercizi svolti● a destra il testo degli esercizi
FRAMESET innestati
FRAMESET
FRAME
FRAME
FRAME
FRAMESET
Altri TARGET
● _BLANK : nuova finestra● _SELF : sostituisce il frame corrente● _PARENT : sostituisce il FRAMESET padre● _TOP : sostituisce tutta la finestra
Esercizio04-03.html● Struttura a riquadri innestati: indice a sx, due
riquadri a dx● dx in alto: esercizi svolti● dx in basso: “glossario” (area di rete)● sx: collegamenti a
– esercizi
– termini del glossario
– nuove finestre (_BLANK)
Tabelle
● Elemento TABLE● Contenuti
– Elemento CAPTION
– Elemento TR
– Elementi TH e TD
Esercizio04-04.html
● Tabella di pezzi musicali● CAPTION● Colonne: Pezzo, autore, genere, epoca, note● Canone di Pachelbel, Variazioni Goldberg,
Magnificat di Bach, Nona di Beethoven, Yesterday, Certe Notti (per esempio!)
Attributi di tabella
● TABLE
– SUMMARY
– BORDER● TD, TH
– ROWSPAN
– COLSPAN
Esercizio04-05.html
● Modificare l'esercizio 04-04● Aggiungere una riga sopra l'intestazione con i
gruppi “generale” e “dettagli”● “generale” raccoglie Titolo e Autore,”dettagli”
tutto il resto● Aggiungere il contorno e inserire un sommario
Commenti
• <!-- ...testo del commento... -->
• Invisibili• Indispensabili!
Metainformazione
• Elemento META
• Attributi principali– NAME– CONTENT
• Nomi ricorrenti:– AUTHOR, DESCRIPTION, GENERATOR,
KEYWORDS
Esercizio05-01.html
• Documentare l'esercizio 04-04 con: Autore, descrizione, generatore, keywords
URL relative
• Nome di un file nella stessa cartella
– “file.html”• Nome di un file in una sottocartella
– “img/immagine.jpg”• Nome di un file nella cartella superiore
– “../file.html”• ... in una sottocartella della cartella superiore
– “../cartella/file.html”
Esercizio05-02
● Creare una struttura di sottocartelle:
– <principale>● belli
– img
● brutti● in belli/Esercizio05-02.html riferirsi a una
immagine in img, e includere in una cornice un file in brutti
Anatomia di una URL
● http:● //www.repubblica.it● /2003-01-01/articoli● editoriale.html● http://www.repubblica.it/2003-01-01/articoli/editoriale.html