Prof. Maristella Agosti, Ing. Marco Dussin
|
|
|
- Luca Giuliani
- 5 anni fa
- Visualizzazioni
Transcript
1 Università degli Studi di Padova Facoltà di Lettere e Filosofia Progettazione di siti web (ING-INF/05) LMSGC, mutuato da LMLIN e Sc. Stat. a.a Indice: Prof. Maristella Agosti, Ing. Marco Dussin Cascading Style Sheets: CSS Cascading Style Sheets (CSS): motivazioni Dove si interviene con i CSS?
2 Cascading Style Sheets (CSS): motivazioni Una pagina web è formata fondamentalmente da due elementi: i contenuti veri e propri e la presentazione ovvero l'aspetto attraverso il quale i contenuti sono mostrati all'utente. Image from Inizialmente le pagine Web erano state pensate soprattutto per i contenuti, con pochissime possibilità di personalizzazione della presentazione. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 2
3 Cascading Style Sheets (CSS): motivazioni Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 3
4 Cascading Style Sheets (CSS): motivazione Per ovviare a queste limitazioni stilistiche, i designer di pagine Web adottarono man mano diverse tecniche, che possiamo così sintetizzare e affiancare ad un semplice esempio: l uso di estensioni HTML proprietarie; la conversione del testo in immagini; il posizionamento del testo utilizzando tabelle annidate; la creazione di programmi sostitutivi all HTML. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 4
5 Cascading Style Sheets (CSS): motivazioni Separazione presentazione e contenuto: CSS + HTML CSS1: 1996 CSS2: 1998 CSS3: Working Draft Specifica W3C: Permettono agli autori di esprimere il proprio gusto grafico preservando la semplicità del codice HTML così come è stato progettato Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 5
6 Cascading Style Sheets (CSS): motivazioni Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 6
7 Dove si interviene con i CSS? Caratteristiche degli elementi nella pagina: visibilità, dimensioni, bordi, spaziature Posizionamento degli elementi nella pagina: alto, basso, sinistra, destra, posizionamenti relativi ed assoluti Testo: dimensione, colore, font, allineamento, sistema di interlinea, decorazioni, spaziare lettere e parole Stili: diversi per titoli, sottotitoli, paragrafi, liste Sfondo: colore, immagini, immagini ripetute o centrate Bordi: tabelle, pagina, immagini, blocchi di testo Ancora: colore, colore dopo visita, colore selezione Altro: caratteristiche del puntatore, lettere capitali, ecc Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 7
8 Università degli Studi di Padova Facoltà di Lettere e Filosofia Progettazione di siti web (ING-INF/05) LMSGC, mutuato da LMLIN e Sc. Stat. a.a Indice: Prof. Maristella Agosti, Ing. Marco Dussin CSS e pagine Web: prima parte Elementi di una pagina Web Costruire una pagina Web Elementi blocco ed elementi inline DIV e SPAN: due elementi speciali Struttura di una pagina Web I selettori
9 Elementi di una pagina Web Una pagina Web è un insieme di elementi disposti uno di fianco all altro nello spazio (chiamato canvas) messo a disposizione dal browser per la loro visualizzazione. Tali elementi galleggiano sullo spazio, cercando di occuparlo al meglio. Image from Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 9
10 Costruire una pagina Web Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 10
11 Costruire una pagina Web <html> <head> <title>turismo a Padova</title> </head> <body> </body> </html> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 11
12 Elementi blocco Elementi blocco: se inseriti nel testo determinano una nuova riga e possono contenere altri elementi. Essi tendono ad occupare tutta la larghezza a loro disposizione. <h1>... <h6> Testate <p> Paragrafo <ul>, <ol>, <dl> Liste (unordered, ordered e definition) <li>, <dt>, <dd> Elemento di lista, termine da definire, definizione <table> Tabella <blockquote> Blocco di citazione <pre> Blocco di codice pre-formattato <form> Una maschera per l inserimento dati (form) Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 12
13 Costruire una pagina Web <html> <head> <title>turismo a Padova</title> </head> <body> <h1>arte e cultura</h1> <h2>monumenti</h2> <p>padova ha molti monumenti famosi e importanti.</p> <h2>visite guidate e itinerari</h2> <h2>musei</h2> <h1>ospitalità</h1> <h2>alberghi</h2> <h2>b&b e ostelli</h2> <h1>enogastronomia</h1> <h2>ristoranti</h2> <h2>agriturismi</h2> <h1>news ed eventi</h1> </body> </html> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 13
14 Elementi inline Elementi inline: possono essere inseriti all interno di altri elementi di blocco e possono contenere a loro volta altri elementi inline, ma non di blocco. Tendono ad occupare minor spazio possibile in larghezza. Non forzano la creazione di una nuova riga <a> Ancora <strong> Rende il testo marcato (usato al posto di <b>) <em> Aggiunge enfasi (usato al posto di <i>) <img /> Immagine <br> Line-break <input> Campi di inserimento dati di un elemento <form> <abbr> Abbreviazione <acronym> Acronimo Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 14
15 Costruire una pagina Web <p> <a href= >Padova</a> ha <strong>molti monumenti <em>famosi</em> e <em>importanti</em></strong>. </p> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 15
16 DIV e SPAN: due elementi speciali Vi sarete accorti che gli elementi blocco e inline presentati finora vengono visualizzati dal browser con un loro stile particolare, nella dimensione del testo, nella scelta di un font grassetto piuttosto che corsivo, e via dicendo. Sono stati quindi introdotti, anche in seguito all avvento dei CSS, due elementi base e privi di stile, da personalizzare a piacimento: <div></div> è l elemento blocco base <span></span> è l elemento inline base Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 16
17 Box Model: canvas e non solo! Una pagina HTML è un insieme di box rettangolari: elemento blocco o in linea la loro gestione fa parte del box model. Canvas Margine Superiore Bordo Superiore Padding Superiore Margine Sinistro Bordo Sinistro Padding Sinistro Height Area del contenuto Width Padding Inferiore Padding Destro Bordo Destro Margine Destro Margine Inferiore Bordo Inferiore Box Rettangolare Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 17
18 Box Model: canvas e non solo! Bisogna distinguere tra la larghezza dell'area del contenuto e la larghezza effettiva di un box. Area del contenuto valore della proprietà width per il valore della proprietà height. Larghezza di un box margine sinistro + bordo sinistro + padding sinistro + larghezza del contenuto + padding destro + bordo destro + margine destro Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 18
19 <html> <head> Struttura di una pagina Web La struttura di una pagina Web è gerarchica <title>turismo a Padova</title> </head> <body> <h1>arte e cultura</h1> <h2>monumenti</h2> <p> <a href= >Padova</a> ha <strong>molti monumenti <em>famosi</em> e <em>importanti</em></strong>.</p> <h2>itinerari</h2> <h2>visite guidate</h2> <h2>musei</h2> <h1>ospitalità</h1> <h2>alberghi</h2> <h2>b&b e ostelli</h2> <h1>enogastronomia</h1> <h2>ristoranti</h2> <h2>agriturismi</h2> <h1>news ed eventi</h1> </body> </html> HEAD TITLE struttura ad albero HTML STRONG BODY P H2 H1 H2 Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 19 EM A Gli elementi sono in un rapporto genitore-figlio.
20 Struttura ad albero ed ereditarietà HTML Livello 0 Nodo Radice HEAD BODY Livello 1 TITLE H1 H2 P P Livello 2 A IMG A BR Livello 3 STRONG Livello 4 Ereditarietà le proprietà impostate per un elemento sono automaticamente ereditate dai suoi discendenti Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 20
21 I selettori Ogni elemento della pagina può essere identificato utilizzando i selettori : ogni tag HTML è un selettore: * indica tutti gli elementi della pagina; a indica tutti gli elementi della pagina con tag a; a, b indica tutti gli elementi della pagina con tag a oppure b; a b indica tutti gli elementi della pagina con tag b contenuti in elementi con tag a, a qualsiasi livello di profondità (sfruttando l ereditaritetà); a > b indica tutti gli elementi della pagina con tag b figli di elementi con tag a, quindi ad un livello di profondità; a + b indica l elemento b adiacente all elemento a. gli ultimi due selettori non sono ben supportati da tutti i browser Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 21
22 I selettori identificatori: possono essere associati agli elementi per definire una entità unica all interno del documento: sono vietati identificatori duplicati. Sono alfanumerici con la sola eccezione del carattere underscore _. <img id= logo src= /> <p id= numero_di_telefono > </p> #logo indica l elemento (che, ricordo, è unico) della pagina con identificatore logo. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 22
23 I selettori classi: utilizzate per creare gruppi di elementi con lo stesso comportamento. Sono alfanumeriche con la sola eccezione del carattere underscore _. <p class= saluto id= informale >ciao</p> <div id= frasi > <span class= saluto id= formale_am >buongiorno</span> <span class= saluto id= formale_pm >buonasera</span> </div>.saluto indica tutti gli elementi della pagina con classe saluto; span.saluto indica tutti gli elementi della pagina con tag span e contemporaneamente classe saluto; div span.saluto indica tutti gli elementi della pagina, contenuti nel tag div, con tag span e contemporaneamente classe saluto; #frasi saluto indica tutti gli elementi contenuti in quello con identificatore frasi e con classe saluto. e via dicendo, valgono le regole presentate prima Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 23
24 I selettori: esempio Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 24
25 Lorem Ipsum: una curiosità Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cos è? Un passaggio fittizio usato dall industria tipografica fin dal 1500 per verificare il layout delle pagine Dove? Ad esempio nel sito Web è possibile generare un numero di paragrafi variabile da usare nelle proprie pagine in costruzione Significato? In genere si pensa sia una passaggio costruito da parole scelta a caso, invece è un insieme di passaggi presi da Cicerone, 45 a.c. : I termini estremi del bene e del male Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 25
26 Università degli Studi di Padova Facoltà di Lettere e Filosofia Progettazione di siti web (ING-INF/05) LMSGC, mutuato da LMLIN e Sc. Stat. a.a Indice: Prof. Maristella Agosti, Ing. Marco Dussin CSS e pagine Web : seconda parte Come è fatto un CSS Incorporare i CSS nelle pagine
27 Esempio di uso dei CSS Pagina HTML: esempio1.html CSS: stylees1.css <html> <head> <link rel="stylesheet" href="stylees1.css" /> </head>.p1{ color:orange; font-weight:bold; } p1 = classe definita nel CSS <body> <h1>esempio numero 1</h1> <p class="p1">elemento paragrafo 1</p> <p class="p1">elemento paragrafo 2</p> <p class="p1">elemento paragrafo 3</p> </body> </html> Si dice alla pagina HTML che deve caricare e applicare il foglio di stile CSS. Scrivi una volta applica dove vuoi! La classe p1 è definita nel CSS ed è applicata agli elementi nella pagina HTML Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 27
28 Come è fatto un CSS? Un CSS è formato da regole. Le regole sono formate 3 parametri: selettore proprietà valore h1 color : red; Selettore { proprietà : valore;} Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 28
29 Raggruppare selettori e regole h1 color : red; h1 background : white; h1 color:red; background:white; Selettore { proprietà:valore ; proprietà:valore; ; } Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 29
30 Raggruppare selettori e regole h1 color : red; h2 color : red; h1, h2 color:red; selettore 1, selettore 2,, selettore n { proprietà:valore; } Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 30
31 CSS interni ed esterni Un foglio di stile si dice ESTERNO se è definito in un file separato (file.css) dalla pagina HTML. Un foglio di stile di dice INTERNO quando il suo codice è inserito direttamente nella pagina HTML. I CSS possono essere collegati, incorporati o in linea Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 31
32 <html> <head> CSS collegati: mediante link <link rel="stylesheet" type="text/css media= screen href="stylees1.css" /> </head> <body> </body> </html> 1. rel: descrive il tipo di relazione tra il documento e il file collegato. È obbligatorio. Per i CSS due sono i valori possibili: stylesheet e alternate stylesheet fogli di stile alternativi. 2. href: serve a definire l'url assoluto o relativo del foglio di stile. È obbligatorio. 3. type: identifica il tipo di dati da collegare. Per i CSS l'unico valore possibile è text/css. L'attributo è obbligatorio. 4. media: con questo attributo si identifica il supporto (schermo, stampa, etc) cui applicare un particolare foglio di stile. Attributo opzionale. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 32
33 CSS collegati: <html> <head> </head> <body> </body> </html> url(stylees1.css); </style> Miglior modo per risolvere i problemi di compatibilità tra browser. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 33
34 CSS incorporati <html> <head> <title>css INCORPORATI</title> <style type="text/css"> </style> </head> body { background: #FFFFCC; }.p1{ color:orange; font-weight:bold; } <body></body></html> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 34. Il foglio di stile è incorporato nella pagina HTML e non in un file esterno. Deve essere inserito all interno del tag <head>. La dichiarazione del foglio di stile è all interno del tag <style>. attributo type obbligatorio attributo media opzionale
35 CSS in linea <h1 style="color: red; background: black; > Titolo 1 </h1> Definizione del CSS in linea La dichiarazione dello stile avviene all interno dei singoli tag HTML mediante l attributo style Si perde buona parte dei vantaggi dati dall uso dei CSS, ma possono essere utili in alcun casi particolari. Tag HTML <h1> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 35
36 Esempio dichiarazione CSS <html> <head> <link rel="stylesheet" href= stylees1.css" /> <style type="text/css">.p2{ color:blue; font-weight:bold; } </style> <title>struttura del documento</title> </head> <body> <h1>esempio uso dei fogli di stile: </h1> <p class="p1">css collegato mediante file esterno</p> <p class="p2">css incorporato</p> CSS collegato via link CSS incorporato CSS in linea <p style="color:red; font-weight:bold;">css in linea</p> </body></html> Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 36
37 CSS: attributo MEDIA L attributo MEDIA può accompagnare sia l elemento LINK che l elemento STYLE Si definiscono stili diversi per supporti diversi. <link rel="stylesheet" type="text/css media= screen href="stylees1.css" /> * all: il CSS si applica a tutti i dispositivi di visualizzazione. * screen: valore usato per la resa sui normali browser web. * print: il CSS viene applicato in fase di stampa del documento. * projection: usato per presentazioni e proiezioni a tutto schermo. * aural: da usare per dispositivi come browser a sintesi vocale. * braille: il CSS viene usato per supporti basati sull'uso del braille. * embossed: per stampanti braille. * handheld: palmari e simili. * tv: web-tv. Progettazione di siti web, a.a Maristella Agosti, Marco Dussin 37
Università degli Studi di Padova Facoltà di Lettere e Filosofia Elementi di programmazione per la presentazione di contenuti Web A.A.
Indice: Università degli Studi di Padova Facoltà di Lettere e Filosofia Elementi di programmazione per la presentazione di contenuti Web A.A. 2009/2010 Marco Dussin Docente Argomenti del laboratorio Introduzione
CSS: Cascading Style Sheet
CSS: Cascading Style Sheet Dr. Ing. Information Management Systems (IMS) Research Group, Dipartimento di Ingegneria dell Informazione, Università degli Studi di Padova {silvello}@dei.unipd.it Corso di
Istituto Comprensivo GIUSEPPE GARIBALDI
Istituto Comprensivo GIUSEPPE GARIBALDI GENOVA Via XX Settembre 123 16100 Genova (GE) Tel. 010 12345678 Fax 010 12345678 e-mail: info@icgaribaldi.gov.it sito: www.icgaribaldi.gov.it FRONTESPIZIO (standard
CSS Posizionamento degli elementi
Laboratorio di Tecnologie Web CSS Posizionamento degli elementi Dott. Stefano Burigat www.dimi.uniud.it/burigat Tutti gli esempi che abbiamo visto finora sfruttavano regole di posizionamento standard (il
IL NUOVO MODO DI VIVERE l OUTDOOR
IL NUOVO MODO DI VIVERE l OUTDOOR Hialps è il Social Network della Montagna. Una USER GENERATED CONTENT PLATFORM che mette in contatto gli appassionati (che cercano attività outdoor) con gli Stakeholder
BRANDBOOK VERSION 1.1. by morganadesign.it
BRANDBOOK VERSION 1.1 by morganadesign.it Brandbook content Cos è Winechart Logotype application Icon - Mark Logo + claim Logo clearspace Color palette Typeface APP Icon Incorrect logo use 3 5 7 8 9 10
LOGO ISTITUTI ITALIANI DI CULTURA
LOGO ISTITUTI ITALIANI DI CULTURA GUIDELINES Regole principali Colori Pantone 1797 C Pantone 7741 C Pantone Black 3 C C 15 - M 100 - Y 90 - K 10 C 75 - M 25 - Y 100 - K 0 C 11 - M 0 - Y 15 - K 82 R 162
Comunicare il progetto / Le Basi. Corso di Tecniche di Presentazione / Diego Decortes /
1. Cosa significa Comunicare? /2 Ricercando la parola comunicazione sul dizionario troveremo una semplice definizione che spiega come, dal significato latino di mettere in comune, il termine abbia assunto
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
The traceability solution
The traceability solution ( AhRCOS Tester Traceability) Il sistema ATT ( AhRCOS Tester Traceability) della AhRCOS s.r.l., rappresenta la soluzione ai problemi connessi alla tracciabilità ed alla possibilità
Light Feather. Come Contattarci
Scopri qualcosa di nuovo da indossare! Piume di ogni tipo e di qualsiasi colore. CONTATTACI VIA E.MAIL ( Piuma Leggera) è il nome di una linea di prodotti per sole donne, creata per chi è affascinato dalla
Questo esempio di presentazione è stato realizzato con ACTAFOLIO. versione 1.0
ID Presentazione 1 Ingegnere Luigi Rossi Questo esempio di presentazione è stato realizzato con ACTAFOLIO versione 1.0 I dati inseriti nella presentazione sono del tutto inventati a solo scopo dimostrativo.
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
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
Gestionale per gli Organismi di Mediazione
Gestionale per gli Organismi di Mediazione Le principali funzionalità Workflow Procedimento Consultazione Procedimento Anagrafiche Procedimento Contabilità Elenco Mediatori Assegnazione Automatica Mediatore
Presentazione di ARCHITETTI & INGEGNERI s.r.l.
Architetti & Ingegneri srl ID Presentazione 3 Questo esempio di presentazione è stato realizzato con ACTAFOLIO versione 1.0 I dati inseriti nella presentazione sono del tutto inventati a solo scopo dimostrativo.
ANUALE D USO. del Marchio di Certifi cazione ICIM S.p.A.
ANUALE D USO del Marchio di Certifi cazione ICIM S.p.A. Indice Nota informativa 4 Il Marchio di Certifi cazione 6 Sistema di Gestione Certifi cato 8 Sistema di Gestione Certifi cato: Esempi 20 Prodotto
UNIVERSITÀ DEGLI STUDI DI MILANO-BICOCCA MANUALE DI CORPORATE IDENTITY
UNIVERSITÀ DEGLI STUDI DI MILANO-BICOCCA MANUALE DI CORPORATE IDENTITY 2 INDICE MANUALE TECNICO IL MARCHIO Il marchio 03 Dipartimenti e scuole 08 STAMPATI DI CONSUMO Carta intestata 10 Busta 13 Cartelletta
COUPON COS È FACILEVETRINA? 1 L acquirente acquista un Coupon e paga la prenotazione all offerta/servizio.
Novità Aprile 2017 facilevetrina.it Promuovi la tua attività e attira nuovi clienti GRATIS con Siamo lieti di presentarti questa nuova opportunità. Da aprile 2017 sarà online il nuovo FacileVetrina COS
ANUALE D USO. del Marchio di Certificazione ICIM S.p.A.
ANUALE D USO del Marchio di Certificazione ICIM S.p.A. Indice Nota informativa 4 Il Marchio di Certificazione 6 Sistema di Gestione Certificato 8 Sistema di Gestione Certificato: Esempi 19 Prodotto Certificato
Progettazione di siti web (ING-INF/05) LMSGC, mutuato da LMLIN e Sc. Stat. a. a
Indice: Università degli Studi di Padova Facoltà di Lettere e Filosofia Progettazione di siti web (ING-INF/05) LMSGC, mutuato da LMLIN e Sc. Stat. a. a. 2010-11 Prof. Maristella Agosti Ing. Marco Dussin
CSS COME PRESENTARE UNA PAGINA WEB
CSS COME PRESENTARE UNA PAGINA WEB Cos è CSS Il CSS (Cascading Style Sheets, in italiano fogli di stile a cascata), in informatica, è un linguaggio usato per definire la formattazione di documenti HTML
Anno Accademico Corso di Tecnologie Web CSS
Universita degli Studi di Bologna - Facolta di Ingegneria Anno Accademico 2006-2007 Corso di Tecnologie Web CSS http://www-lia.deis.unibo.it/courses/tecnologieweb0607/ HTML e Cascading Style Sheets > L
Ripuliamo Via del Gallitello
NUOVA MISSIONE PERSONE MISSIONI PROFILO CLASSIFICHE IN EVIDENZA PROSSIME MISSIONI POPOLARITÀ AMBITO CATEGORIA +1 +2 322 Ripuliamo Via del Gallitello SCOPRI SOSTIENI La prima schermata è quella delle missioni,
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
colori istituzionali PANTONE 185 C PANTONE 295 C PANTONE 185 C
2 Questo manuale presenta gli elementi del sistema di identità visiva di 50&PiùEnasco. Il presente documento è destinato agli utilizzatori al fine di riprodurre correttamente il simbolo di 50&PiùEnasco,
ANUALE D USO. del Marchio di Certifi cazione ICIM S.p.A.
ANUALE D USO del Marchio di Certifi cazione ICIM S.p.A. Indice Nota informativa 4 Il Marchio di Certifi cazione 6 Sistema di Gestione Certifi cato 8 Sistema di Gestione Certifi cato: Esempi 19 Prodotto
4 Estensioni proprietarie. 4 Conversione del testo in immagini. 4 Uso di immagini per il controllo degli spazi bianchi
Universita degli Studi di Bologna - Facolta di Ingegneria HTML e Cascading Style Sheets > L HTML è nato in ambienti scientifici Anno Accademico 2006-2007 Corso di Tecnologie Web CSS http://www-lia.deis.unibo.it/courses/tecnologieweb0607/
11-12 maggio 2019 Santa Maria di Leuca
11-12 maggio 2019 Santa Maria di Leuca Il patrimonio architettonico diffuso sul territorio leucano fatto di ville fin de siècle si apre al grande pubblico con iniziative artistiche e rievocazioni storiche
HTML: Elementi per la gestione del testo 1
Laboratorio di Tecnologie Web HTML: Elementi per la gestione del testo 1 Dott. Stefano Burigat www.dimi.uniud.it/burigat In questo capitolo, introdurremo diversi elementi HTML che possono essere utilizzati
Laboratorio di Tecnologie Web CSS Altre tecniche Dott. Stefano Burigat
Laboratorio di Tecnologie Web CSS Altre tecniche Dott. Stefano Burigat www.dimi.uniud.it/burigat CSS Reset Come abbiamo visto, i browser hanno un loro foglio di stile che viene applicato se non definiamo
Sei. La consulenza evoluta
Sei. La consulenza evoluta Consulenza: la tradizione Fideuram diventa riferimento per il mercato. Da oltre quaranta anni la nostra missione è offrire ai nostri clienti consulenza finanziaria con un alto
Linguaggi ed Applicazioni mul1mediali
Linguaggi ed Applicazioni mul1mediali 06.07- CSS. Cascading Style Sheet Maurizio Maffi ISTI Informa1on Science and Technology Ins1tute A cosa servono I CSS vengono usati per definire la rappresentazione
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
CONCEPT TARGET MATERIALI
WEB ADVERTISING itaeventi.it è il portale che ha lo scopo di supportare il magazine ITAeventi, il mensile free press ricco di contenuti relativi ai principali eventi legati all arte, al design, alla musica,
Corso di CSS. Prerequisiti. Modulo L2 1.2-CSS e HTML. Conoscenza di base del linguaggio HTML. M.Malatesta 1.2-CSS-CSS e HTML-05 12/01/2014
Corso di CSS Modulo L2 1.2-CSS e HTML 1 Prerequisiti Conoscenza di base del linguaggio HTML 2 1 Introduzione In questa Unità vediamo come si collegano i fogli di stile con il codice contenuto in una pagina
Anno Accademico Corso di Tecnologie Web CSS
Universita degli Studi di Bologna - Facolta di Ingegneria Anno Accademico 2007 2008 Corso di Tecnologie Web CSS http://www lia.deis.unibo.it/courses/tecnologieweb0708/ HTML e Cascading Style Sheets > L
Manuale. per l utilizzo del format FSC. iniziativa cofinanziata con Fondo di Sviluppo e Coesione.
Manuale per l utilizzo del format FSC Format FSC > elementi primari logo posizionato in alto a destra elementi grafici > possono essere ripetuti all interno del materiale di comunicazione FSC, in questo
Elementi Blocco vs elementi inline
(X)HTML + CSS Elementi Blocco vs elementi inline HTML vs XHTML Prologo distinto Tag denotati sempre in minuscolo Tutti i tag aperti devono essere chiusi I valori degli attributi vanno sempre inclusi fra
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
Questo esempio di presentazione è stato realizzato con ACTAFOLIO. versione 1.0
26 aprile 2011 ID Presentazione 2 Ingegnere Luigi Rossi Questo esempio di presentazione è stato realizzato con ACTAFOLIO versione 1.0 I dati inseriti nella presentazione sono del tutto inventati a solo
Chi siamo Dove siamo Il nostro staff Lavora con noi Contattaci Newsletter LOGO. News Nuovo Usato Outlet Veicoli commerciali Assistenza Servizi
Wireframe: home page Cerca tra il nuovo usato tipo Volumi volumi Marca Modello marca modello Promo (slider) Prezzo (iva inclusa) I nostri servizi prezzo Cerca ricerca avanzata Vetture nuove speciali Vetture
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
12-13 maggio 2018 Santa Maria di Leuca
12-13 maggio 2018 Santa Maria di Leuca Il patrimonio architettonico diffuso sul territorio leucano fatto di ville fin de siècle si apre al grande pubblico con iniziative artistiche e rievocazioni storiche.
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
AVVISO PER LA CONCESSIONE DI AIUTI PER LA REALIZZAZIONE DI CORNER ESPOSITIVI E VETRINE VIRTUALI DESTINATI ALLA PROMOZIONE DEI PRODOTTI
UNIONE EUROPEA REPUBBLICA ITALIANA ASSESSORADU DE SU TURISMU, ARTESANIA E CUMMÈRTZIU ASSESSORATO DEL TURISMO, ARTIGIANATO E COMMERCIO PO FESR Sardegna 2007 2013 Competitività regionale e occupazione Asse
Politecnico di Milano Facoltà del Design Bovisa. Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione
CSS in pratica Politecnico Facoltà del Design Bovisa Prof. Gianpaolo Cugola Dipartimento di Elettronica e Informazione cugola@elet.polimi.it http://home.dei.polimi.it/cugola CSS & HTML 1/4 Quattro modi
CSS / CASCADING STYLE SHEETS. INFORMATICA E GRAFICA PER IL WEB HTML+CSS docente: Alessandro Gabbiadini 1
CSS / CASCADING STYLE SHEETS INFORMATICA E GRAFICA PER IL WEB HTML+CSS docente: Alessandro Gabbiadini 1 INFORMAZIONE: CONTENUTO + PRESENTAZIONE Lo scopo di una pagina web è la trasmissione di un informazione.
CONCEPT TARGET MATERIALI
itaeventi.it è il portale che ha lo scopo di supportare il magazine ITAeventi, il mensile free press ricco di contenuti relativi ai principali eventi legati all arte, al design, alla musica, allo sport
Teorie del Re-cycle _ Call for Position. MEMORABILIA Nel paese delle ultime cose
Teorie del Re-cycle _ Call for Position Nel paese delle ultime cose Nel paese delle ultime cose Call for position È indetta una call for position aperta a tutti gli interessati interni ed esterni alla
Pieghevole A4-2 ante. Pieghevole A4-3 ante pag. 4-5. Pieghevole A4 - piega a croce pag. 6-7. pag. 2-3 1 FRONTE 1 FRONTE FRONTE
Pieghevole A - 2 ante pag. 2- Pieghevole A - ante pag. - Pieghevole A - piega a croce pag. 6- RETRO Pieghevole A - 2 ante Se il lavoro è certificato Nei lavori certificati è necessario lasciare uno spazio
Primi elementi di... Cascading Style Sheet (o Fogli di Stile)
ISIS Giordano Bruno - BUDRIO Primi elementi di... Cascading Style Sheet (o Fogli di Stile) Lezioni del Prof. Gianluigi Roveda Caratteristiche dei Fogli di Stile Divide la descrizione del contenuto del
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
Introduzione ai Cascading Style Sheets
Introduzione ai Cascading Style Sheets Università di Pisa pievatolo@dsp.unipi.it 6 aprile 2014 Sommario 1 2 CSS esterni CSS interni CSS inline 3 4 Confondere fra struttura e presentazione Il mega
CSS: CASCADING STYLE SHEETS MODULO 8
CSS: CASCADING STYLE SHEETS MODULO 8 CSS È il linguaggio standard per la stilizzazione di documenti HTML Assolve al compito di informare il browser circa l'aspetto da conferire ai vari tag presenti nel
CSS Layout delle pagine
Laboratorio di Tecnologie Web CSS Layout delle pagine Dott. Stefano Burigat www.dimi.uniud.it/burigat Strategie di layout Esistono diverse strategie per definire il layout generale delle pagine web: Layout
CSS 1. CSS - Cascading Style Sheets. Introduzione a CSS: Cascading Style Sheets
CSS 1 Introduzione a CSS: Cascading Style Sheets CSS - Cascading Style Sheets! Lo stile definisce le regole che guidano il browser nella visualizzazione del contenuto di un tag suggerisce come posizionare,
CSS 2. I selettori e le classi
CSS 2 I selettori e le classi Tipi di selettori Selettore generale Selettori tipo (quelli singoli) Selettori di gruppo (raggruppamento) Selettori contestuali Selettori figli Selettori fratelli adiacenti
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
Incontro con Associazioni di Categoria, Collegio dei Periti e Ordine degli Ingegneri
Incontro con Associazioni di Categoria, Collegio dei Periti e Ordine degli Ingegneri Palazzo Lombardia 18 settembre 2014 Regione Lombardia Direzione i Generale Ambiente, Energia e Sviluppo Sostenibile
Comune di Brescia. Manuale di identità visiva
Comune di Brescia Manuale di identità visiva Indice Lo stemma comunale Lo stemma del Comune di Brescia Varianti Restyling Lo stemma araldico Il nuovo stemma Le regole d uso Font e logotipo Distanza stemma-logo
Corso di Informatica
Corso di Informatica Modulo L2 1.1-Concetti generali 1 Prerequisiti Conoscenza di base del linguaggio HTML 2 1 Introduzione In questa Unità si inizia a presentare la tecnologia CSS, un evoluzione del codice
Alcune definizioni HTML CSS. Introduzione a HTML. November 13, HTML+CSS+Javascript
Introduzione a November 13, 2016 ++Javascript Outline 1 2 3 ++Javascript Internet vs Web Internet : rete fisica di dispositivi interconnessi. (ARPANET 1970) Web : applicativo di alto livello relativo a
I tifosi di calcio in Italia Squadre di Serie A
I tifosi di calcio in Italia Squadre di Serie A Campionato 2009-2010 e dati storici dal 2004-05 (Questo rapporto, con molti dati assenti o camuffati, è diffuso a puro titolo esemplificativo di cosa contiene
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
B. Stampati per corrispondenza
B. Stampati per corrispondenza Indice Premessa Linea operativa 01 Carta intestata Camere di Commercio 02 Carta intestata con specifica 03 Carta intestata Unioni Regionali 04 Carta intestata Aziende Speciali
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
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
RDL Lighting System. Catalogo Prodotti
Catalogo Prodotti RDL Lighting System. Catalogo Prodotti RDL Lighting System. Catalogo Prodotti Minigonna 7 Minigonna Applique 7 Fantasy 7 Edith 7 Laetitia 7 Sfera 7 Zoe 7 Christelle 7 Ingot 7 Brigitte
ABCDEF GHIJKLM NOPQR STUVWX YZ
USI Elementi 2 dell identità istituzionale Light nelle versioni light e è il carattere istituzionale utilizzato per materiali stampati professionali. ABCDEF GHIJKLM NOPQR STUVWX YZ 0123456 789 USI Elementi
Laboratorio di Informatica (Chimica)
Laboratorio di Informatica (Chimica) HTML: Cascading Style Sheet (CSS). Walter Cazzola Dipartimento di Informatica e Comunicazione Università à degli Studi di Milano. e-mail: cazzola@dico.unimi.it Walter
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
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
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
CORSO DI HTML E CSS CORSO PER LA REALIZZAZIONE DI SITI WEB CON WORDPRESS. ARGOMENTI BASE DEL CORSO
CORSO DI HTML E CSS CORSO PER LA REALIZZAZIONE DI SITI WEB CON WORDPRESS. Grazie al corso di HTML e CSS IkonArt Academy potrai gestire gli elementi che regolano l'impaginazione dei contenuti (HTML) e l'aspetto
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
Comunicare un progetto
Comunicare un progetto Gli elaborati Studio degli artefatti Tavole dei Maestri A5 - artefatti A2 - Maestri 2 Gli elaborati Studio degli artefatti Tavole dei Maestri A5 - artefatti A2 - Maestri 3 Le regole
Centro Informazioni turisti
11/01/2016 09:39:16 Generale Nome sondaggio Centro Informazioni turisti Autore Richard Žižka Lingua Italiano URL Sondaggio http://www.survio.com/survey/d/v5o1a2q6h2p6a4c6a Prima risposta 28/02/2014 Ultima
I nuovi libretti di impianto. G. Galeotti APAVE ITALIA CPM Divisione Fgas
I nuovi libretti di impianto G. Galeotti APAVE ITALIA CPM Divisione Fgas In Lombardia Nella seduta del 20/12/2013 la Lombardia ha approvato la DELIBERAZIONE N X / 1118 «AGGIORNAMENTO DELLE DISPOSIZIONI
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 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
Dispensa CSS (estratto da HTML.it)
Dispensa CSS (estratto da HTML.it) Separare il layout dal contenuto L'HTML in origine è nato come linguaggio per formattare i documenti presenti sul Web. Proprio per questo motivo il contenuto (ad esempio
I fogli di stile (CSS)
I fogli di stile () in poche pagine 1 Cascading Style Sheets (Fogli Di Stile) I Cascading Style Sheets () rappresentano un metodo semplice ma potente per definire l aspetto dei documenti HTML. Essi descrivono
L oggetto libro Osservare, analizzare, ricostruire. Verso il workbook
L oggetto libro Osservare, analizzare, ricostruire Verso il workbook DIPARTIMENTO DI ARCHITETTURA / UNIFE Corso di laurea in Design del Prodotto industriale Laboratorio di Design della Comunicazione Proff.
CSS 1. Introduzione a CSS: Cascading Style Sheets
CSS 1 Introduzione a CSS: Cascading Style Sheets CSS CSS è l acronimo di Cascading Style Sheets Fogli di stile in cascata Un foglio di stile specifica come un browser deve posizionare, formattare e visualizzare
CSS Cascading Style Sheet Parte 2 (b)
CSS Cascading Style Sheet Parte 2 (b) Dr. Ing. Information Management Systems (IMS) Research Group, Dipartimento di Ingegneria dell Informazione, Università degli Studi di Padova {silvello}@dei.unipd.it
OBIETTIVI MINIMI Anno scolastico TIC-TIT. 1. Foglio elettronico: funzioni fondamentali (Excel)
ISTITUTO TECNICO COMMERCIALE STATALE SCHIAPARELLI-GRAMSCI CLASSI CORSI OBIETTIVI MINIMI Anno scolastico 2010-2011 TIC-TIT OBIETTIVI 1. Foglio elettronico: funzioni fondamentali (Excel) CONTENUTI / tipologia
Il sottoscritto... nato a... il... documento d identità... in qualità di... dell Associazione Sportiva / Ente / Impresa.. con sede in... indirizzo...
1 ALLEGATO 2 FAC-SIMILE DI OFFERTA TECNICA CENTRO POLISPORTIVO TERRACHINI Spett. le Fondazione per lo Sport del Comune di Reggio Emilia Via F.lli Manfredi n. 12/d Reggio Emilia Il sottoscritto....... nato
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
Progettazione di siti web a.a. 2015/16
HTML e stili Progettazione di siti web a.a. 2015/16 Fogli di stile: introduzione Maria Simi Marzo, 2016 [Learning web design,, J. Niederst Manuale di riferimento del W3C] All'inizio del web solo annotazioni
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 sottoscritto... nato a... il... documento d identità... in qualità di... con sede in... indirizzo... partita I.V.A. n... cod. fiscale...
ALLEGATO 2 FAC-SIMILE DI OFFERTA TECNICO-GESTIONALE Spett. le Fondazione per lo Sport del Comune di Reggio Emilia Via F.lli Manfredi n. 12/d Reggio Emilia Il sottoscritto....... nato a....... il.... documento
Il Gusto per lo Stile. Il Gusto per lo Stile
Il Gusto per lo Stile Il trattato di Palladio è stato fino ad oggi un modello classico insuperato per comporre con precise regole formali e proporzionali. Queste proporzioni permettono di attribuire ai
Esercitazione L A TEX. versione giugno 2012, ore 17:10
Esercitazione L A TEX versione 1.0 19 giugno 2012, ore 17:10 Indice 5 Note 7 Capitolo I Comandi bigskip, medskip, smallskip, vspace, hspace, vfill, hfill 1.1. bigskip, medskip, smallskip, 7 1.2. hspace,
Laboratorio di Tecnologie Web CSS: Introduzione Dott. Stefano Burigat
Laboratorio di Tecnologie Web CSS: Introduzione Dott. Stefano Burigat www.dimi.uniud.it/burigat Cascading Style Sheets (CSS) è uno standard W3C che definisce gli aspetti di presentazione dei documenti