5.1 - Pokračujeme v přehledu
5.2 - Domácí úkol..
5.1 - Pokračujeme v přehledu
Dnes se budeme zabývat přehledem vlastností CSS, sloužícím k formátování textu, potažmo odstavců.
Text
atribut: | hodnoty: | význam: | příklady užití: | dodatky: |
letter-spacing | normal lenght |
mezery mezi jednotlivými písmeny | letter-spacing: normal; letter-spacing: 4px; |
Šikovné, ale já toto vůbec nepoužívám. |
line-height | percentage lenght normal |
výška řádku | line-height: 250%; line-height: 8px; line-height: normal; |
Tato funkce se nesetkává s příliš velkou mírou uplatnění. |
text-align | left right center justify |
zarovnání vlevo vpravo na střed do bloku |
text-align: left; text-align: right; text-align: center; text-align: justify Lorem ipsum dolor amet. |
Použití jen u věcí, které má smysl zarovnávat (odstavce). |
text-decoration | none underline overline line-through blink |
bez dekorace podtrženo "nadtrženo" přeškrtnuto blikání |
text-decoration: none; text-decoration: underline; text-decoration: overline; text-decoration: line-through; text-decoration: blink; |
Dá se kombinovat. A jako obvykle, IE neumí bli(n)kat :). |
text-indent | percentage lenght |
odsazení prvního řádku | text-indent: 5% dolor text-indent: 52 lama spadla do prádla |
- |
text-shadow | none color lenght |
bez stínu barva délka | nefunguje?! | F-ce shadow je mi neznámá; nikdy jsem ji nepoužil a teď, když jsem ji chtěl vyzkoušet pro účely lekce, nic se nezobrazilo. Kdo odhalí tajemství této f-ce, ať mi dá vědět:) |
text-transform | capitalize uppercase lowercase none |
začátky slov velké kapitálky vše malými beze změny |
text-transform: capitalize; text-transform: uppercase; text-transform: lowercase; text-transform: none; |
- |
word-spacing | lenght normal |
délka mezery mezi slovy | word-spacing: 20px; Docela velká mezera mezi slovy word-spacing: normal; |
Starší prohlížeče nepodporují. |
5.2 - Domácí úkol
Vytvořte stránku, do které zakombinujete výše vypsané vlastnosti.