Stile ed effetti su testo: Altri attributi

Cascade style sheets
di Risorse.net

Tutti gli attributi e gli esempi che vi abbiamo appena mostrato, sono utilizzabili su tutto un documento (Css incorporati) o su un intero sito Web (Css esterni). Alcuni attributi pero', e consigliabile applicarli solo ad alcune porzioni di testo racchiuse in un certo tag (Css in linea).
Per esempio, l'attributo text-transform, a seconda del valore che assume, puo' rendere maisucole tutte le lettere del testo, oppure solo le prime di ogni parola o ancora tutte minuscole.
Naturalmente, un attributo di questo genere non e' utilizzabile in un intero sito web, perche' ci potrebbe sempre essere la necessita' di utilizzare o meno una lettera maiuscola. Potrebbe pero' risultare utile nel caso in cui si avesse la necessita' di avere un blocco di testo maiuscolo, anche solo per evidenziarlo dal resto della pagina.
Vediamo dunque di analizzare questi restanti attributi per il testo.

Text transformation
Come abbiamo detto prima, varia i caps di un blocco di testo. I valori che puo' assumere sono:
  • lowercase tutte le lettere minuscole.

  • capitalize diventano maiuscole le iniziali di ogni parola.

  • uppercase tutte le lettere maiuscole.

  • none (default).
    Per Esempio:
    <P STYLE="font-family:tahoma; text-transform:capitalize">

    Text identation
    Il rientro, espresso in em o in pollici, che deve essere presente prima della parola che inizia il testo. I possibili valori sono:

  • unita' di misura come pollici, centimetri ecc.

  • percentuale Per esempio:
    <P STYLE="font-family:tahoma; text-ident:10em">

    Text align
    Praticamente, rappresenta il normale allineamento presente anche in Html comune. I valori quindi variano tra:

  • center centro.

  • right destra.

  • left sinistra.

  • justify giustificato.
    Per esempio:
    <P STYLE="font-family:tahoma; text-align:right">

    Letter spacing
    Lo spazio che deve esserci tra una lettera e la seguente. Puo' assumere anche valori negativi. I valori che puo' assumere sono:

  • normal (default)

  • unita' di misura come pixel, ex ecc.
    Ecco un esempio:
    <P STYLE="font-family:tahoma; letter-spacing:3em">

    Word spacing
    Lo spazio che deve esserci tra una parola e la seguente. Puo' assumere anche valori negativi. I valori che puo' assumere sono:

  • normal (default)

  • unita' di misura come pixel, ex ecc.
    Ecco un esempio:
    <P STYLE="font-family:tahoma; word-spacing:3em">

    Line height
    E' lo spazio espresso in em o in percentuale tra un'interlinea e l'altra. I valori sono:

  • un numero moltiplicato per la dimensione del font. In questo modo si otterra' l'interlinea.

  • normal (default). Un valore che cambia a seconda della dimensione del font.

  • Unita' di misura come em, centimetri ecc.

  • Percentuale e non sono ammessi valori negativi.
    Per esempio:
    <P STYLE="font-family:tahoma; line-height:1em">

    Vertical align
    Modifica l'allineamento verticale di un oggetto rispetto al suo precedente. I valori sono:

  • baseline (default)

  • top

  • super

  • bottom

  • middle

  • text-top

  • sub

  • text-bottom

  • percentuale Calcolata in base al valore della proprieta' line-height. Sono accettati valori negativi.
    Per esempio:
    img { vertical-align: bottom }

    <- Pagina precedente
    Clicca per tornare alla seconda parte dell'articolo


    © Risorse.net (www.risorse.net)
    pagina in versione stampabile:
    http://www.risorse.net /css/testolink3css.asp?print=ok