Web Design Ieftin

Web Design CSS Text

» Scris in categoria: CSS, Web Design — Taguri: CSS, css text, text-align, text-decoration — @ 20:10

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)