HTML 5. Tabelle. Bordi di una tabella. Il tag <TABLE> Le tabelle. Tag fondamentali. Costruzione di tabelle riga per riga. Esempi
|
|
|
- Gioacchino Coppola
- 7 anni fa
- Visualizzazioni
Transcript
1 HTML 5 Tabelle Tag fondamentali Costruzione di tabelle riga per riga Le tabelle Esempi 1 Tecnologie di Sviluppo per il WEB 2 Il tag <TABLE> Una tabella è suddivisa in righe e ciascuna riga è suddivisa in celle. Una tabella deve essere racchiusa tra i tag <TABLE> Ogni riga di una tabella deve essere racchiusa tra i tag Ogni cella di una tabella deve essere racchiusa tra i tag <TD> </TD> Bordi di una tabella Il bordo di una tabella è creato utilizzando l attributo BORDER <TABLE BORDER=1> <TD> cella </TD> Tecnologie di Sviluppo per il WEB 3 Tecnologie di Sviluppo per il WEB 4
2 Titolo di una tabella Si usa il tag <CAPTION> all interno del tag <TABLE> Attributi: TOP: titolo prima della tabella (default) BOTTOM: titolo alla fine della tabella Si possono usare tutti i tipi di tag di markup text-level all interno di <CAPTION> Attributo FRAME di TABLE Specifica quali lati della cornice circostante la tabella saranno visibili. Valori possibili: void: Nessun lato visibile above: Lato superiore visibile below: Lato inferiore visibile hsides: Lato superiore ed inferiore visibili vsides: Lato destro e sinistro visibili lhs: Lato sinistro visibile rhs: Lato destro visibile box, border: Tutti i lati visibili Tecnologie di Sviluppo per il WEB 5 Tecnologie di Sviluppo per il WEB 6 Attributo RULES di TABLE Questo attributo specifica quali filetti 1 appariranno tra le celle in una tabella. Il modo in cui i filetti appaiono dipende dal browser. Possibili valori: none: Nessun filetto. groups: i filetti appariranno solo tra gruppi di righe (THEAD, TFOOT, e TBODY) e gruppi di colonne (COLGROUP e COL) rows: i filetti appariranno solo tra le righe cols: i filetti appariranno solo tra le colonne all: i filetti appariranno tra righe e colonne 1 filetto: sinonimo di linea/riga Relazione tra BORDER e FRAME e RULES Il valore border="0" implica frame="void e, fin quando non specificato diversamente, rules="none" Altri valori di border implicano frame="border" e, fin quando non specificato diversamente, rules="all" esempio Tecnologie di Sviluppo per il WEB 7 Tecnologie di Sviluppo per il WEB 8
3 Il tag <TH> Serve per definire l intestazione di una colonna. Il testo nella cella è centrato e in grassetto. Codice della tabella precedente <HTML> <HEAD> <TITLE> di tabella </TITLE></HEAD> <BODY> <TABLE BORDER> <CAPTION ALIGN=BOTTOM> Una semplice tabella </CAPTION> <TH> Heading 1 </TH> <TH> Heading 2 </TH> <TH> Heading 3 </TH> <TD> item 1 </TD> <TD> item 2 </TD> <TD> item 3 </TD> <TD> item 4 </TD> <TD> item 5 </TD> <TD> item 6 </TD> <TD> item 7 </TD> <TD> item 8 </TD> <TD> item 9 </TD> </BODY> </HTML> Tecnologie di Sviluppo per il WEB 9 Tecnologie di Sviluppo per il WEB 10 Cosa succede con celle vuote? <HTML> <HEAD> <TITLE> Tabella Con Vuoti </TITLE></HEAD> <BODY> <TABLE BORDER> <TD> item 1 </TD> <TD> item 2 </TD> <TD> item 3 </TD> <TD> item 4 </TD> <TD> <TD> <TD> item 7 </TD> <TD> item 8 </TD> </BODY> </HTML> Soluzione Attributi di <TABLE> ALIGN: specifica l allineamento della tabella rispetto alla finestra (deprecato) LEFT, RIGHT, CENTER WIDTH: specifica la larghezza WIDTH= 140 (pixel) WIDTH= 40% (percentuale) HEIGHT: specifica l altezza espressa in pixel o in percentuale Estensione allo standard di IE e N Tecnologie di Sviluppo per il WEB 11 Tecnologie di Sviluppo per il WEB 12
4 <TABLE BORDER=3 WIDTH=100%> <TD>Anna, Giulia, Carla</TD> <TABLE BORDER=3 WIDTH=300 HEIGHT=75> <TD WIDTH=20%> Anna</TD> <TD WIDTH=80%> Giulia</TD> Tecnologie di Sviluppo per il WEB 13 Tecnologie di Sviluppo per il WEB 14 Il valore dell attributo WIDHT viene esteso anche alle righe successive Attributi di <TABLE> CELLPADDING= numero Stabilisce lo spazio tra il contenuto della cella ed i suoi bordi CELLPADDING= 10 CELLSPACING= numero Stabilisce lo spazio tra i bordi delle celle CELLSPACING= 5 Tecnologie di Sviluppo per il WEB 15 Tecnologie di Sviluppo per il WEB 16
5 CELLPADDING e CELLSPACING Questi due attributi controllano lo spazio tra ed all interno delle celle. La figura illustra come essi sono in relazione. di CELLPADDING <TABLE BORDER=3 CELLPADDING=12> <TD >Anna</TD> <TD> Giulia</TD> <TD >Carla</TD> Tecnologie di Sviluppo per il WEB 17 Tecnologie di Sviluppo per il WEB 18 di CELLSPACING <TABLE BORDER=3 CELLSPACING=12> <TD >Anna</TD> <TD> Giulia</TD> <TD >Carla</TD> Combinazione degli attributi <TABLE BORDER=3 CELLSPACING=12 CELLPADDING=12> <TD >Anna</TD> <TD> Giulia</TD> <TD >Carla</TD> Tecnologie di Sviluppo per il WEB 19 Tecnologie di Sviluppo per il WEB 20
6 Tabelle a colori: attributi BGCOLOR="#rrggbb" Definisce il colore di sfondo di tutta la tabella <TABLE BORDER=3 BGCOLOR= #FFCC66 > <TD >Anna</TD> <TD> Giulia</TD> <TD >Carla</TD> Tecnologie di Sviluppo per il WEB 21 Tecnologie di Sviluppo per il WEB 22 Priorità di attributi Il valore di un attributo di una riga <TR ALIGN= LEFT > copre quello di tabella <TABLE ALIGN= RIGHT > Il valore di un attributo di una cella <TD ALIGN= CENTER > copre quello di riga <TR ALIGN= LEFT > Come è normale che sia...i più interni oscurano i più esterni Tecnologie di Sviluppo per il WEB 23 Tabelle a vari colori <TABLE BORDER=3 BGCOLOR= #FF6633 > <TR BGCOLOR= # > <TD BGCOLOR= #9999FF >Anna</TD> <TD> Giulia</TD> <TD >Carla</TD> indovinate i colori... Tecnologie di Sviluppo per il WEB 24
7 Attributi di e <TD> ALIGN= tipo Allineamento orizzontale di una cella LEFT (default), RIGHT, CENTER, JUSTIFY. VALIGN= tipo Allineamento verticale di una cella MIDDLE (default), TOP, BOTTOM, BASELINE (allineata alla base della prima linea) BGCOLOR= #rrggbb Colore di sfondo Attributo NOWRAP Quando è presente, questo attributo booleano indica al browser di disabilitare il wrapping automatico per la cella in esame. L attributo è deprecato. Dovrebbero essere usati i fogli di stile per disabilitare il wrapping automatico Nota: se è usato senza molta cura, questo attributo può generare celle eccessivamente ampie Tecnologie di Sviluppo per il WEB 25 Tecnologie di Sviluppo per il WEB 26 Altri attributi di <TH> e <TD> WIDTH = valore Specifica l ampiezza di una cella Valore espresso in pixel o percentuale HEIGHT = valore Specifica l altezza di una cella Valore espresso in pixel o percentuale COLSPAN e ROWSPAN COLSPAN=numero Controlla il numero di colonne su cui una cella si può estendere. È possibile creare delle celle larghe 2 o più colonne ROWSPAN=numero Definisce il numero di righe su cui incide la casella. Tecnologie di Sviluppo per il WEB 27 Tecnologie di Sviluppo per il WEB 28
8 di COLSPAN <TABLE BORDER=3> <TD COLSPAN=2> Anna</TD> <TD>Giulia</TD> di ROWSPAN <TABLE BORDER=3> <TD ROWSPAN=2>Anna</TD> <TD>Giulia</TD> <TD>Carla</TD> Tecnologie di Sviluppo per il WEB 29 Tecnologie di Sviluppo per il WEB 30 Come creare tabelle con celle unite Per creare il layout di una tabella in cui vi sono celle che si estendono per più righe o colonne, si possono seguire i seguenti passi: Disegnare una bozza della tabella finale Disegnare la struttura a celle (quante righe e colonne occupa la tabella) Confrontare i due disegni per capire quali celle unire Se ci sono celle da unire su una riga (colonne), unirle con una freccia che parte dalla prima cella e prosegue verso destra (il basso) Adesso si può iniziare a creare la tabella tabella finale struttura a celle Tecnologie di Sviluppo per il WEB 31 Tecnologie di Sviluppo per il WEB 32
9 Regole per TD Regola 1 Ogni riga conterrà un TD per ogni cella vuota e per ogni cella che contiene l inizio di una freccia Regola 2 Se un TD contiene l inizio di una freccia verso destra (il basso), allora l attributo COLSPAN (ROWSPAN) assumerà un valore pari al numero di celle, o il numero di colonne (righe) che la freccia attraversa 2 TD 3 TD 2 TD COLSPAN=2 per il secondo TD ROWSPAN=2 per il secondo TD Tecnologie di Sviluppo per il WEB 33 Tecnologie di Sviluppo per il WEB 34 Codice e risultato <TR ALIGN=CENTER> <TD> 1</TD> <TD COLSPAN=2> 2</TD> <TR ALIGN=CENTER> <TD ROWSPAN=2> 3</TD> <TD> 4</TD> <TD> 5</TD> <TR ALIGN=CENTER> <TD> 6</TD> <TD> 7</TD> Tecnologie di Sviluppo per il WEB 35 Errori Se si commettono errori sovrapponendo più celle, il comportamento dei browser non è sempre lo stesso. Esercizio: soluzione Tecnologie di Sviluppo per il WEB 36
10 Raggruppamento di righe Possiamo raggruppare le righe di una tabella in THEAD Intestazione della tabella TFOOT Piè pagina della tabella TBODY Una o più sezioni intermedie Questa divisione permette al browser di supportare lo scrolling delle sezioni intermedie indipendentemente da intestazione e piè pagina della tabella (non supportato) Quando tabelle molto lunghe vengono stampate, le informazioni nell head e nel foot possono essere ripetute su ogni pagina che contiene i dati della tabella (parzialmente supportato solo da Netscape) <TABLE BORDER=1 CELLPADDING=4 RULES="GROUPS"> <THEAD> <TH COLSPAN=2>Table Head <TFOOT ALIGN="CENTER"> <TD COLSPAN=2>Footer <TBODY> <TD>Gruppo 1<TD>Gruppo 1 <TD>Gruppo 1<TD>Gruppo 1 <TBODY> <TD ROWSPAN=2>Gruppo 2<TD>Gruppo 2 <TD>Gruppo 2 <TBODY> <TD COLSPAN=2 ALIGN=CENTER>Gruppo 3 <TD>Gruppo 3<TD>Gruppo 3 Tecnologie di Sviluppo per il WEB 37 Tecnologie di Sviluppo per il WEB 38 Risultato Raggruppamento di colonne COLGROUP Crea esplicitamente un gruppo di colonne in una tabella Attributi principali SPAN indica il numero di colonne comprese in un COLGROUP WIDTH indica l ampiezza di una singola colonna del COLGROUP ALIGN allineamento del contenuto delle colonne VALIGN allineamento verticale del contenuto delle colonne Tecnologie di Sviluppo per il WEB 39 Tecnologie di Sviluppo per il WEB 40
11 Raggruppamento di colonne COL Rappresenta una o più colonne in un gruppo Serve a controllare l aspetto di ogni singola colonna in un gruppo Attributi principali SPAN indica quante colonne successive sono controllate da COL WIDTH, ALIGN, VALIGN <TABLE CELLPADDING=3 RULES="GROUPS"> <COLGROUP> <COL ALIGN="CENTER"> <COL ALIGN="LEFT"> <COL ALIGN="CENTER"> <COLGROUP ALIGN="RIGHT"> <THEAD> <TH> Anno <TH>Nome<TH> Tipo <TH> Costo <TBODY> <TD>1965<TD>Luxury Lace <TD>M <TD>11.75 <TD>1976<TD>Green Flutter <TD>M <TD>7.50 <TD>1984<TD>My Belle <TD>P <TD>12.00 <TD>1985<TD>Stella De Oro <TD>P-G <TD> 5.00 <TD>1989<TD>Brocaded Gown<TD>P <TD>14.50 <TFOOT> <TD COLSPAN=4>M-medio P-piccolo G-grande Tecnologie di Sviluppo per il WEB 41 Tecnologie di Sviluppo per il WEB 42 Risultato Esempi Tabella Allineata Precedente Tecnologie di Sviluppo per il WEB 43 Tecnologie di Sviluppo per il WEB 44
Tabelle. Tag fondamentali. Costruzione di tabelle riga per riga. Esempi. Tecnologie di Sviluppo per il WEB 2
HTML 5 Le tabelle 1 Tabelle Tag fondamentali Costruzione di tabelle riga per riga Esempi Tecnologie di Sviluppo per il WEB 2 Il tag Una tabella è suddivisa in righe e ciascuna riga è suddivisa
HTML 3. I link (collegamenti) L URL. Accesso a documenti locali. Link Mappe Tabelle. <A HREF= path_del_documento > link </A>
Link Mappe Tabelle HTML 3 I link (collegamenti)! Semplicemente "cliccando" su una parola o su un'immagine si può accedere ad un'altra pagina Web! Questo effetto si ottiene con la cosiddetta ancora. Un'ancora
Tabelle HTML. Tabelle Un po di notazione.
Tabelle HTML!! Le tabelle in HTML permettono di rappresentare tabelle di dati ", ma anche di formattare del testo, delle immagini, altre tabelle in righe e colonne, possono cioè essere usate per l impaginazione
APPUNTI DI HTML (QUARTA LEZIONE)
APPUNTI DI HTML (QUARTA LEZIONE) 1. LA STRUTTURA BASE DELLE TABELLE Le tabelle sono una parte estremamente importante del codice HTML. Sono uno strumento indispensabile per gestire i layout grafici. Immaginiamo
Tabelle. Esempio 20. Inserire righe e colonne. Dimensioni delle tabelle. Attributi del tag TABLE INFO WEB LEZIONE N.6
Tabelle INFO WEB LEZIONE N.6 RAVENNA, 2 APRILE 2008 In HTML le tabelle vengono largamente utilizzate per organizzare i dati in tabelle creare il layout della pagina servendosi di tabelle nascoste Si definiscono
Corso di HTML. Prerequisiti. Modulo L2 B4 - Le tabelle. Concetto di tabella Coordinate di cella in una tabella. M. Malatesta B4-Le tabelle-06
Corso di HTML Modulo L2 B4 - Le tabelle 1 Prerequisiti Concetto di tabella Coordinate di cella in una tabella 2 1 Introduzione In questa Unità illustriamo il concetto e l uso delle tabelle in HTML. Le
HTML Lezione3 Le Tabelle. Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
HTML Lezione3 Le Tabelle Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Le Tabelle Non servono soltanto per incolonnare e tabulare i dati come si potrebbe facilmente pensare. Le
Creazione di tabelle.
Creazione di tabelle. Argomenti trattati: - Premessa: Cosa sono le tabelle in HTML. - Costruiamo una tabella: Come realizzare semplici tabelle con i tag principali ed i loro attributi. - Personalizziamo
Tutorial di HTML basato su HTML 4.0 e CSS 2
Claudia Picardi Tutorial di HTML basato su HTML 4.0 e CSS 2 Informatica II per Scienze e Turismo Alpino Docenti: Viviana Patti e Claudia Picardi 4 Tabelle 4.1 La struttura di una tabella Elementi principali
Corso html Lezione 3
Corso html Lezione 3 ELENCHI 3 ELENCHI NUMERICI 3 ELENCHI PUNTATI O NON ORDINATI 6 ELENCHI DI DEFINIZIONE 7 ELENCHI STRUTTURATI 8 TABELLE 12 DEFINIRE UNA TABELLA 12 TITOLO DI UNA TABELLA 16 BORDI 20 DIMENSIONI
Formattazione di liste
Formattazione di liste Con HTML si possono costruire liste puntate o numerate: Occorre definire l inizio e la fine della lista e poi definire ogni singolo elemento della lista. Le liste numerate si costruiscono
Tabella: struttura di base
Tabella: struttura di base Le tabelle sono una delle parti più importanti di tutto il codice HTML: nate sin dagli inizi del Web per impaginare dati aggregati, si sono poi trasformate in uno strumento indispensabile
INTRODUZIONE AL LINGUAGGIO HTML: PARTE 2. Internet + HTML + HTTP = WWW
1 INTRODUZIONE AL LINGUAGGIO HTML: PARTE 2 Internet + HTML + HTTP = WWW Scopo della esercitazione 2 Conoscere i principali tag HTML Realizzare una propria Home Page utilizzando alcuni semplici tag HTML
Progettazione multimediale
Progettazione multimediale Le tabelle 1 Obiettivi Perché si usano le tabelle Le proprietà delle tabelle Inserimento e modifica delle proprietà 2 Perché si usano le tabelle Una pagina Web è formata da testo
Informatica. Comunicazione & DAMS A.A. 2015/16. Dr.ssa Valeria Fionda
Informatica Comunicazione & DAMS A.A. 2015/16 Dr.ssa Valeria Fionda Pagina Web Struttura base pagina Web: (Heading
Le tabelle vengono usate quando hai bisogno di mostrare dei "dati tabulari" cioè informazioni presentate logicamente in righe e colonne.
Le tabelle Le tabelle vengono usate quando hai bisogno di mostrare dei "dati tabulari" cioè informazioni presentate logicamente in righe e colonne. E' difficile? All'inizio costruire le tabelle in HTML
Tabella: struttura di base
Tabella: struttura di base Le Tabelle Nel Linguaggio HTML Le tabelle sono una delle parti più importanti di tutto il codice HTML: nate sin dagli inizi del Web per impaginare dati aggregati, si sono poi
Il linguaggio HTML - Parte 2
Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 2 Dott. Chiara Braghin braghin@dti.unimi.it Elenchi all interno di Un elenco è una sequenza
LEZIONE NO. 3: LE TABELLE DI ATTILIO ABBIEZZI
HTML BASE LEZIONE NO. 3: LE TABELLE DI ATTILIO ABBIEZZI 1 gestire Tabelle La larghezza e l'altezza complessiva di una tabella viene indicata all'interno dell'attributo , il quale appunto
Informatica di base Laboratorio di HTML Dott. Serena Villata A.A. 2004/05
Informatica di base Multid@ms Laboratorio di HTML Dott. Serena Villata A.A. 2004/05 Le tabelle Creazione di una tabella: le tabelle vengono utilizzate sia per inserire dati che per migliorare
Laboratorio di Tecnologie Web HTML: Tabelle Dott. Stefano Burigat
Laboratorio di Tecnologie Web HTML: Tabelle Dott. Stefano Burigat www.dimi.uniud.it/burigat Come usare le tabelle Le tabelle HTML possono essere utilizzate in tutti quei casi in cui sia necessario inserire
non è linguaggio di markup formato testo .htm .html interpretando
HTML Gli ipertesti del web sono scritti usando il linguaggio HyperText Markup Language (HTML). HTML non è un linguaggio di programmazione! HTML non ha meccanismi per prendere delle decisioni o compiere
Tabelle Tabella: struttura di base
06 HTML tabelle Prof. Sabato Dario Pagina 1 di 14 Tabelle Tabella: struttura di base Le tabelle sono componenti importanti in HTML: nate agli inizi del Web per impaginare dati aggregati, si sono poi trasformate
Metodologie Informatiche Applicate al Turismo
Metodologie Informatiche Applicate al Turismo 6. HTML Parte II Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso di Laurea in Scienze
ELENCHI. 1. Prima 2. Seconda 3. terza. Prima Seconda terza
ELENCHI Un elenco è una serie di voci di testo che possono essere contrassegnate da un punto elenco oppure da un numero o da una lettera e volendo anche da un elemento grafico. Si possono avere elenchi
14 attributi per tabelle.html prof. Uccellani pagina 1
1 2 3 attributi per tabelle nelle pagine HTML 4 5 6 attributi per le tabelle 7 8 border
HTML Guida base. Guida grafica essenziale all Hyper Text Markup Language I parte
HTML Guida base Guida grafica essenziale all Hyper Text Markup Language I parte In questa breve guida imparerai come è fatta la struttura della pagina HTML impostare il titolo della pagina impostare lo
Cosa vuol dire HTML? Hyper Text Markup Language
IMPARIAMO Cosa vuol dire HTML? Hyper Text Markup Language PROGRAMMIAMO IN HTML? NO! L'HTML è un linguaggio di formattazione che descrive le modalità di impaginazione o visualizzazione grafica (layout)
Frames. Come organizzare le pagine web usando i frames. Definizione Frame = 1. struttura, armatura, telaio 2. inf. videata, schermata, cornice
Frames Come organizzare le pagine web usando i frames Definizione Frame = 1. struttura, armatura, telaio 2. inf. videata, schermata, cornice Usare i frame Per poter usare i frame è necessario comunicare
Serve per impostare. enfatizza il testo (l effetto è quello del grassetto, comando utile per i motori di ricerca) <ul> comandi relativi all immagine
Comandi principali HTML Serve per impostare il titolo della pagina (nella sezione head) il font del titolo 1 il font del titolo 2 paragrafo una o più parole alle quali applicare
layout senza tabelle Posizionamento con i CSS Ad ogni elemento HTML corrisponde un area rettangolare, detta box Contenuto
Posizionamento con i CSS creare layout senza tabelle 1 Gestione degli elementi della pagina Il box model Ad ogni elemento HTML corrisponde un area rettangolare, detta box Margine Bordo Area di padding
CSS: stili e layout BOX MODEL. Prof.ssa Cristina Gena
CSS: stili e layout BOX MODEL Prof.ssa Cristina Gena Box model In questa lezione vedremo la differenza tra gli elementi blocco e gli elementi in linea e scopriremo le caratteristiche del box model. In
Ogni documento HTML è contraddistinto dai seguenti comandi di base, che ne definiscono la struttura:
COMANDI BASE HTML Ogni documento HTML è contraddistinto dai seguenti comandi di base, che ne definiscono la struttura: Nome del documento All'interno
Principali tipi di layout. Approfondimento sul box model
Principali tipi di layout. Approfondimento sul box model 1 Il layout stabilisce il modo in cui le varie parti (immagini, paragrafi, elenchi, intestazioni ) che compongono un documento ipertestuale devono
II LINGUAGGIO HTML...1
Indice 1 II LINGUAGGIO HTML...1 1.1 INTRODUZIONE AL WWW...1 1.2 IL DOCUMENTO HTML...2 1.2.1 Elementi...3 1.2.2 Attributi...4 1.2.3 Riferimenti a caratteri...4 1.2.4 Commenti...4 1.3 STRUTTURA GLOBALE DI
HTML 3. Liste puntate ed ordinate Immagini
HTML 3 Liste puntate ed ordinate Immagini Creazione di elenchi Elenchi puntati (elenchi non ordinati) Elenchi numerati (elenchi ordinati) Elenchi annidati Elenchi menu Elenchi glossario Tecnologie di Sviluppo
Linguaggio per ipertesti
Linguaggio per ipertesti Un linguaggio per descrivere gli ipertesti è l HyperText Markup Language (HTML) Non è il solo (VRML,XML,...) l HTML è un linguaggio di formattazione e permette di formattare del
Tutorial di HTML basato su HTML 4.0 e CSS 2
Claudia Picardi Tutorial di HTML basato su HTML 4.0 e CSS 2 Informatica II per Scienze e Turismo Alpino Docenti: Viviana Patti e Claudia Picardi Appendice A Riepilogo dei tag HTML A.1 Struttura del documento
Introduzione. Elementi di Informatica. Standard. Struttura dei TAG - 1. Annidamento e Indentazione. Struttura dei TAG - 2
Università degli Studi di Udine Facoltà di Ingegneria CORSO DI LAUREA IN SCIENZE dell ARCHITETTURA Elementi di Informatica HTML e CSS D. Gubiani HTML è l acronimo di HyperText Markup Language che tradotto
Web Programming. testi consigliati. Programma di massima. contacts. Beginning PHP and MySQL - Apress. Beginning Ajax with PHP - Apress
Web Programming Costantino Pistagna pistagna@dmi.unict.it http://aladino.dmi.unict.it testi consigliati Beginning PHP and MySQL - Apress Beginning Ajax with PHP - Apress Beginning Javascript 3rd Edt. -
a cura di Romina Biava HTML IMMAGINI ELENCHI TABELLE LINK FRAME FORM STRUTTURA DI UNA PAGINA HTML
a cura di Romina Biava HTML IMMAGINI ELENCHI TABELLE LINK FRAME FORM STRUTTURA DI UNA PAGINA HTML Le pagine web consistono in una "testa", in inglese head e un "corpo", detto anche body.
CSS 6. Il modello contenitore (box model) Elementi flottanti
CSS 6 Il modello contenitore (box model) Elementi flottanti Il modello contenitore Tecnologie di Sviluppo per il WEB 2 BOX MODEL CSS assume che ogni elemento genera uno o più box rettangolari, chiamati
NOZIONI BASE DI HTML
NOZIONI BASE DI HTML Aggiornato al 06 marzo 2006 Ermes ZANNONI (ermes@zannoni.to.it) (http://www.zannoni.to.it) Indice : 1. Introduzione 2. Tag di default 3. Formattazione del testo 3.1 Dimensione del
Linguaggi di programmazione PC server-client CSS
Linguaggi di programmazione PC server-client CSS HTML MySQL PHP HTML: Hyper Tex Markup Language PHP: Hypertext Preprocessor CSS: Cascading Style Sheet MySQL: Relational database HTML Hyper Tex Markup Language
HTML Tutorial HTML By A.C. Neve 1
HTML Tutorial HTML By A.C. Neve 1 Il linguaggio HTML (Hyper Text Markup Language) è il più diffuso linguaggio per la creazione di pagine WEB. La creazione di un documento HTML si effettua con un qualsiasi
Corso di HTML. Prerequisiti. Modulo L2. B5-I frame. Percentuali Fattore di scala. M. Malatesta B5-I frame-07 09/01/ /01/2014
Corso di HTML Modulo L2 B5-I frame 1 Prerequisiti Percentuali Fattore di scala 2 1 Introduzione In questa Unità illustriamo la possibilità di dividere la pagina in aree indipendenti chiamate frame. I frame
Tipi di testo. Esempio 4. Enfasi. Inserire immagini. Esempio 5 INFO WEB LEZIONE N.4
Tipi di testo INFO WEB LEZIONE N.4 RAVENNA, 13 MARZO 2008 All interno di un documento HTML è possibile inserire due tipi di testo Titoli Sei livelli di grandezza , ,, Paragrafi
Corso di HTML. Prerequisiti. Modulo L3 3 Blocchi di testo
Corso di HTML Modulo L3 3 Blocchi di testo 1 Prerequisiti Formattazione di un testo Struttura a titoli di un testo Giustificazione e allineamento del testo 2 1 Introduzione In questa Unità vediamo altri
Il linguaggio HTML Laboratorio Matematico Informatico 2 Matematica specialistica Pierluigi Amodio
Il linguaggio HTML Laboratorio Matematico Informatico 2 Matematica specialistica Pierluigi Amodio Dipartimento di Matematica Università di Bari Il linguaggio HTML p. 1/3 HTML L HTML è il linguaggio (di
Silvia Likavec. Lezione 6
Silvia Likavec Lezione 6 2 ! Le principali proprietà che permettono di manipolare le immagini agiscono sul box model: " Border (o border-style; border-width; bordercolor); " Padding; " Margin; " Width;
HTML Sesta lezione. 29 Marzo di Ivano Stranieri
HTML 4.01 Sesta lezione 29 Marzo 2004 di Ivano Stranieri 0 Lezione precedente Costruire una tabella Raggruppare righe (e colonne) Unire righe e colonne Attributi di e Come utilizzare
Web. HyperText Markup Language
Web HyperText Markup Language HTML HyperText Markup Language permette la creazione di documenti multimediali ipertestuali è il linguaggio per la creazione di pagine web non è l unico: PHP, JavaScript,
Cl Calendario dl del corso
Cl Calendario dl del corso 12/02/2010 09.00-12.00 Introduzione al mondo WEB Concetti fondamentali e struttura di un sito e delle pagine pg web Gli URL, i link, le immagini I linguaggi HTML e CSS 16/02/2010
Il linguaggio HTML. <html> </html> I documenti HTML vanno racchiusi dentro una coppia di TAG (marcatori): apertura e chiusura.
Il linguaggio HTML I documenti HTML vanno racchiusi dentro una coppia di TAG (marcatori): apertura e chiusura. . I tag devono essere racchiusi dentro parentesi acute Il tag di chiusura
caratteri speciali + form, tabelle e testi
caratteri speciali + form, tabelle e testi Caratteri Speciali I caratteri di un testo che necessitano, per essere rappresentati in HTML, di un sistema di rappresentazione che sia indipendente dal set di
CSS: HTML: Proprietà per la formattazione delle immagini Immagini di sfondo e sfondi multipli. Le immagini mappate
CSS: Proprietà per la formattazione delle immagini Immagini di sfondo e sfondi multipli HTML: Le immagini mappate 1 Le principali proprietà che permettono di manipolare le immagini agiscono sul box mode
Tag <br> : per definire l interruzione di riga (andata a capo)(senza tag di chiusura); sta per break row
TAG FONDAMENTALI Tag : per definire l interruzione di riga (andata a capo)(senza tag di chiusura); sta per break row Tag , tag ,.tag : per definire le intestazioni (i titoli) e la loro
Macchine per l elaborazione dell informazion e. Sistemi di Elaborazione delle Informazioni. Informatica II
Macchine per l elaborazione dell informazion e Sistemi di Elaborazione delle Informazioni Informatica II Ing. Mauro Iacono Seconda Università degli Studi di Napoli Facoltà di Studi Politici e per l Alta
4.5 Formattazione. La finestra è composta dalle schede Numero, Allineamento, Carattere, Bordo, Riempimento e Protezione.
4.5 Formattazione Formattare (cioè dare un formato a ) una cella (o più celle) di Excel significa definirne l aspetto grafico, il tipo di dati che può contenere, il modo in cui appaiono e impostarne o
Selettori. Politecnico di Milano Facoltà del Design Bovisa. Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione
Selettori Facoltà del Design Bovisa Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione cugola@elet.polimi.it http://home.dei.polimi.it/cugola CSS Sintassi valore valore h1 { color: blue;
Elenchi. Con HTML è possibile generare tre tipi di elenco: - a punti (non ordinato) - numerati - di definizioni
Elenchi Con HTML è possibile generare tre tipi di elenco: - a punti (non ordinato) - numerati - di definizioni Gli elenchi possono contenere al loro interno altri elenchi. Tag utilizzati: (unordered
HTML. Es: La prossima parola è in <b>neretto</b> Es: La prossima parola è in neretto
HTML Il linguaggio HTML (HyperText Markup Language) utilizza annotazioni (tag) per descrivere come verrà visualizzato il documento sul browser di un client. L HTML non è un linguaggio di programmazione
Che Cosa è un Ipertesto??
Che Cosa è un Ipertesto?? Con il termine IPERTESTO definiamo un documento la cui struttura di consultazione non è lineare, cioè le parti di cui è logicamente costituito ( capitoli, paragrafi, ) sono organizzati
STILE E CSS. classi sezioni. tag
Perchè occorre lo stile? HTML con i suoi tag e relativi attributi possiede un suo stile standard che offre purtroppo poche personalizzazioni. Un sito web deve avere uniformità di colori, di font e dimensioni
Il linguaggio HTML. Marco Porta - CIM: Web Design & Technologies
Il linguaggio HTML 1 Il linguaggio HTML Origini e caratteristiche dell'html... HTML = Hyper Text Markup Language è un linguaggio di markup, e in quanto tale non richiede alcuna conoscenza della programmazione
Introduzione all HTML
prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA MARIGLIANO (NA) http://www.dinomolli.it info@dinomolli.it Dispense a cura del prof. ing. Dino Molli Introduzione all HTML Introduzione
MODULO 7 HTML HTML. HTLM (Hypertext Markup Language) è un linguaggio per la creazione di documenti ipertestuali e ipermediali
MODULO 7 HTML MODULO 6 - HTML 1 HTML HTLM (Hypertext Markup Language) è un linguaggio per la creazione di documenti ipertestuali e ipermediali Un sistema ipertestuale è un insieme di nodi connessi da collegamenti.
Linguaggio HTML. Elementi di Informatica e Programmazione Università degli Studi di Brescia. Il Linguaggio HTML
Reti Linguaggio HTML 1 Il Linguaggio HTML n HTML = Hypertext Markup Language n Linguaggio di markup di tipo descrittivo (usato per descrivere e formattare documenti ipertestuali) con una sintassi prestabilita
CSS. Esercizi CC BY ALESSANDRO URSOMANDO DIAPOSITIVA 2 CSS PROPRIETÀ
CSS Esercizi CSS PROPRIETÀ DIAPOSITIVA 2 Corredare l esercizio precedentemente realizzato di un file.css che presenti delle dichiarazioni per impostare: l ampiezza del body a 800 pixel a giallo chiaro
HTML Lezione2 Le Immagini e i link. Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
HTML Lezione2 Le Immagini e i link Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Le immagini I formati supportati dal websono diversi e variano a seconda del browser adoperato.i
Siti molto ben fatti /1 08
Siti molto ben fatti /1 08 1) Mettiamoci a cucinare Crea la cartella 30 ricette con le sottocartelle css e img. L'obiettivo è di realizzare un sito come questo rappresentato in figura. Cominciamo con l'operare
(b) - Creazione del layout delle pagine nella vista Layout
(b) - Creazione del layout delle pagine nella vista Layout La vista Layout di Dreamweaver semplifica l utilizzo delle tabelle per il layout delle pagine. Nella vista Layout, è possibile progettare le pagine
Laboratorio Digitale 1
Informatica Corso di PROGRAMMAZIONE Applicata ai Beni IN Culturali RETE Laboratorio Digitale 1 Corso di Laboratorio Digitale 1 Corso di laurea comunicazione e DAMS Laurea Specialistica - Media Education
Metodologie Informatiche Applicate al Turismo
Metodologie Informatiche Applicate al Turismo 9. HTML Parte II Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso di Laurea in Scienze
Il linguaggio HTML - Parte 5
Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Parte 5 Dott. Chiara Braghin braghin@dti.unimi.it Frame I frame (cornici) permettono di suddividere la finestra
Come creare una tabella responsive
Come creare una tabella responsive martedì, 26 dicembre 2017 Uno degli elementi HTML più difficili da trattare quando si passa dalla visualizzazione desktop a quella mobile è senz'altro la tabella. Si
HTML. Es: La prossima parola è in <b>neretto</b> Es: La prossima parola è in neretto
HTML Il linguaggio HTML (HyperText Markup Language) utilizza annotazioni (tag) per descrivere come verrà visualizzato il documento sul browser di un client. HTML non è un linguaggio di programmazione ma
Comandi principali del linguaggio HTML (Hyper Text Markup Language)
Comandi principali del linguaggio HTML (Hyper Text Markup Language) Caratteristiche di HTML HTML è un linguaggio di formattazione (markup) di documenti ed è il linguaggio base per produrre documenti per
Cascading Style Sheet CSS. Sintassi Css. Come inserire un foglio di stile. Fogli di stile esterni. Separazione contenuto/layout
Cascading Style Sheet CSS CASCADING STYLE SHEET I fogli di stile a cascata (detti anche semplicemente fogli di stile) vengono usati per definire la rappresentazione di documenti HTML, XHTML e XML. L'introduzione
Elenchi, link, immagini e tabelle Elementi per costruire liste, collegamenti, inserire immagini e tabelle
Elenchi, link, immagini e tabelle Elementi per costruire liste, collegamenti, inserire immagini e tabelle Sviluppo di siti web UD07 Fablab Design Gli elenchi dell HTML Se abbiamo la necessità di inserire
Corso di PROGRAMMAZIONE IN RETE
Corso di PROGRAMMAZIONE IN RETE Laurea Specialistica - Media Education Dr. Annamaria Bria 1 1 Dipartimento di Matematica Università della Calabria Riferimenti MANUALE http://www.w3.org/tr/1999/rec-html401-19991224/
HTML Guida di riferimento
Dipartimento di Elettronica ed Informazione Politecnico di Milano Informatica A - GES Prof. Plebani A.A. 2006/2007 HTML Guida di riferimento La presente dispensa e da utilizzarsi ai soli fini didattici
LEZIONI DI HTML. Come costruire il proprio sito con pochi strumenti e tanta creatività...
LEZIONI DI HTML Come costruire il proprio sito con pochi strumenti e tanta creatività... FORMATTARE IL CARATTERE Per formattare titoli interni del documento web possiamo utilizzare i tag , ,...,
Cimini Simonelli - Testa
WWW.ICTIME.ORG HTML Manuale introduttivo al linguaggio HTML Cimini Simonelli - Testa v.2-11/01/2008 Sommario Introduzione... 3 Formattazione della pagina... 4 Inserire un colore di sfondo... 4 Inserire
Il linguaggio html. HyperText Markup Language (Linguaggio di contrassegno di ipertesti) Creato al CERN nel 1989 e reso pubblico nel 1991.
Il linguaggio HTML Il linguaggio html HyperText Markup Language (Linguaggio di contrassegno di ipertesti) Creato al CERN nel 1989 e reso pubblico nel 1991. Il linguaggio html NON è un linguaggio di programmazione.
APPUNTI DI INFORMATICA IL LINGUAGGIO HTML
APPUNTI DI INFORMATICA IL LINGUAGGIO HTML Vediamo le seguenti istruzioni dell HTML link permette di dare un colore alla nostra "parola calda", se questo attributo non viene esplicitato
Linguaggio per ipertesti
Linguaggio per ipertesti Un linguaggio per descrivere gli ipertesti è l HyperText Markup Language (HTML) Non è il solo (VRML,XML,...) l HTML è un linguaggio di formattazione e permette di formattare del
Elementi blocco e Elementi in linea
Elementi blocco e Elementi in linea Sostanzialmente il box model di una pagina Internet basata su markup (x)html è composto da due tipologie di elementi: gli inline elements e i block-level elements. Rientrano
HTML HyperText Markup Language: Linguaggio utilizzato per creare pagine Web. R. C. Esposito 1
HTML HyperText Markup Language: Linguaggio utilizzato per creare pagine Web R. C. Esposito 1 Introduzione HTML è l'acronimo di HyperText Markup Language HTML e il linguaggio standard per descrivere e definire
Tutorial di HTML basato su HTML 4.0 e CSS 2
Claudia Picardi Tutorial di HTML basato su HTML 4.0 e CSS 2 Informatica II per Scienze e Turismo Alpino Docenti: Viviana Patti e Claudia Picardi 5 Frame 5.1 Cosa sono i Frame e come si specificano icano
Esistono editor WYSIWYG (What You See Is What You Get) (FrontPage)
HTML significa Hyper Text Markup Language I documenti HTML sono file plain-text che possono essere creati usando un qualsiasi text editor e possono essere visualizzati con browsers Web. Il documento HTML
Informatica di Base Laboratorio di HTML Dott. Serena Villata A.A. 2004/05
Informatica di Base Multid@ms Laboratorio di HTML Dott. Serena Villata A.A. 2004/05 1 Che cos è l HTML? Hyper Text Markup Language Definisce le caratteristiche stilistiche di un documento, non è programmazione!
EUROPEAN COMPUTER DRIVING LICENCE SYLLABUS VERSIONE 5.0
Pagina I EUROPEAN COMPUTER DRIVING LICENCE SYLLABUS VERSIONE 5.0 Modulo 4 Foglio elettronico Il seguente Syllabus è relativo al Modulo 4, Foglio elettronico, e fornisce i fondamenti per il test di tipo
Sommario. HTML e CSS I fogli di stile. cosa sono principali proprietà
HTML e CSS Sommario HTML e CSS I fogli di stile cosa sono principali proprietà CSS CSS La specifica HTML elenca le linee guida su come i browser dovrebbero visualizzare i diversi elementi del documento