Predmetová komisia ELT a INF

Učebnica CSS - Text

CSS Style - Text

« Predchádzajúca Ďalšia kapitola »

text formatting

Tento text je štylizovaný pomocou formátovacých možností textu. V záhlaví sa používa "text - align, text - transform" a farebné vlastnosti. Odseku je členitý a miesto medzi písmenami nie je stanovené. Tento odkaz nie je podčiarknutý. "Vyskúšajte si to sami".

Farba textu

Vlastnosť farba slúži na nastavenie farby textu. Farba môže byť špecifikovaná:

  • Názov - meno farby napr. "red"
  • RGB - RGB hodnota napr. "rgb(255,0,0)"
  • Hex -hex hodnota napr. "#ff0000"

Predvolená farba pre stránky je definovaná v selektore.

Príklad

body {color:blue;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}

Vyskúšajte si to »

Dekoračný text

Text - decoration vlastnosť sa používa na nastavenie alebo odstránenie ozdoby z textu.

Text - decoration sa väčšinou používa na odstránenie zvýraznenia odkazov v texte.

Príklad

a {text-decoration:none;}

Vyskúšajte si to »

Tieto možnosti môže byť tiež použité na dekoráciu textu

Príklad

h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
h4 {text-decoration:blink;}

Vyskúšajte si to »

Neodporúča sa zdôrazniť text, ktorý nie je odkazom, pretože to často pletie užívateľa.

Text Transformácia

Text - transform sa používa na voľbu malých a veľkých písmen v texte.

Môže sa to použiť k zmene malých písmen na veľké, alebo zmeniť iba prvé písmeno každého slova.

Príklad

p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}

Vyskúšajte si to »

Text a jeho odsadenie

Text - vlastnosť odsadenie sa používa na určenie odsadenie prvého riadku v textu.

Príklad

p {text-indent:50px;}

Vyskúšajte si to »

Ďalšie príklady

Určite si medzery medzi znakmi
Tento príklad ukazuje, ako možno zväčšiť alebo zmenšiť medzery medzi znakmi.

Určite si medzery medzi riadkami
Tento príklad ukazuje, ako určiť vzdialenosť medzi riadkami v odseku.

Nastaviť smer textu
Tento príklad ukazuje, ako zmeniť smer prvku text .

Zväčšenie medzier medzi slovami
Tento príklad ukazuje, ako zväčšiť medzeru medzi slovami v odseku.

Zakázať obtekania textu vo vnútri elementu
Tento príklad ukazuje, ako sa dá zakázať obtekania textu vnútri elementu.

Vertikálne zarovnanie obrázka
Tento príklad ukazuje, ako nastaviť vertikálne zarovnanie obrázka v texte.

Všetky CSS Vlastnosti textu

Číslo v "CSS" stĺpec ukazuje, v ktorej CSS verzii je vlastnosť definovaná ( CSS1 alebo CSS2 ).

Vlastnosť Popis Hodnota CSS
color Sets the color of a text color 1
direction Sets the text direction ltr
rtl		 2
line-height Sets the distance between lines normal
number
length
%		 1
letter-spacing Increase or decrease the space between characters normal
length		 1
text-align Aligns the text in an element left
right
center
justify		 1
text-decoration Adds decoration to text none
underline
overline
line-through
blink		 1
text-indent Indents the first line of text in an element length
%		 1
text-shadow   none
color
length		  
text-transform Controls the letters in an element none
capitalize
uppercase
lowercase		 1
unicode-bidi   normal
embed
bidi-override		 2
vertical-align Sets the vertical alignment of an element baseline
sub
super
top
text-top
middle
bottom
text-bottom
length
%		 1
white-space Sets how white space inside an element is handled normal
pre
nowrap		 1
word-spacing Increase or decrease the space between words normal
length		 1

 

« Predchádzajúca Ďalšia kapitola »