Risorse per webmaster

L A   C O M U N I T À   V I R T U A L E   I T A L I A N A   P E R   W E B   M A S T E R S

 
 
      Tecnologie
      HTML
      CSS
      DHTML
      FLASH
      ASP
      PHP
      JSP
      PERL
      XML
      SMIL
      WIRELESS
      PALMARI
      APACHE
      MYSQL
      PICOSQL
 
      Grafica
 
      Servizi
 
      Raccolte
 
      Recensioni
 
      Analisi
 
      Disclaimer

   Per tutti
 
  .: Magazine
  .: Editor
  .: Appunti
  .: Gratis
  .: Scripts
  .: Components
 
   Home page

Partner
Comunicati stampa
Proposte di viaggio
Prenotazione hotel
Prenota vacanze
Accessori palmari
Cerca alberghi
Guide turistiche

versione stampabile Mostra una versione adatta per la stampa  

Livello di difficoltà:Livello di difficoltà: basso  
I Css, Cascade style sheets, che in italiano significa fogli di stile a cascata, sono una tecnologia per migliorare le proprie pagine Web. Sono stati implementati dal W3 Consorzium nella quarta versione di Html.
 

Specificare una linea grafica uniforme al sito

Cascade style sheets
Come si spiegava nel passo dedicato ai background, il layout di un sito puo' risultare un punto essenziale per la realizzazione di un sito veramente professionale. I Css, possono aiutare i webmasters in tutto cio':

Right margin
Imposta il margine destro di un certo elemento. Se espresso in percentuale esso viene calcolato rispetto alla larghezza dell'elemento superiore. Sono ammessi anche valori negativi.
p { margin-right: 20% }

Left margin
Definisce il margine sinistro di un certo elemento. Se espresso in percentuale esso viene calcolato rispetto alla larghezza dell'elemento superiore. Sono ammessi anche valori negativi.
p { margin-left: 30% }

Top margin
Specifica il margine superiore di un certo elemento. Se espresso in percentuale esso viene calcolato rispetto alla larghezza dell'elemento superiore. Sono ammessi anche valori negativi.
p { margin-top: 40% }

Bottom margin
Attribuisce il margine inferiore a un certo elemento. Se espresso in percentuale esso viene calcolato rispetto alla larghezza dell'elemento superiore. Sono ammessi anche valori negativi.
p { margin-bottom: 10px }

Margin
Definisce tutti i margini di un elemento. Se espresso in percentuale esso viene calcolato rispetto alla larghezza dell'elemento superiore. Sono ammessi anche valori negativi.
Se specificati 4 valori, si intendono rispettivamente: il margine superiore, destro, inferiore, sinistro. Se ne vengono attribuiti solo 2 o 3, i valori omessi erediteranno il valore del lato a essi opposto. Se altresi' ne venisse indicato uno solo, tale valore varra' per tutti e quattro i lati.
p { margin: 5pt 7pt }

Right padding
Imposta lo spazio necessario tra il lato destro di una box e l'elemento in essa contenuta. In questo caso pero', non sono permessi valori negativi.
p { padding-right: 2ex }

Left padding
Definisce lo spazio necessario tra il lato sinistro di una box e l'elemento in essa contenuta. In questo caso pero', non sono permessi valori negativi.
p { padding-left: 5% }

Top padding
Definisce lo spazio necessario tra il lato superiore di una box e l'elemento in essa contenuta. In questo caso pero', non sono permessi valori negativi.
p { padding-top: 10em }

Bottom padding
Definisce lo spazio necessario tra il lato inferiore di una box e l'elemento in essa contenuta. In questo caso pero', non sono permessi valori negativi.
p { padding-bottom: 2px }

Padding
Definisce lo spazio necessario tra tutti i lati di una box e l'elemento in essa contenuta. In questo caso pero', non sono permessi valori negativi. Se specificati 4 valori, si intendono rispettivamente: il margine superiore, destro, inferiore, sinistro. Se ne vengono attribuiti solo 2 o 3, i valori omessi erediteranno il valore del lato a essi opposto. Se altresi' ne venisse indicato uno solo, tale valore varra' per tutti e quattro i lati.
p { padding: 2px 6px 4 px 5px }

