La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

HTML Lezione 3 Stili. Lo stile Lo stile è linsieme delle caratteristiche grafiche con le quali un elemento viene tracciato sulla pagina. Gli stili indicano.

Presentazioni simili


Presentazione sul tema: "HTML Lezione 3 Stili. Lo stile Lo stile è linsieme delle caratteristiche grafiche con le quali un elemento viene tracciato sulla pagina. Gli stili indicano."— Transcript della presentazione:

1 HTML Lezione 3 Stili

2 Lo stile Lo stile è linsieme delle caratteristiche grafiche con le quali un elemento viene tracciato sulla pagina. Gli stili indicano al browser i colori dello sfondo e del testo, il tipo di font, le dimensioni del font, lallineamento nella pagina, linterlinea, ecc. Se non viene indicato nessuno stile, il browser traccia lelemento con degli stili predefiniti. Ad esempio, un paragrafo viene tracciato con il testo nero su sfondo bianco, allineato a sinistra e con font Times New Roman di dimensione 12px.

3 Attributi di un elemento Ogni elemento HTML ha delle proprietà (dette attributi), alle quali HTML ha dato un nome e alle quali lo sviluppatore assegna un valore Il valore di una proprietà può essere un numero, una misura, una parola specifica del linguaggio, un codice di colore, etc. In HTML le proprietà di un elemento vengono scritte allinterno del tag iniziale dellelemento con la sintassi nome="valore"

4 Esempio di attributo Ad esempio nella sintassi testo tracciato al centro lattributo align (allineamento) riceve il valore center, il che significa che si dice al browser di tracciare il testo del paragrafo centrato orizzontalmente nella pagina Se non viene specificato nulla, lattributo align assume il valore left (a sinistra) Altri valori sono right (a destra) e justify (giustificato)

5 HTML e lo stile HTML è semplice ma non dà molte possibilità riguardo lo stile per gli elementi Per il testo, ad esempio, HTML ha lelemento FONT che permette di scegliere il tipo di carattere, la dimensione del font (ma solo tra sette dimensioni!!) ed il colore del testo Questo elemento è oggi deprecato dalle specifiche ufficiali dellHTML, nel senso che viene suggerito di non usarlo più e di sostituirlo con gli stili CSS.

6 Esempio per lelemento FONT Esempio testo del paragrafo Lattributo face riceve come valore il tipo di font Lattributo size riceve come valore un numero che va da 1 a 7 Lattributo color riceve come valore o un nome di colore o un codice di colore Come viene tracciato nel browser (è confrontato con un paragrafo senza font)

7 Gli stili CSS Nel 1996 il W3C (il consorzio ) introdusse un nuovo sistema per lo stile degli elementi, da affiancare allHTML, invitando gli sviluppatori a non usare più lHTML per lo stile degli elementi Il nuovo sistema di istruzioni si chiama CSS (Cascading Style Sheets = Fogli di Stile a Cascata) Fogli: gli stili possono anche essere scritti in file di testo esterni alla pagina HTML e chiamati dalla pagina A cascata: lo stile di un elemento viene scritto o per lelemento stesso o per gli elementi che lo contengono secondo delle precise regole di ereditarietà

8 Le versioni CSS La prima specifica ufficiale di CSS (CSS1) risale al dicembre del Nel maggio 1998 è stata la volta della seconda versione: CSS2 che consisteva di molte aggiunte rispetto alla prima. E' attualmente allo stato di studio la nuova specifica CSS3. Il perché del ritardo del rilascio di nuove versioni è dovuto al fatto che i produttori di browser non si accordano sugli standard (occorrerebbe fare in modo che tutti i browser interpretassero le istruzioni di una pagina web nello stesso modo e che la pagina web venisse resa uguale in tutti browser)

9 Inserire gli stili CSS Gli stili possono essere inseriti in tre modi –In linea o locali, nel singolo elemento, quando si desidera applicare lo stile a quellelemento –Interni, scritti nellintestazione (elemento HEAD) della pagina HTML, quando si desidera applicare a tutti gli elementi della pagina –Esterni, cioè scritti in un altro file di testo, che viene acquisito dalla pagina web; questo metodo è il più usato per i siti web, perché lo stesso stile può essere utilizzato per centinaia di pagine con una sola istruzione.

10 Stili locali Per applicare uno stile in un elemento HTML: –Digitare style= allinterno del tag iniziale dellelemento –Scrivere le varie regole con la sintassi proprietà:valore; proprietà:valore; …. –Digitare le virgolette finali

11 Esempio di stili locali Stile in un paragrafo testo del paragrafo Il nome delle proprietà usate è stato scelto dai programmatori in modo semplice ed evidente (solo che sono in inglese!) ed anche il valore da assegnare è abbastanza intuitivo (la famiglia è il nome del tipo di carattere, size è il numero e lunità di misura e color è il codice di un colore) Leffetto che si ottiene


Scaricare ppt "HTML Lezione 3 Stili. Lo stile Lo stile è linsieme delle caratteristiche grafiche con le quali un elemento viene tracciato sulla pagina. Gli stili indicano."

Presentazioni simili


Annunci Google