In questa lezione parleremo delle unità di misura. Scopriamo come indicare le principali misurazioni all’interno dei nostri fogli di stile.

(continua…)

Oggi parleremo di un argomento cruciale all’intermo dei fogli di stile, il selettore Class. Questo sellettore è utilissimo per semplificarsi il lavoro, e anche abbastanza facile da utilizzare.

(continua…)

Ecco come cambiare le  caratteristiche (colore, tipo di testo, ecc… ) dei nostri link grazie ai CSS. Un modo facile e veloce per iniziare a imparare a personalizzare.

(continua…)

In questi prossimi articoli parleremo dei vari tipi di selettori che sono disponibili. Non sapete che cosa è un selettore ? Allora vi tocca una ripassatina della lezione 6 : Struttura di una regola …

Un selettore può essere espresso in tantissimi modi diversi, tutti molto utilizzati nei CSS di oggi (altrimenti che li avrebbero inventati a fare, dopotutto?). Analizziamone alcuni :

• Il type seletor (selettore degli elementi)

E’ semplicemente costituito da un qualunque elemento di Html (compresa la nuova versione di xHTML di cui tra poco inizieremo una guida).

Ad esempio.                                h1 { color #000000 ;}                         che indica il colore del selettore h1

Inoltre, in questo tipo di selettore, è possibile raggruppare più selettori da loro, in modo da assottigliare di molto il codice risultante.

Ad esempio.                              h1, h2, h3 { colore #000000; }     indica il colore per h1, h2 e h3

• Universal selector (selettore universale)

Sta ad indicare che tutti i selettori sono soggetti a quel particolare cambiamento. Si indica semplicemente con un *

Ad esempio.             * { color: #000000 }      indica che tutti gli elementi, sono soggetti a questo particolare colore.

•  Descendant Selector (selettore di discendenza)

Sta ad indicare che tutti i discendenti dell’elemento che immettiamo (quindi tutti gli elementi contenuti nell’elemento) sono soggetti  a quella data modifica.

Ad esempio.                 div p {color: black;}            Indica che i discendenti di p (paragrafo), devono essere di colore nero.

Ora tocca ai commenti come nuovo argomento di discussione. Su di loro c’è poco da dire; quindi questa sarà una lezione piuttosto semplice …

(continua…)

I Css possono sembrare semplici ed infallibili, ma naturalmente non lo sono. Anche i fogli di stile, infatti, sono soggetti al problema della compatibilità. Ma entriamo nello specifico …

Il mondo dell’informatica è in continua evoluzione e aggiornamento. Ogni mese esce un nuovo browser, o la versione nuova di uno vecchio, e diventa difficile aggiornare il linguaggio CSS (e HTML) perchè segua questi aggiornamenti. E’ qui, dunque, che nasce il primo problema in assoluto: la compatibilità tra diversi browser.

I CSS sono testati per funzionare al massimo su IE, e quindi iniziano ad incorrere in difficoltà appena utilizziamo altri browser. Per esempio con l’uso di Mozilla.

In questo caso, tuttavia, utilizziamo una tecnica che viene comunemente definita cross-browser. Si tratta di elaborare strategie e di usare trucchetti in grado di preservare un minimo di compatibilità con il passato senza rinunciare ai vantaggi dei CSS per i browser recenti. Essenzialmente, comunque, non si potrà mai fare a meno di costruire fogli di stile distinti, adatti rispettivamente ai nuovi e ai vecchi browser.

Un altro problema nel quale si potrebbe incorrere è quello della compatibilità dei dispositivi usati per visualizzare i Css.  Abbiamo però già descritto una soluzione a questo problema attraverso l’utilizzo dell’attributo media.

Oggi vedremo come scegliere tra due tipi di fogli di stile esterni, ampliando la spiegazione sull’attributo rel del tag link. Inoltre vedremo i pro e i contro di ciascun metodo …

(continua…)

Nell’articolo precedente abbiamo accennato all’attributo media. Ora tentiamo di capire qualcosa di più sul suo utilizzo …

(continua…)