Border left width
Imposta lo spessore del bordo sinistro. Non sono ammessi valori negativi. I valori che puo' assumere sono:
  • thin fine.

  • medium medio. (default)

  • thick grosso.

  • oppure altre unita' di misura come pixel, centimetri ecc.
    Per esempio:
    p { border-left-width: medium }

    Border right width
    Imposta lo spessore del bordo destro. Non sono ammessi valori negativi. I valori che puo' assumere sono:

  • thin fine.

  • medium medio. (default)

  • thick grosso.

  • oppure altre unita' di misura come pixel, centimetri ecc.
    Per esempio:
    p { border-right-width: thin }

    Border top width
    Definisce lo spessore del bordo superiore. Non sono ammessi valori negativi. I valori che puo' assumere sono:

  • thin fine.

  • medium medio. (default)

  • thick grosso.

  • oppure altre unita' di misura come pixel, centimetri ecc.
    Per esempio:
    p { border-left-width: thick }

    Border bottom width
    Stabilisce lo spessore del bordo inferiore. Non sono ammessi valori negativi. I valori che puo' assumere sono:

  • thin fine.

  • medium medio. (default)

  • thick grosso.

  • oppure altre unita' di misura come pixel, centimetri ecc.
    Per esempio:
    p { border-bottom-width: medium }

    Border width
    Imposta lo spessore di tutti i bordi. Non sono ammessi valori negativi. Se specificati 4 valori, si intendono rispettivamente: il margine superiore, destro, inferiore, sinistro. Se ne vengono attribuiti solo 2 o 3, i valori omessi erediteranno il valore del lato a essi opposto. Se altresi' ne venisse indicato uno solo, tale valore varra' per tutti e quattro i lati. I valori che puo' assumere sono:

  • thin fine.

  • medium medio.

  • thick grosso.

  • oppure altre unita' di misura come pixel, centimetri ecc.
    Per esempio:
    p { border-width: medium }

    Border left color
    Imposta il colore del bordo sinistro. Per esempio:
    p { border-left-color: yellow }

    Border right color
    Imposta il colore del bordo destro. Per esempio:
    p { border-right-color: black }

    Border top color
    Imposta il colore del bordo superiore. Per esempio:
    p { border-left-color: green }

    Border bottom color
    Imposta il colore del bordo inferiore. Per esempio:
    p { border-bottom-color: white }

    Border left style
    Imposta come il bordo sinistro che delimita la box deve essere visualizzato. I valori che puo' assumere sono:

  • none nessun bordo. (default)

  • dashed linea sfumata.

  • double linea doppia.

  • dotted linea tratteggiata.

  • solid linea continua.

  • ridge linea sporgente.

  • groove linea scavata.

  • ouset effetto 3D sporgente che utilizza i colori indicati dall'attributo color

  • inset effetto 3D scavato che utilizza i colori indicati dall'attributo color
    Per esempio:
    p { border-left-style: dashed }

    Border right style
    Specifica come il bordo destro che delimita la box deve essere visualizzato. I valori che puo' assumere sono:

  • none nessun bordo. (default)

  • dashed linea sfumata.

  • double linea doppia.

  • dotted linea tratteggiata.

  • solid linea continua.

  • ridge linea sporgente.

  • groove linea scavata.

  • ouset effetto 3D sporgente che utilizza i colori indicati dall'attributo color

  • inset effetto 3D scavato che utilizza i colori indicati dall'attributo color
    Per esempio:
    p { border-right-style: dashed }

    Border top style
    Imposta come il bordo superiore che delimita la box deve essere visualizzato. I valori che puo' assumere sono:

  • none nessun bordo. (default)

  • dashed linea sfumata.

  • double linea doppia.

  • dotted linea tratteggiata.

  • solid linea continua.

  • ridge linea sporgente.

  • groove linea scavata.

  • ouset effetto 3D sporgente che utilizza i colori indicati dall'attributo color

  • inset effetto 3D scavato che utilizza i colori indicati dall'attributo color
    Per esempio:
    p { border-top-style: dashed }

    Border style
    Definisce come tutti i bordi che delimitano la box devono essere visualizzati.
    Imposta lo spessore di tutti i bordi. Se specificati 4 valori, si intendono rispettivamente alla distanza del lato superiore, destro, inferiore, sinistro. Se ne vengono attribuiti solo 2 o 3, i valori omessi erediteranno il valore del lato a essi opposto. Se altresi' ne venisse indicato uno solo, tale valore varra' per tutti e quattro i lati I valori che puo' assumere sono:

  • none nessun bordo. (default)

  • dashed linea sfumata.

  • double linea doppia.

  • dotted linea tratteggiata.

  • solid linea continua.

  • ridge linea sporgente.

  • groove linea scavata.

  • ouset effetto 3D sporgente che utilizza i colori indicati dall'attributo color

  • inset effetto 3D scavato che utilizza i colori indicati dall'attributo color
    Per esempio:
    p { border-style: groove }

    Pagina successiva ->
    Clicca per proseguire nella lettura dell'articolo
  •  

     
     
    Home > css > ...   © 1999-2017 Risorse.net, tutti i diritti riservati