Laboratorio di Tecnologie Web CSS: Introduzione Dott. Stefano Burigat
|
|
|
- Martina Masi
- 6 anni fa
- Visualizzazioni
Transcript
1 Laboratorio di Tecnologie Web CSS: Introduzione Dott. Stefano Burigat
2 Cascading Style Sheets (CSS) è uno standard W3C che definisce gli aspetti di presentazione dei documenti HTML. L'utilizzo di CSS permette un controllo preciso del layout e dell'aspetto grafico di un documento, permette di modificare la presentazione di un intero sito senza modificarne minimamente il contenuto, rende più semplice la creazione di siti accessibili (perchè il codice HTML non viene sporcato da elementi presentazionali estranei), ha un ottimo livello di supporto da parte dei browser. La versione più recente di CSS è la 3 (CSS3) e, al contrario delle versioni precedenti, è suddivisa in moduli, ciascuno dei quali dedicato ad una specifica funzionalità. Alcuni moduli hanno raggiunto un buon livello di standardizzazione mentre altri sono ancora sperimentali. Come per HTML5, il livello di compatibilità dei browser con CSS3 è variabile ed è quindi necessario fare attenzione alle funzionalità che si utilizzano, cercando di evitare quelle che non consentono di mantenere compatibilità all'indietro con le versioni precedenti di CSS, in particolare CSS2.1. Regole di stile La sintassi utilizzata da CSS è diversa da quella HTML. Un foglio di stile CSS è costituito da una o più regole di stile che descrivono come dovrebbero essere visualizzati un elemento o un gruppo di elementi HTML. Ogni regola seleziona un elemento e dichiara come questo deve essere presentato. Il seguente frammento di codice CSS mostra due regole di stile: la prima definisce il colore del testo per l'elemento <h1>; la seconda definisce dimensione e tipo di
3 font utilizzati per l'elemento <p>. h1 { color: green; } p { font-size: small; font-family: sans-serif; } Nella terminologia CSS, i due componenti principali di una regola sono il selettore, che definisce a cosa si applica la regola, e la dichiarazione, che specifica le istruzioni da applicare. Una dichiarazione è a sua volta suddivisa in una proprietà (ad esempio color nella prima regola dell'esempio sopra) ed un valore ( green nella prima regola dell'esempio sopra), separati da due punti ed uno spazio. I possibili valori dipendono dalla specifica proprietà considerata. Ci possono essere una o più dichiarazioni per ogni regola ed il blocco di dichiarazioni viene racchiuso da parentesi graffe. Ogni dichiarazione deve essere separata dalla successiva tramite un punto e virgola (l'ultimo è opzionale ma è preferibile inserirlo). Nell'esempio precedente, il selettore specifica il nome di un elemento e la relativa regola viene applicata a tutte le istanze di quell'elemento all'interno del documento a cui viene associato il foglio di stile. Come vedremo in seguito, CSS supporta anche selettori più sofisticati.
4 Applicazione dello stile Ci sono tre modi per applicare informazione di stile ad un documento HTML: Fogli di stile esterni. Le regole di stile vengono incluse in un file di testo con estensione.css e importate nel documento HTML tramite l'elemento vuoto <link> oppure la Il metodo più comune è l'utilizzo dell'elemento <link> all'interno dell'elemento <head>. In tal caso, è necessario specificare i due attributi rel (tipo di documento a cui si sta facendo riferimento; assume valore stylesheet per i fogli di stile) e href (path del documento), come nell'esempio seguente. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <link rel="stylesheet" href="css/stile.css" /> </head> <body> <p>a questo paragrafo vengono applicate <em>regole distile</em> in cascata.</p> </body> </html> Prima di HTML5 era anche necessario inserire l'attributo type con valore text/css. E' possibile inserire più elementi link per fare riferimento a più fogli di stile per lo stesso documento. Il secondo metodo per applicare un foglio di stile esterno è utilizzare la all'inizio di un elemento <style> (questo elemento viene utilizzato per
5 definire fogli di stile embedded come spiegato nel punto seguente; in tal caso le regole di stile devono essere inserite successivamente alla La definisce il path a cui trovare il foglio di stile esterno. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> url("css/stile.css"); </style> </head> <body> <p>a questo paragrafo vengono applicate <em>regole di stile</em> in cascata.</p> </body> </html> Come per il metodo basato su <link> si possono importare più fogli di stile anche La può anche essere utilizzata all'interno di un foglio di stile esterno. Il vantaggio di utilizzare fogli di stile esterni è che è possibile applicare lo stesso foglio di stile a più documenti HTML. Fogli di stile embedded. Le regole di stile vengono incluse nel documento HTML tramite utilizzo dell'elemento <style>, inserito comunemente all'interno di <head> (HTML5 consente di includerlo all'interno di <body>). E' possibile utilizzare l'attributo type per specificare il tipo di foglio di stile (non necessario in HTML5). Le regole specificate in questo modo si
6 applicano solamente al documento in cui sono incluse. Il seguente esempio di foglio di stile embedded mostra anche la sintassi da utilizzare per inserire commenti all'interno di un foglio di stile. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <style type="text/css"> /* Qui vengono inserite le regole */ p { color: red; font-family: sans-serif; } </style> </head> <body> <p>a questo paragrafo vengono applicate regole di stile definite in modo embedded.</p> </body> </html> Regole di stile inline. E' possibile applicare regole di stile a singoli elementi all'interno di un documento HTML mediante l'utilizzo dell'attributo style. Più regole possono essere incluse separate tramite punto e virgola. <p style="color: red; font-family: sans-serif;"> A questo paragrafo vengono applicate regole di stile definite in modo inline.</p> Questo tipo di soluzione dovrebbe essere evitata a meno che non sia assolutamente necessario per sovrascrivere una regola importata tramite i metodi precedenti.
7 Concetti fondamentali Ereditarietà Un primo concetto fondamentale relativo a CSS è che gli elementi HTML ereditano alcune regole di stile degli elementi nei quali sono contenuti. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <style type="text/css"> p { color: red; font-family: sans-serif; } </style> </head> <body> <p>a questo paragrafo vengono applicate <em>regole di stile</em> definite in modo embedded.</p> </body> </html> Nell'esempio precedente, all'elemento <em> viene applicato lo stesso stile dell'elemento <p> nel quale è contenuto (oltre allo specifico stile di default). Se l'elemento <p> fosse contenuto all'interno di un altro elemento a cui viene applicato uno stile relativo al testo, quello stile verrebbe ereditato sia da <p> che da <em>, e così via. Per poter capire quali regole di stile vengono applicate ad un elemento è quindi fondamentale tenere in considerazione la gerarchia degli elementi all'interno del documento html. Bisogna comunque considerare che non tutte le proprietà
8 sono supportate da tutti gli elementi. Ad esempio, un elemento <img> inserito all'interno del paragrafo dell'esempio precedente non erediterebbe le regole del paragrafo in quanto quelle specifiche regole (relative al font) non si applicano alle immagini. Inoltre, ci sono proprietà che normalmente non vengono ereditate come, ad esempio, quelle relative a margini, bordi, o background. L'ereditarietà può essere sfruttata per semplificare i fogli di stile. Ad esempio, se si vuole applicare un certo font a tutti gli elementi testuali di un documento, non serve aggiungere una regola per ogni elemento ma basta inserire la regola per l'elemento <body> in modo tale che venga ereditata da tutti gli elementi testuali racchiusi in <body>. Una regola ereditata può essere ridefinita in uno specifico elemento in modo da applicare uno stile diverso a quell'elemento, come nell'esempio seguente. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <style type="text/css"> p { color: red; font-family: sans-serif; } em { color: blue; } </style> </head> <body> <p>a questo paragrafo vengono applicate <em>regole di stile</em> definite in modo embedded.</p> </body> </html>
9 Conflitti di stile Quando si applica informazione di stile ad un documento, possono presentarsi conflitti tra le regole. Questo può accadere perchè CSS consente di applicare più fogli di stile allo stesso documento o perchè sono state definite regole conflittuali all'interno di uno stesso foglio di stile. I conflitti tra fogli di stile possono essere risolti grazie al fatto che esiste una gerarchia delle diverse sorgenti di informazione di stile. In particolare, le regole definite ad un livello della gerarchia vengono passate anche ai livelli seguenti (da cui il termine cascading in CSS). Se viene incontrata ad un livello una regola già definita ad un livello precedente, la regola precedente viene sostituita da quella corrente (in pratica, più si scende nella gerarchia più il peso delle regole aumenta). Il risultato è un foglio di stile che combina (con eventuali ridefinizioni in caso di conflitto) le regole incluse nei diversi fogli di stile applicati ad un documento. La gerarchia considerata da CSS è la seguente: Foglio di stile di default del browser Foglio di stile dell'utente (tutti i browser permettono di creare un CSS che sostituisce il foglio di stile di default) Foglio di stile esterno aggiunto tramite elemento <link> Foglio di stile esterno importato tramite Foglio di stile embedded tramite elemento <style>
10 Informazione di stile inline (attributo style ) Regole di stile marcate dall'autore con l'indicatore!important Regole di stile marcate dall'utente con l'indicatore!important Nell'esempio seguente vengono applicate in cascata delle regole embedded e delle regole inline. Come si vede, le regole inline hanno la precedenza su quelle embedded. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <style type="text/css"> p { color: red; font-family: sans-serif; } </style> </head> <body> <p style="color: black">a questo paragrafo vengono applicate regole di stile in cascata.</p> </body> </html> Nell'esempio seguente viene utilizzato l'indicatore!important per dare peso maggiore alla regola embedded relativa alla proprietà color. <!DOCTYPE html> <html> <head> <title>tecnologie web</title> <style type="text/css">
11 p { color: red!important; font-family: sans-serif; } </style> </head> <body> <p style="color: black">a questo paragrafo vengono applicate regole di stile in cascata.</p> </body> </html> Nel caso in cui ci siano più fogli di stile esterni (quindi allo stesso livello) che entrano in conflitto tra loro, vince il foglio che viene inserito per ultimo nel codice. Oltre ai conflitti dovuti alla presenza di sorgenti di stile diverse, ci possono essere conflitti anche all'interno di uno stesso foglio di stile. Questi possono essere dovuti alla presenza di selettori diversi per lo stesso elemento, più versioni dello stesso selettore con regole differenti per la stessa proprietà, regole differenti per la stessa proprietà all'interno dello stesso selettore. Nel primo caso, vince il selettore più specifico (finora abbiamo visto un solo tipo di selettore, quello più generico che indica il nome di un elemento). Nel secondo e terzo caso, vince la regola che appare per ultima. Nei due frammenti di codice seguenti, ad esempio, la regola vincente è quella che assegna il colore green alla proprietà color. <style> p { color: red; } p { color: blue; } p { color: green; }
12 </style> <style> p { color: red; color: blue; color: green; } </style> Box model Un altro concetto generale di CSS, alla base del sistema di formattazione visuale del contenuto, è il cosiddetto box model. Ogni browser vede ogni elemento html di una pagina (sia esso di tipo blocco che di tipo inline) come racchiuso all'interno di un box rettangolare. Tramite CSS è possibile definire proprietà di questi box come i bordi, i margini, il background ed altre, oltre a poterne definire il posizionamento sulla pagina web. L'esempio seguente evidenzia i diversi box tramite utilizzo della proprietà border dei diversi elementi. Notate come i box relativi agli elementi blocco occupino la pagina per tutta la sua larghezza mentre i box per gli elementi inline racchiudono solo il contenuto dell'elemento. <!DOCTYPE html> <html> <head> <title> Tecnologie web </title> <style type="text/css"> h1, h2, p, em, img { border: 1px solid blue; } </style> </head>
13 <body> <article> <h1>documentazione su Java</h1> <section> <h2>introduzione al linguaggio</h2> <p>uno dei principi fondamentali del linguaggio Java è espresso dal motto <em>write once, run anywhere</em>...</p> <figure><img src="../imgs/java.jpg" alt=""/></figure> </section> <section> <h2>storia</h2> <p>java è stato creato a partire da ricerche effettuate alla Stanford University agli inizi degli anni Novanta...</p> </section> </article> </body> </html> L'esempio precedente evidenzia anche un modo compatto per definire le stesse regole per elementi diversi: è sufficiente raggruppare i selettori, separati da virgole, e definire un solo blocco di dichiarazioni. Tipi principali di selettore In tutti gli esempi precedenti, abbiamo utilizzato il nome degli elementi html come selettori. Lo svantaggio di selezionare elementi in questo modo è che le regole specificate vengono applicate a tutti gli elementi di quel tipo nella pagina. Se vogliamo applicare regole in modo più specifico, dobbiamo utilizzare altri tipi di selettore.
14 Selettori di discendenti Un selettore di discendente specifica elementi che sono contenuti in (e quindi sono discendenti di) altri elementi. Per definire un selettore di discendente si indica l'elemento contenitore seguito dall'elemento discendente, separati da uno spazio. Nell'esempio seguente, specifichiamo un selettore di discendente per gli elementi <em> contenuti all'interno di elementi <p>. Notate che abbiamo anche specificato un selettore generico per l'elemento <em> ma che la regola che viene applicata è quella del selettore più specifico. <!DOCTYPE html> <html> <head> <title> Tecnologie web </title> <style type="text/css"> em { color: red; } p em { color: blue; } </style> </head> <body> <article> <h1>documentazione su <em>java</em></h1> <section> <h2>introduzione al linguaggio</h2> <p>uno dei principi fondamentali del linguaggio Java è espresso dal motto <em>write once, run anywhere</em>...</p> <figure><img src="../imgs/java.jpg" alt=""/></figure> </section> </article> </body> </html>
15 E' anche possibile avere livelli di innestamento multipli. La regola seguente, ad esempio, si applica agli elementi <em> contenuti all'interno di elementi <a> contenuti in liste non ordinate <ol>. ol a em { color: gray; } Selettori di figli Nella definizione di selettori di discendenti vista in precedenza, non è impostante che l'elemento contenitore sia il padre dell'elemento di cui vogliamo specificare le regole di stile, è sufficiente che sia un suo antenato. Se vogliamo invece specificare regole che valgono per i figli diretti di uno specifico elemento, dobbiamo utilizzare i selettori di figli che vengono specificati separando padre e figlio con un simbolo di maggiore, come nell'esempio seguente. p > em { color: yellow; } La regola sopra definita si applicherà agli elementi <em> che sono direttamente contenuti all'interno di elementi <p> ma non ad elementi <em> contenuti all'interno di altri elementi anche se questi ultimi sono contenuti all'interno di elementi <p>. Selettori di fratelli adiacenti Un selettore di fratelli adiacenti identifica un elemento che appare nel codice immediatamente dopo un altro elemento all'interno dello stesso padre. I due elementi vengono separati dal simbolo +. La regola seguente si applica ad
16 esempio a paragrafi <p> che seguono immediatamente un elemento <h1>. h1 + p { color: red; } Selettori di fratelli generici Un selettore di fratello generico identifica un elemento che appare successivamente ad un altro elemento all'interno dello stesso padre. Questo tipo di selettore è stato introdotto in CSS3. L'esempio seguente si applica ad elementi <h2> che appaiono dopo elementi <h1> (ma non necessariamente subito dopo) all'interno dello stesso padre. h1 ~ h2 { color: red; } Selettori di id Abbiamo visto in precedenza come l'attributo id possa essere utilizzato per assegnare un identificatore univoco ad un qualsiasi elemento html. Un selettore di id consente di creare regole di stile per un elemento identificato da uno specifico id. Per creare un tale selettore, è sufficiente unire il nome dell'elemento al valore dell'attributo id tramite l'utilizzo del simbolo #. Nell'esempio seguente viene creata una regola di stile per un elemento <p> con id par12. p#par12 { color: red; } Dato che gli dovrebbero essere unici, è anche possibile tralasciare il nome dell'elemento scrivendo solo il valore dell'id preceduto dal simbolo #.
17 Un selettore di id può essere utilizzato anche come parte di un selettore contestuale (uno qualsiasi dei selettori visti nelle precedenti 4 sezioni). Il frammento seguente, ad esempio, definisce una regola per tutti gli elementi <em> contenuti all'interno del paragrafo con id par12. #par12 em { color: red; } Selettori di classe Oltre ad identificare un elemento tramite id, abbiamo visto in precedenza che l'attributo class può essere utilizzato per classificare un certo elemento come appartenente ad un gruppo. A differenza di id, più elementi possono appartenere allo stesso gruppo ed un elemento può appartenere a più gruppi. Un selettore di classe permette di specificare regole di stile per gli elementi appartenenti ad una specifica classe. In modo simile ai selettori di id, è possibile creare un selettore di classe unendo il nome dell'elemento al valore dell'attributo class tramite l'utilizzo di un punto. Nell'esempio seguente viene creata una regola di stile per tutti gli elementi <p> con attributo class di valore intro. p.intro { color: red; } Se vogliamo applicare una regola a tutti gli elementi di una certa classe (indipendentemente dal loro tipo), è sufficiente indicare solo il nome della classe preceduta dal punto, come nell'esempio seguente..intro { color: red; }
18 Conflitti di stile tra selettori Abbiamo visto in precedenza come risolvere conflitti di stile nel caso di sorgenti di stile diverse o nel caso di più versioni dello stesso selettore. Nel caso di conflitti tra selettori diversi all'interno dello stesso foglio di stile esistono delle regole di precedenza (in realtà abbastanza complicate, si veda che possono essere riassunte in modo semplificato come segue: I selettori di id sono più specifici e sovrascrivono i selettori di classe, che sono più specifici e sovrascrivono i selettori contestuali, che sono più specifici e sovrascrivono i selettori di elemento. Quindi, nel seguente esempio, il selettore contestuale di discendente ha la precedenza sul selettore di elemento ed il testo dell'elemento <em> all'interno dei paragrafi comparirà in colore verde. em { color: red; } p em { color: green; } Nell'esempio seguente, gli elementi <em> di classe nero verranno visualizzati con colore nero anche quando compaiono all'interno di paragrafi, poiché i selettori di classe hanno la precedenza sugli altri due selettori
19 specificati. em { color: red; } p em { color: green; } em.nero { color: black; } Altri selettori Oltre a quelli descritti in precedenza, esistono altri tipi di selettore che vengono utilizzati in casi particolari. Nelle sezioni seguenti, vedremo i più comuni mentre all'indirizzo potete trovare l'elenco completo. Selettori di pseudo-classe Durante la navigazione dei siti web, il browser tiene traccia di alcuni stati nei quali si possono trovare gli elementi. Ad esempio, viene tenuta traccia del fatto che un link sia stato cliccato oppure no. Tutti gli elementi che si trovano nello stesso stato fanno parte della stessa classe ma tali classi non sono definite esplicitamente nel codice, da cui il nome pseudo-classi. E' comunque possibile andare a modificare lo stile degli elementi che si trovano in una particolare pseudo-classe attraverso un tipo di particolare di selettore che dipende dal nome dello stato che si sta considerando. I selettori di pseudo-classe più utilizzati sono quelli relativi ai link (elementi <a>). In particolare, è possibile identificare tutti i link che non sono ancora stati cliccati e tutti i link che sono già stati visitati. Ciò può avvenire utilizzando i selettori :link e :visited come nell'esempio seguente.
20 a:link { color: maroon; } a:visited { color: gray; } Inoltre, si possono utilizzare i selettori :focus, :hover e :active per indicare rispettivamente elementi (non solo link) che sono in uno stato selezionato (hanno il focus come ad esempio un campo di testo su cui l'utente sta scrivendo), su cui è posizionato il puntatore del mouse, o che sono in procinto di essere attivati. a:hover { color: gray; } a:active { color: red; } Quando vengono applicati degli stili ai link utilizzando questi selettori, il loro ordine nei fogli di stile è importante e DEVE essere :link, :visited, :focus, :hover, :active. CSS3 definisce diversi altri selettori di pseudo-classe, la maggior parte dei quali consentono la selezione di elementi in base a dove tali elementi sono posizionati all'interno della struttura di un documento. Un elenco completo con esempi è disponibile al seguente link: /#pseudo-classes. Tenete anche presente che è possibile combinare tra loro le diverse categorie di selettori per ottenere risultati come applicare uno stile ai link visitati di una particolare classe. a.mainmenu:visited { color: gray; }
21 Selettori di attributo I selettori di attributo permettono di selezionare degli elementi in base ai loro attributi. E' possibile sia effettuare selezioni in base al nome degli attributi che in base al valore degli attributi. Il selettore di attributo semplice permette di selezionare elementi in base al nome di un attributo. Ad esempio, la regola seguente si applica agli elementi <img> che hanno definito l'attributo title. img[title] {border: 3px solid;} Il selettore di attributo con valore esatto seleziona elementi in base ad uno specifico valore di un attributo. Ad esempio, la regola seguente si applica agli elementi <img> che hanno definito l'attributo title con valore Logo (la selezione è case-sensitive). img[title= Logo ] {border: 3px solid;} Ci sono diversi altri selettori di attributo più specifici per situazioni in cui si vuole ad esempio selezionare elementi in base a parte del valore di un attributo. Si veda /#attribute-selectors per un elenco completo. Selettore universale Il selettore universale, identificato dal simbolo di asterisco (*) permette di selezionare qualsiasi elemento nel contesto specificato. Ad esempio, la regola seguente rende di colore
22 grigio tutti gli elementi in foreground di un documento. * { color: gray; }
Sistemi Di Elaborazione Dell informazione
Sistemi Di Elaborazione Dell informazione Dott. Antonio Calanducci Lezione XV: Cenni su CSS Corso di Laurea in Scienze della Comunicazione Anno accademico 2009/2010 Fogli di stile (CSS) Cascade Style Sheets
INSERIMENTO. Un foglio di stile può essere esterno e interno: Un foglio esterno si carica: Un foglio interno può essere compilato
CSS I FOGLI DI STILE HTML serve informare il browser di quali sono le componenti necessarie a mostrare un documento e ad articolare il documento in blocchi semantici. I fogli di stile (Cascading Style
Web Design. Media Dream Academy. Stefano Gaborin
Web Design Media Dream Academy Stefano Gaborin stefano.gaborin@above.company www.above.company I Fogli di stile: CSS CSS è l acronimo di Cascading Style Sheets, ovvero fogli di stile a cascata. Il CSS
Introduzione ai Fogli di stile. Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni
Introduzione ai Fogli di stile Prof. Accarino IIS Altiero Spinelli Via Leopardi 132 Sesto San Giovanni Fogli di Stile CSS Il CSS (Cascading Style Sheets o Fogli di stile) è un linguaggio usato per definire
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
Appunti sui fogli di stile
Appunti sui fogli di stile CSS ( Cascading Style Sheets): Linguaggi di formattazione stilistica e strutturale di un documento HTML o di una serie di documenti in cascata. Può aggiornare lo stile di un
Linguaggi per il Web Linguaggi di markup: CSS
Linguaggi per il Web Linguaggi di markup: CSS Fogli di stile (CSS) Cascading Style Sheets (CSS) servono per facilitare la creazione di pagine HTML con un aspetto uniforme permettono di separare il contenuto
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
CSS. Politecnico di Milano Facoltà del Design Bovisa. Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione
CSS Politecnico di Facoltà del Design Bovisa Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione cugola@elet.polimi.it http://home.dei.polimi.it/cugola I cascading style sheet I CSS permettono
Tecnologie di Sviluppo per il Web
Tecnologie di Sviluppo per il Web Cascading Style Sheets (CSS): Dettagli e Approfondimenti versione 1.2 G. Mecca mecca@unibas.it Università della Basilicata CSS >> Sommario Dettagli e Approfondimenti Sintassi
CSS (Cascading Style Sheets)
Foglio di stile CSS (Cascading Style Sheets) Regole che dicono al browser COME visualizzare le informazioni contenute nel documento HTML. Definiscono l APPARENZA del documento. Vedi http://www.w3schools.com/css/demo_default.htm
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
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
I FOGLI DI STILE CSS (CASCADING STYLE SHEETS)
I FOGLI DI STILE CSS (CASCADING STYLE SHEETS) Gli stili rappresentano un metodo per definire come il browser debba visualizzare i tag HTML. Il loro vantaggio è che possono essere utilizzati a differenti
Fogli di stile a cascata (CSS)
Fogli di stile a cascata (CSS) November 25, 2010 1 Definizione I fogli di stile a cascata (Cascading Style Sheets, CSS) sono una delle tecnologie introdotte dal W3C per la formattazione dei documenti HTML,
<!-- TESTO DEL COMMENTO
Il corpo della pagina: il tag Come abbiamo già avuto modo di osservare, il tag definisce ed identifica il corpo della pagina, cioè la "porzione visibile" di un qualsiasi documento HTML. Avendo
Guida alla modifica di un layout
Guida alla modifica di un layout Abbiamo realizzato il sito web di Hexagon Tours utilizzando HTML e CSS, impostando una struttura formata da header, barra di navigazione, contenuti principali e laterali,
WEB I FOGLI DI STILE. Gabriele Murara
WEB I FOGLI DI STILE Gabriele Murara 1 Cosa sono e a cosa servono HTML dovrebbe essere visto semplicemente come un linguaggio strutturale, alieno da qualunque scopo attinente la presentazione di un documento
Riassunto CSS Tutorial Colori e sfondi
Proprietà Esempio Descrizione color background-color background-image background-repeat background-attachment background-position h1 { color: #ff0000; body { background-color: #FFCC66; body { background-image:
IMMAGINI INTRODUZIONE
IMMAGINI INTRODUZIONE Prima di inserire le immagini nella pagina HTML, le stesse devono essere copiate all interno della cartella del progetto (Sito). La loro copia può avvenire o tramite Risorse del Computer
Riassunto CSS Tutorial
Colori e sfondi color background-color h1 { color: #ff0000; body { background-color: #FFCC66; Riassunto CSS Tutorial Per uno sfondo trasparente: body { background-color: transparent; background-image background-repeat
APPLICAZIONI WEB E INTRANET CON PHP
APPLICAZIONI WEB E INTRANET CON PHP Novembre 2005 Dott. Ing. Bianchini Stefano CSS Concetti di base Cascatine Syle Sheets (CSS) è uno degli standard del W3C che consentono di controllare l aspetto visivo
<tag style= dichiarazioni css >
CSS 1. FOGLI DI STILE Per permettere di separare la forma dal contenuto, si usano i Fogli di Stile. Essi descrivono dettagliatamente lo stile di ogni elemento contenuto nel foglio html. I nomi dei fogli
ELEMENTI GENERICI. Programmazione Web 1
ELEMENTI GENERICI Programmazione Web 1 Elemen/ generici Se nessun elemento descrive il vostro contenuto block element generic divisione di contenuto come inline element generico iden:fica
CSS 4. Tipi di dati, lunghezze ed unità di misura
CSS 4 Tipi di dati, lunghezze ed unità di misura Tipi di dati in CSS Esistono i seguenti tipi di dati Tecnologie di Sviluppo per il WEB 2 Numeri
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 7 Utilizzo avanzato di Style Sheets 7.1 Applicare stili
Contenuto vs Stile: un esempio
I limiti dell HTML Il principale problema di HTML è la mancanza di separazione tra contenuto e stile all interno delle pagine. Molto spesso, invece degli appositi tag, si utilizzano le tabelle per posizionare
Creare un portale personalizzato
1 Creare un portale personalizzato Passi da seguire 1) Aprire la pagina: http://www.term-minator.it/modello.html 2) Scaricare modello : 2) Aprire il file modello con blocco note : 1 2 3) Modificare il
CSS Proprietà del box model
Laboratorio di Tecnologie Web CSS Proprietà del box model Dott. Stefano Burigat www.dimi.uniud.it/burigat Box model Abbiamo introdotto in precedenza il concetto fondamentale di box model, in base al quale
CSS. Cascading Style Sheet
CSS Cascading Style Sheet CSS Il CSS è un linguaggio, di tipo dichiarativo, che serve per definire lo stile di presentazione degli elementi presenti in un documento HTML. Esso è inglobato all interno dell
JavaScript 5. CSS e JavaScript
JavaScript 5 CSS e JavaScript CSS e JavaScript Attraverso JavaScript è possibile controllare proprietà CSS Possiamo controllare lo stile di un singolo elemento HTML o di un tag in generale Possiamo aggiungere
Laboratorio di reti I: Cascading Style Sheets
Laboratorio di reti I: Cascading Style Sheets Stefano Brocchi brocchi@dsi.unifi.it 10 novembre, 2009 Stefano Brocchi Laboratorio di reti I: I CSS 10 novembre, 2009 1 / 45 Cascading Style Sheets Un Cascading
Sistemi Mobili e Wireless Android - Risorse
Sistemi Mobili e Wireless Android - Risorse Stefano Burigat Dipartimento di Matematica e Informatica Università di Udine www.dimi.uniud.it/burigat stefano.burigat@uniud.it Risorse in Android In Android,
Guida ai CSS. Introduzione
Guida ai CSS Introduzione... 1 Sintassi... 1 Stile in linea... 1 Stile incorporato... 2 Stile esterno... 2 Classi... 3 Selettori ID... 4 Grafica... 4 Link... 5 Attributi testo... 6 Attributi carattere...
Applicare gli stili CSS
Applicare gli stili CSS Gli stili CSS possono essere applicati nei seguenti modi: Selettore di tipo (o di tag o selettore universale) Lo stile viene applicato a tutti i tag dello stesso tipo di quello
INTRODUZIONE A CSS. A che cosa serve CSS Come funziona CSS Regole, proprietà e valori
10 INTRODUZIONE A CSS A che cosa serve CSS Come funziona CSS Regole, proprietà e valori In questo capitolo vedremo come rendere più attraenti le pagine web, controllandone l'aspetto tramite elementi CSS.
Indice generale. Introduzione...xiii. Gli standard e i CSS...1
Introduzione...xiii Capitolo 1 Capitolo 2 Capitolo 3 Gli standard e i CSS...1 Contenuti e formattazione: due oggetti distinti... 1 Le zuppe di codice... 2 L introduzione dei CSS... 4 I vantaggi degli standard...
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
HTML. Hyper Text Markup Language
HTML Hyper Text Markup Language IL WEB Le componenti principali del web sono: HTML: definizione del contenuto delle pagine CSS: definizione dell aspetto delle pagine Javascript: definizione del comportamento
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
CSS Cascading Style Sheets
CSS Cascading Style Sheets il linguaggio per modificare lo stile delle pagine web 1 Fogli di stile (CSS) Servono per facilitare la creazione di pagine HTML con un aspetto uniforme Permettono di separare
Struttura Layout Monolitico Fisso con Menu Orizzontale
Struttura Layout Monolitico Fisso con Menu Orizzontale BODY Body { margin: 0px; padding:0; font-family: arial,sans-serif; font-size: 76%; text-align: center; background-color: #FC3; background-image: url();
Formattare il testo con gli stili
Formattare il testo con gli stili Capita spesso di dover applicare ripetutamente la stessa formattazione, o anche modificare il colore, le dimensioni e il tipo di carattere, per dare risalto a un testo.
Modifica Pagina Web. Pulsante LogOut: cliccare per uscire dall'ambiente di amministrazione
Modifica Pagina Web Dopo aver effettuato la Login con la Username e la Password fornitavi (alla url http:// [nomedominio]/account oppure attraverso la pagina login se presente sul sito) vi troverete all'interno
HTML. Hyper Text Mark-Up Language
HTML Hyper Text Mark-Up Language Cos è l HTML? È un linguaggio usato per descrivere documenti ipertestuali disponibili nel Web È un linguaggio di marcatura del testo che descrive il contenuto e il formato
Lezione del corso CSS - Web Design ed Accessibilità secondo il W3C con CSS ed XHTML
Questo PDF è stato generato su richiesta di Matera Renato il 31/10/2014 alle 16.03. Attenzione: l'uso di questo file in violazione delle norme in materia di diritto d'autore costituisce reato. Lezione
- La formattazione con foglio di stile esterno: Come realizzare e collegare un file con codice di stile ad una pagina web.
I fogli di stile. Argomenti trattati: - La formattazione con foglio di stile interno: Come dichiarare lo stile di una pagina web all'interno del suo codice. - Ereditarietà e selettori contestuali: Come
Università degli studi di Verona. Corso di Informatica di Base. Lezione 4 - Parte 2. Rifinitura di un documento
Università degli studi di Verona Corso di Informatica di Base Lezione 4 - Parte 2 Rifinitura di un documento In questa seconda parte vedremo le principali rifiniture di un documento. In particolare: 1.
Metalinguaggi di marcatura Materiale didattico di supporto. Indice 6. HTML (CONTINUA)...2
Indice 6. HTML (CONTINUA)...2 6.1 FOGLI DI STILE (CSS- CASCADING STYLESHEET)...2 6.1.1 Regole dello stile...6 6.1.2 Classi...6 6.1.3 Esempi di proprietà modificabili e relativi valori....9 6.2 DIVISIONS
Laboratorio di Tecnologie Web HTML: Introduzione Dott. Stefano Burigat
Laboratorio di Tecnologie Web HTML: Introduzione Dott. Stefano Burigat www.dimi.uniud.it/burigat File HTML e tag Un file HTML non è nient'altro che un puro file di testo al cui interno sono presenti delle
Corso html 5. Di Roberto Abutzu. `***********` Dodicesima parte: I css, I link e le pseudoclassi. `**********`
Corso html 5. Di Roberto Abutzu. `***********` Dodicesima parte: I css, I link e le pseudoclassi. `**********` IIl concetto delle pseudo classi. Questa notazione è più complessa perchè varia a seconda
CSS: Colori, background, gradienti
Laboratorio di Tecnologie Web CSS: Colori, background, gradienti Dott. Stefano Burigat www.dimi.uniud.it/burigat Colore di foreground Come abbiamo visto in precedenti esempi, è possibile modificare il
Opzioni contenitore Prodotti
Opzioni contenitore Prodotti Clicca il pulsante destro del mouse sul contenitore prodotti per accedere alle opzioni. Clicca il pulsante OPZIONI del menù che appare. Adesso puoi accedere a tutte le opzioni
Sistemi Mobili e Wireless Android Interfacce utente: Widget e Layout (2)
Sistemi Mobili e Wireless Android Interfacce utente: Widget e Layout (2) Stefano Burigat Dipartimento di Matematica e Informatica Università di Udine www.dimi.uniud.it/burigat stefano.burigat@uniud.it
Elenchi puntati e numerati
Elenchi puntati e numerati Gli elenchi giocano un ruolo molto importante nei testi, ma anche nella definizione di elementi strutturali delle pagine HTML. Dal punto di vista dell organizzazione del testo
Laboratorio di Tecnologie Web HTML: Immagini Dott. Stefano Burigat
Laboratorio di Tecnologie Web HTML: Immagini Dott. Stefano Burigat www.dimi.uniud.it/burigat Aggiungere immagini E' possibile inserire immagini all'interno delle pagine web in due modi: come contenuto
1 Cascading Style Sheets, meglio noti come CSS o fogli di stile.
Sommario CSS 1 Cascading Style Sheets, meglio noti come CSS o fogli di stile.... 1 1.1 Fogli di stile "in linea"... 2 1.2 Fogli di stile "interni"... 2 1.3 Fogli di stile "esterni"... 2 1.4 Che tipo di
CSS (parte 3) Strumenti informatici per giornalisti AA 2008/09
CSS (parte 3) Strumenti informatici per giornalisti AA 2008/09 Selettori class e id! Sono due attributi fondamentali applicabili a tutti gli elementi! Consentono di superare le limitazioni intrinseche
Guida ai fogli di stile CSS. Materiale tratto da:
Guida ai fogli di stile CSS Materiale tratto da: http://css.html.it/guide/leggi/2/guida-css-di-base/ Come è fatto un CSS: regole e commenti Com'è fatta una regola Figura 1. Struttura di una regola L'illustrazione
CSS. Dott. Nicole NOVIELLI novielli@di.uniba.it http://www.di.uniba.it/intint/people/nicole.html. ignorare la definizione degli elementi di stile
CSS Dott. Nicole NOVIELLI novielli@di.uniba.it http://www.di.uniba.it/intint/people/nicole.html CSS: Cascading Style Sheet! Tecnologia W3C per la definizione dello stile di una pagina web! Contenuto e
LE MASCHERE. Maschera standard. Maschera semplice. Questa maschera però non consente di nascondere alcuni campi e visualizza i record uno ad uno.
LE MASCHERE Inserire i dati direttamente in tabella non è agevole. Questa operazione normalmente viene svolta utilizzando le maschere. I vantaggi offerti dalle maschere sono: Aspetto grafico più accattivante
INSERIMENTO. Un foglio di stile può essere esterno e interno: Un foglio esterno si carica: Un foglio interno può essere inserito
CSS I FOGLI DI STILE HTML serve informare il browser di quali sono le componenti necessarie a mostrare un documento e ad articolare il documento in blocchi semantici. I fogli di stile (Cascading Style
3.6.1 Inserimento. Si apre la finestra di dialogo Inserisci Tabella:
3.6.1 Inserimento Per decidere dove collocare una tabella è necessario spostare il cursore nella posizione desiderata. Per inserire una tabella esistono diversi modi di procedere: Menù Tabella Inserisci
Fabio Proietti (c) 2012 Licenza:
data di ultima modifica 30/01/2013 Prerequisiti per la comprensione aver usato almeno una volta l'editor notepad++ aver creato almeno una volta una pagina web, usando Una calcolatrice in javascript
(A) CONOSCENZA TERMINOLOGICA (B) CONOSCENZA E COMPETENZA (C) ESERCIZI DI COMPRENSIONE
Dare una breve descrizione dei termini introdotti: (A) CONOSCENZA TERMINOLOGICA Foglio di stile interno Foglio di stile esterno Fogli di stile incorporati Fogli di stile inline (B) CONOSCENZA E COMPETENZA
7 Posizionare. gli elementi sulla pagina con i fogli di stile CSS
7 Posizionare gli elementi sulla pagina con i fogli di stile CSS Posizionare gli elementi sulla pagina in modo relativo Posizionare gli elementi in modo assoluto Impostare il posizionamento 3D (Z-Order)
HTML. I tag HTML (parte 1)
HTML I tag HTML (parte 1) I tag HTML I comandi che il browser interpreta Etichette per marcare l inizio e la fine di un elemento HTML Formato e possono essere tag di apertura: tag di chiusura:
Documentazione di Powerful Form Generator
Documentazione di Powerful Form Generator Installazione Configurazione Uso Creare / modificare un modulo Gestire i campi Visualizzare l'elenco dei mezzi Utilizzando ganci per rendere il modulo Utilizzando
Guida per la personalizzazione dei modelli di stampa / salvataggio documenti
Guida per la personalizzazione dei modelli di stampa / salvataggio documenti 1. Premessa. Questa è una guida generale sulla funzione di personalizzazione dei modelli e come tale contiene informazioni a
Grafici. 1 Generazione di grafici a partire da un foglio elettronico
Grafici In questa parte analizzeremo le funzionalità relative ai grafici. In particolare: 1. Generazione di grafici a partire da un foglio elettronico 2. Modifica di un grafico 1 Generazione di grafici
Aspetto. Lauri Watts Traduzione italiana: Pino Toscano
Lauri Watts Traduzione italiana: Pino Toscano 2 Indice 1 Aspetto 4 1.1 Generale........................................... 4 1.2 Carattere........................................... 4 1.3 Fogli di stile.........................................
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
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
Prefazione... xi. Da leggere prima di iniziare...xiv. Capitolo 1 Introduzione a JavaScript Sezione A Programmazione, HTML e JavaScript...
SOMMARIO Prefazione... xi Panoramica del libro... xi Caratteristiche distintive...xii Aspetti qualificanti del libro...xii Browser Web da usare... xiii Ringraziamenti... xiii Da leggere prima di iniziare...xiv
I CSS o Fogli di stile. Telematica per le arti e lo spettacolo a.a. 2006/07
I CSS o Fogli di stile Telematica per le arti e lo spettacolo a.a. 2006/07 Quando è nato il web il problema principale era semplicemente quello della gestione dei contenuti, dato anche il basso numero
Valori e unità di misura (1)
Valori e unità di misura (1) I valori di una proprietà non vanno mai messi tra virgolette. Uniche eccezioni i valori espressi da stringhe di testo e i nomi dei font formati da più di una parola (esempio:
Introduzione ai fogli di stile. CSS HOME Modi di attaccare stile al documento Status Bar <HOME> <BOTTOM>
Pagina 1 CSS HOME Modi di attaccare stile al documento Status Bar Argomenti della pagina Incollare style ai documenti Linking
CODE MODEL - Modalità di scrittura del codice
CODE MODEL - Modalità di scrittura del codice Visual Studio supporta due modelli per la codifica di pagine web: - Codice Inline: Questo modello è il più vicino al tradizionale ASP. Tutto il markup HTML
Progettazione Siti Web: Pagine Web Introduzione e HTML
Progettazione Siti Web: Pagine Web Introduzione e HTML Dr. Ing. Information Management Systems (IMS) Research Group, Dipartimento di Ingegneria dell Informazione, Università degli Studi di Padova {silvello}@dei.unipd.it
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
CSS font-size: pt, px o em? Che unità di misura utilizzare?
CSS font-size: pt, px o em? Che unità di misura utilizzare? In linea di massima possiamo dire che ogni unità di misura ammessa nei CSS ha una destinazione d'uso precisa: pt I punti (pt) sono l'unità di
Cascading Style Sheet
I fogli di stile Cascading Style Sheet Master di I livello Viaggi Mediterranei: Itinerari Turistici, Comunicazione e Culture (si ringrazia il dott. Claudio Schifanella, che ha concesso l uso del materiale)
Excel. Il foglio di lavoro. Il foglio di lavoro Questa viene univocamente individuata dalle sue coordinate Es. F9
Excel Un foglio di calcolo o foglio elettronico è un programma formato da: un insieme di righe e di colonne visualizzate sullo schermo in una finestra scorrevole in cui è possibile disporre testi, valori,
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
CSS E FOGLI DI STILE Guida Css di base
2017 CSS E FOGLI DI STILE Guida Css di base Progetto di Alternanza Scuola-Lavoro Anno scolastico 2016-2017 Istituto Tecnico Enrico Fermi, Siracusa Eleonora SikeWEB 01/01/2017 Introduzione ai fogli di stile
Creare classi e ID per applicare gli stili, pagina 93. Applicare gli stili a collegamenti ipertestuali, pagina 96
Panoramica del capitolo Creare classi e ID per applicare gli stili, pagina 93 Applicare gli stili a collegamenti ipertestuali, pagina 96 Creare e collegare fogli stile esterni, pagina 98 6 Introduzione
LINGUAGGI PER IL WEB HTML. (HyperText Markup Language)
LINGUAGGI PER IL WEB HTML (HyperText Markup Language) Il World Wide Web World Wide Web = sistema di accesso a Internet basato sul protocollo HTTP insieme di protocolli e servizi (HTTP, FTP, ) insieme di
PROGRAMMA DEL CORSO ADOBE DREAMWEAVER CS5
PROGRAMMA DEL CORSO ADOBE DREAMWEAVER CS5 Unità didattica 1 - Architettura di pagina statica HTML Dimostrazione 1-1: Visualizzazione del sito Unità didattica 2 - Prime operazioni Introduzione a Dreamweaver
HTML: tag. HTML: tag. HTML: tag. HTML: un semplice esempio
HTML: tag Alcuni tag prevedono un identificatore di inizio () e di fine marcatura () altri sono dei tag singoli (es.: , ). Esistono delle codifiche per rappresentare in modo universale
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
HTML. Queste slides sono un adattamento di quelle di Luca Anselma, cui va il mio ringraziamento
HTML Queste slides sono un adattamento di quelle di Luca Anselma, cui va il mio ringraziamento Cenni di HTML Hypertext Markup Language Linguaggio con cui sono scritte le pagine web Permette di realizzare
Come inserire un foglio di s=le
Cascading Style Sheet CASCADING STYLE SHEET I fogli di s=le a cascata (de? anche semplicemente fogli di s=le) vengono usa= per definire la rappresentazione di documen= HTML, XHTML e XML. L'introduzione
Utilizzo dei CSS: regole
Tutorial per siti scolastici accessibili con editor web open source Utilizzo dei CSS: regole Adotta un template CSS - Regole pag. - 1 Autore Questa guida è stata realizzata da Gianfranco Bilotti e fa parte
Dichiarazione di accessibilità
Dichiarazione di accessibilità Questo sito è stato sviluppato secondo le: "Linee guida per i siti web delle PA" previste dalla direttiva Brunetta n. 8 del 26 novembre 2009 e rivolte a tutte le amministrazioni
Database Modulo 6 CREAZIONE DI MASCHERE
Database Modulo 6 CREAZIONE DI MASCHERE!1 Per la gestione dei dati strutturati è possibile utilizzare diverse modalità di visualizzazione. Si è analizzata sinora una rappresentazione di tabella (foglio
Basi di Dati-X HTML HTML HTML. Corso di Laurea in Informatica Anno Accademico 2013/2014
HTML 2 Basi di Dati-X Corso di Laurea in Informatica Anno Accademico 2013/2014 Hyper Text Markup Language linguaggio testuale per descrivere la struttura di documenti ipertestuali disponibili nel World
HTML e CSS. Concetti base
HTML e CSS Concetti base Hyper Text Markup Language Structured Generalized Markup Language (SGML) Nasce in ambiente editoriale Testo non formattato ma contrassegnato da coppie di marcatori Document
Sommario. Nozioni di base su HTML
Sommario Parte 1 Ringraziamenti.................................................... xiii Introduzione...................................................... xvi Che cos'è HTML?.................................................
ESEMPIO DI TEMPLATE CON BARRA DI NAVIGAZIONE ORIZZONTALE. Esempio di Template con barra di navigazione orizzontale Ultima revusione 25/05/2015 Pag.
ESEMPIO DI TEMPLATE CON BARRA DI NAVIGAZIONE ORIZZONTALE Esempio di Template con barra di navigazione orizzontale Ultima revusione 25/05/2015 Pag. 1