CSS - 4 - Controlant el text

Color

• color: red;


• color: #ff0000;


• color: #f00;


• color: rgb(255,0,0);

Sangria. Serveix per indicar quan volem que es fiqui la primera línia.

• text-indent:20px;


• text-indent:5%;

Decoració

• text-decoration: underline; (subratlla).


• text-decoration: overline; (posa una ratlla per sobre).


• text-decoration: line-through; (tatxa).


• text-decoration: blink; (text intermitent)


• text-decoration: none; (Sense decoració. Precísament això ho aplicarem als links sempre i quan no volguem que es subratllin).

Transformació

• text-transform: capitalize; (converteix en majúscula el primer caràcter)


• text-transform: uppercase; (converteix en majúscula tots els caràcters)


• text-transform: lowercase; (converteix en minúscula el primer caràcter)


• text-transform: none; (deixa tots els caràcters tal i com estàn)

Espai entre caràcters

• letter-spacing:20px; (separa les lletres).

Espai entre paraules

• word-spacing:20px; (separa les paraules).

Espai en blanc. Serveix per preservar o no els espais en blanc de forma similar a lo que ja feia la etiqueta PRE en HTML

• white-space:pre; (preserva espais múltiples i retorns de carro).


• white-space:nowrap; (impedeix l'ajust irregular de línia).


• white-space:normal; (el que faci per defecte el navegador).

Interliniat.

• line-height:2; (indica que la separació entre línies sigui el doble que la mida dels caràcters d'aquella línia)


• line-height:20px;


• line-height:200%;

Alniació horitzontal respecte a l'espai en que es troba.

• text-align: left;


• text-align: center;


• text-align: right;


• text-align: justify;

Aliniació vertical respecte a un altre element de codi(similar a l'aliniament vertical de les imatges)

• vertical-align: baseline;


• vertical-align: sub; (per fer subíndex)


• vertical-align: super; (per fer superíndex)


• vertical-align: top; (a dalt en l'espai pare que ocupa)


• vertical-align: middle; (al mig en l'espai pare que ocupa)


• vertical-align: bottom; (a baix en l'espai pare que ocupa)


• vertical-align: 10px; (10px per sobre de la línia base)


• vertical-align: -5px;(5px per sota de la línia base)


• vertical-align: 5%;


• vertical-align: -20%;

Direcció del text.

• direction:ltr; (esquerra a dreta)


• direction:rtl; (dreta a esquerra)

Longitud i alçada

• width: 200px;


• width: 20%; (el 20% de l'espai que ocupa)


• height: 40px;


• height: 10%;