Web Design CSS Text
Sa vorbim putin despre propritatiile CSS ce pot fi aplicate textului in general (paragraf, headings, linkuri).
Cele mai uzuale si importante sunt:
1. Culoare text (text color)
Culoarea textului poate fi specificata prin trei metode:
- nume – color:blue
- rgb – rgb(255,0,0)
- hex – color:#ff3333
Culoarea implicita (default) va fi specificata in body.
body {color:red;}
h1 {color:#00ff00;}
p {color:rgb(255,0,0);}
2. Aliniere (Text alignment)
Variante disponibile: left, center, right, justify. Exemple:
h2 {text-align:center;}
p.dreapta {text-align:right;}
p.stanga {text-align:left;}
p {text-align:justify;}
3. Decorare (text-decoration)
Variantele acceptate sunt: none, underline, overline, line-through, blink
De exemplu ca default linkurile sunt subliniate, dar puteti adauga proprietatea a {text-decoration:none;} pentru a fi scris normal. Exemple:
a {text-decoration:none}
h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
p.blink {text-decoration:blink;}
4. Transformare text (text-transform)
p.mari {text-transform:uppercase;}
p.mici {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}
Toate proprietatiile valabile pentru text le aveti in tabelul de mai jos:
| Proprietate | Descriere | Valoare | CSS |
|---|---|---|---|
| color | Seteaza culoarea unui text | color | 1 |
| direction | Seteaza directia textului | ltr
rtl |
2 |
| line-height | Seteaza distanta dintre linii | normal
number length % |
1 |
| letter-spacing | Seteaza spatiul dintre caractere / litere | normal
length |
1 |
| text-align | Aliniaza textul | left
right center justify |
1 |
| text-decoration | Adauga decorare unui text | none
underline overline line-through blink |
1 |
| text-indent | Seteaza distanta primei litere (marimea paragrafului) | length
% |
1 |
| text-shadow | Seteaza umbra unui text | none
color length |
|
| text-transform | Transfora literele unui text | none
capitalize uppercase lowercase |
1 |
| unicode-bidi | normal
embed bidi-override |
2 | |
| vertical-align | Seteaza alinierea verticala (pozitia pe verticala) a unui text | baseline
sub super top text-top middle bottom text-bottom length % |
1 |
| white-space | Modifica spatiul alb dintr-un element | normal
pre nowrap |
1 |
| word-spacing | Modifica spatiul dintre cuvinte in text | normal
length |
1 |
Comentarii (0)
Niciun comentariu »
Niciun comentariu până acum.
Feed RSS pentru acest articol. TrackBack URL
