Guide Css

/* CSS */
.divguida h1 {color:blue; display:inline;}

.divguida {text-align:left; padding: 1.5em; border: 3px solid black; font-family
: arial; font-size: 9pt;}
.divguida a:link, .divguida a:visited {color:blue;}

<center><div class="divguida">
<h1>Lezione N.1 "Introduzione ai CSS"</h1>
<hr>
Ecco come promesso la guida ai "<i><b>C</b>ascading <b>S</b>tyle <b>S</b>heets</
i>",(fogli di stile a cascata).
Il CSS un linguaggio molto diverso dall'html,infatti i codici css <b>non creano
nuovi elementi</b>,ma modificano lo stile degli elementi creati con i tag html.
Noi ci siamo gi avvicinati alla modifica dello stile degli elementi html,ma in mo
do "erroneo",infatti s possibile formattare il testo (per esempio) con i tag html
,ma anche vero che ci <b>deprecato dal w3c</b>.
Attualmente siamo alla specifica CSS2,ma da tempo in elaborazione la specifica C
SS3,di cui parleremo nelle ultime lezioni,che introduce nuove e utilissime funzi
oni e facilit il compito del web-master.
Nella prossima lezione impareremo come introdurre in un documento html i CSS.
<hr>
<p align="center">[size=2] Guida creata per [URL=http://thebigworld.blogfree.net
]The Big World[/URL],vietata la copia senza link alla fonte,per il codice contat
tatemi ([URL=?act=Msg&CODE=4&MID=2872324]FC[/URL] - [URL=http://blogfree.net/?ac
t=Msg&CODE=4&MID=45294]BF[/URL] - [URL=http://forumfree.it/?act=Msg&CODE=4&MID=3
439643]FF[/URL]).[/size]</p></div>

<h1>Lezione N.2 "Introdurre i CSS in un documento HTML"</h1>
<hr>
Vi sono due diversi modi per inegrare i CSS in un documento:
<ul type="circle">
<li>Introdurre direttamente le regole css (l'equivalente dei teg html) nella sez
ione head,scrivendoli tra il tag <style> e la sua chiusura.</li>
<li>Scrivere le regole in un foglio esterno,usando poi un tag per inserirli nel
nostro documento html.</li></ul>
Personalmente preferisco la seconda opzione,in quanto fa pesare meno il document
o,ma esistono casi in cui necessario introdurli direttamente.
Vediamo un esempio di introduzione "diretta":
[CODE]
<html>
<head>
<title>Prova</title>
<style type="text/css">

</style>
</head>
...
</html>[/CODE]
Da notare l'attributo <b>style</b> e il suo valore.
Invece se vogliamo includere da un documento esterno il css dovremo inanzitutto
col blocco note creare un documento con scritte le regole css e salvarlo con l'e
stensione "<i>.css</i>",dopodiche avremo due metodi a nostra disposizione,vediam
o i due esempi:
[CODE]
<html>
<head>
<style type="text/css">
@import url(stili.css)
</style>
</head>
...
</html>[/CODE]
(Naturalmente al posto di stili.css andr inserito il nome del vostro documento sa
lvato in estensione .css)
<u>Oppure:</u>
[CODE]
<html>
<head>
<link rel="stylesheet" type="text/css" src="stili.css">
</head>
...
</html>[/CODE]
Da notare che non serve il tag style nel secondo caso.
L'attributo <i>rel</i> ha anche altri valori che per ora non ci serviranno.
Nella prossima lezione vedremo come composta una "regola" CSS.
<hr>
439643]FF[/URL]).[/size]</p></div>

<h1>Lezione N.3 "Struttura di una regola CSS"</h1>
<hr>
In questa lezione impareremo finalmente come composta una regola dei fogli di st
ile.
Ora vi scriver una casuale regola e andremo analizzandola insieme:
[size=5]<b>[color=blue]p[/color] {[color=red]color[/color]:[color=purple]#000000
[/color];}</b>[/size]
<ul type="circle">
<li>La scritta "p",in blu,si chiama <b>selettore</b>,infatti seleziona,nel nostr
o caso <u>tutti gli elementi p</u>(ossia paragrafi)</li>
<li>La parte di regola contenuta tra le due parentesi graffe il <b>blocco della
dichiarazione</b>,e si divide al suo interno in:
<ul type="circle>
<li><b>propriet</b>,nel nostro esempio la scritta in rosso "color"</li>
<li><b>valore</b>,nel nostro esempio il valore in porpora "#000000"</li>
</ul>
</li></ul>
Cosa otterremmo se mettessimo questa regola in un documento?
<b>Tutti i paragrafi avrebbero il testo color nero.</b>
Infatti la propriet color serve a cambiare il colore del testo contenuto dai sele
ttori,e il valore esadecimale #000000 indica il nero.
Da notare che la coppia propriet-valore separata dai due punti e alla fine di ogn
una di essa andr messo il punto e virgola.
Molto importante sapere che per ogni selettore possono essere messi pi di una pro
priet e il relativo valore,sempre separandolo da altre coppie con un punto e virg
ola.
Inoltre se vogliamo che due selettori abbiano lo stesso stile possiamo inserirne
due nella stessa regola,anziche scrivere due regole,separando i due o pi seletto
ri con una semplice virgola.
Vediamo un esempio che chiarir il tutto:
div , p {color:#000000;background:#FFFFFF;}
Quindi sia per i div che per i paragrafi avremo il testo nero e un colore di sfo
ndo bianco(non preoccupatevi se non capite a cosa si riferiscono le varie propri
et,le studieremo nelle prossime lezioni).
<hr>
439643]FF[/URL]).[/size]</p></div>

Guide Css

Caricato da

Informazioni sul documento

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Guide Css

Caricato da

Copyright:

Formati disponibili

/* CSS */

.divguida h1 {color:blue; display:inline;}

Potrebbero piacerti anche