Css con Front Page

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

Css con FP

Introduzione

Questa guida è breve e non vuol essere in alcun modo esaustiva, pone semplicemente in risalto il fatto che si possano creare dei fogli di stile con FrontPage e che i fogli di stile hanno una loro utilità per alcuni tipi di siti. Alla fine di questa guida sarete in grado di creare un foglio di stile e applicarlo al vostro sito. Per apprezzare maggiormente questo tipo di contenuti è necessaria una certa preparazione sugli argomenti che riguardano il web (html soprattutto) e una certa infarinatura sull’uso di FrontPage, l’editor visuale più famoso di casa Microsoft. In ogni caso cercherò di scrivere nella maniera più semplice ed intuitiva possibile, anche se non proprio rigorosa, in modo che tutti possano seguirmi.

1.1 Cosa sono

In inglese si chiamano css (cascade style sheet), in italiano li chiamiamo fogli di stile. I fogli di stile possono essere incorporati nel codice della pagina oppure esterni. In questa breve guida non ci occuperemo della teoria dei css, ma vedremo come creare un foglio di stile esterno con FrontPage e applicarlo alle pagine. Prima di iniziare mi sembra giusto però ricordare perché i migliori siti usano i fogli di stile. Il motivo sostanziale consiste nel fatto che è un metodo per dividere la grafica dai contenuti, questo significa che i siti che devono essere aggiornati spesso fanno uso di fogli di stile consentendo un aggiornamento rapido e sempre preciso: il foglio di stile si occuperà di impaginare, colorare il contenuto che viene inserito a parte. La velocità di aggiornamento grafico di un sito che ha molte pagine è compiuta con la sola modifica dei fogli di stile, le pagine ad esso collegate cambieranno aspetto di conseguenza.

Che cos’è il foglio di stile? Si tratta di una o più pagine che hanno estensione .css e si occupano di fornire informazioni alle pagine web che le richiamano. Css è uno degli standard elaborati dal w3c per controllare la formattazione grafica delle pagine web. Per quanto detto finora ne viene fuori che potremmo anche aprire il notepad di windows, scrivere il codice, salvare con estensione css e linkare le pagine web al foglio di stile. Allo stesso modo potremmo aprire una pagina web con il notepad e collegarla ad un foglio di stile.

Il collegamento al foglio di stile va inserito tra i tag <head> </head> della pagina web, meglio se sotto il tag title ed è una cosa del genere:

questa scrittura significa che la pagina web si trova in una cartella diversa da quella in cui si trova il foglio di stile: il foglio di stile si chiama stile.css e si trova nella sottocartella "mircoweb". Il collegamento deve essere sempre preciso, se fosse stata la pagina web a trovarsi in una sottocartella avrei dovuto indicare un percorso "a salire" e avrei scritto

che vuol dire: sali di una cartella e cerca stile.css, se il foglio di stile si fosse trovato due cartelle sopra avrei dovuto scrivere

allo stesso modo se il foglio si trova in una cartella diversa o addirittura in un altro web (un altro sito internet) dovrei indicare l’esatto percorso internet.

Questo codice può essere scritto in maniera visuale con FrontPage andando nel menu "formato" e selezionando "collegamento al foglio di stile", ovvio che in questo caso il foglio di stile dovrà già essere stato compilato.

Se volete scaricarvi il mio foglio di stile per dare un'occhiata e non partire da zero potete farlo: (dx del mouse, salva oggetto)

http://www.mircoweb.altervista.org/stile.css

Se avete un editor configurato per i fogli di stile (tipo FrontPage) vi si dovrebbe aprire cliccandoci sopra con il sx del mouse, altrimenti potete modificarlo con il blocco note di windows.

Il mio foglio di stile è abbastanza semplice: è formato da uno stile per il body, qualche informazione per i colori dei link, alcune classi che vengono applicate ai bordi ... tutto qui.

Abbiamo imparato come si collega una pagina ad un css, direi che siamo pronti per creare il nostro primo foglio di stile con FrontPage