Applicare uno stile

Css con Front Page
La sintassi
Creare un foglio
Applicare uno stile
Le classi
Gli elenchi
I moduli
I puntatori
Css in linea
Sfondi
Testo
Selettori
Links
Margini e bordi
Fonts
Le tabelle
Le immagini e i piani

Modificare uno stile

Css con FP

Applichiamo lo stile

Torniamo nella visualizzazione pagina (o anche struttura) e procediamo come segue:

colleghiamo tutte le pagine allo stile neon selezionando il file neon.css dal menu aggiungi

confermiamo e andiamo a vedere cosa abbiamo fatto.

Modifiche

Dicevamo che per modificare lo stile dobbiamo agire sul foglio di stile. Vediamo due cose che vi torneranno utili: i tag H sono i tag che front page chiama titoli, titolo 1, titolo 2 ... etc e che word chiama primo livello, secondo livello. Il tag body è importantissimo; si tratta dello scritto della pagina ma ciò che è più importante è che per quasi tutti i tag potete anche stabilire lo sfondo dietro le scritte. Se avete colto l’importanza di ciò avrete anche capito che posso definire parte dello sfondo della pagina semplicemente agendo sullo sfondo del tag body. Per capirci facciamolo: stile/ selezionate il tag body e cliccate su modifica/formato/bordi/sfondo. Avete un colore di sfondo che riferisce al colore dietro al testo e un colore primo piano che vuol dire il colore che assume il testo (il testo all’interno del body, il corpo pagina). Modificateli a vostro piacimento e controllate i cambiamenti.

Una doccia fredda

Non penserete mica che sia tutto così semplice? Un conto è creare ed applicare un foglio di stile, altro è padroneggiarli. Cascade Style Sheet: si chiamano così perchè le regole che li governano sono "a cascata" cioè ci sono cose più importanti ed altre meno importanti. Noterete subito che se applico uno stile al tag <body> questo stile sarà "invasivo" nei confronti della maggior parte degli altri tag. Questo è un ottimo motivo per definire il meno possibile nei colori il tag <body> e, invece, aggiungere le classi. Spero di aver fatto capire il problema, guardatevi il foglio di stile che avete creato, c'è una gerarchia, le impostazioni date in alto vengono seguite dai tag che stanno più in basso ... d'altro lato ci sono tag che vanno definiti per primi ed altri che possono seguire. I fogli di stile migliori (più complessi) hanno i tag base poco definiti e, invece, molte classi ben definite nei particolari.

Aggiungere tag

Credo abbiate già notato che nella finestra stile ci sia un menù a discesa stili definiti dall’utente/tag html, questi ultimi possono essere selezionati e aggiunti, ovviamente bisogna avere qualche nozione di html oppure cliccare a caso e impararseli.

Aggiungiamone uno di cui non sono più capace di fare a meno:

a:hover {color: #000000;background-color:#FFFFCC}

hover è il commando che definisce il comportamento del link al passaggio del mouse, per evidenziare il link mi piace, non solo che questo cambi colore, ma che cambi colore anche lo sfondo. In questo modo ottengo una sorta di pulsante che vale sia per le barre dei collegamenti sia per i link che si trovano all’interno della pagina.