CSS	internet Explorer		Chrome	Opera	Safari	Firefox	Android	iOS
2.1	6.0+	8.0+	1.0+	3.5+	1.0+	1.0+	1.0+	1.0+
3			2.0+	11.6+	3.1+	3.6+	2.1+	2.0+

stručné informace

CSS verze

Hodnoty

na střed Zarovná text na střed. Text je umístěn vodorovně v okně prohlížeče nebo kontejneru, kde je umístěn textový blok. Řádky textu se zdají být navlečeny na neviditelné ose, která vede středem webové stránky. Tato metoda zarovnání se aktivně používá v nadpisech a různých podpisech, jako jsou titulky, poskytuje oficiální a solidní vzhled textu. Ve všech ostatních případech se zarovnání na střed používá zřídka z toho důvodu, že je nepohodlné číst velké množství takového textu. justify Justified, což znamená zarovnáno doleva a doprava zároveň. K provedení této akce prohlížeč v tomto případě přidá mezi slova mezery. vlevo Zarovná text doleva. V tomto případě jsou řádky textu zarovnány doleva a pravý okraj je uspořádán jako žebřík. Tato metoda zarovnání je na webových stránkách nejoblíbenější, protože umožňuje uživateli snadno najít nový řádek a pohodlně číst velký text. vpravo Zarovná text doprava. Tato metoda zarovnání působí jako antagonista předchozího typu. Řádky textu jsou totiž zarovnány k pravému okraji, zatímco levý zůstává „roztrhaný“. Protože levý okraj není zarovnán, což je místo, kde se čtou nové řádky, je tento text obtížnější číst, než kdyby byl zarovnán vlevo. Pravé zarovnání se proto obvykle používá u krátkých nadpisů nepřesahujících tři řádky. Neuvažujeme o konkrétních stránkách, kde se musí text číst zprava doleva, kde se možná bude hodit podobný způsob zarovnání. auto Nezmění polohu prvku. inherit Zdědí hodnotu rodiče. start Stejné jako doleva, pokud jde text zleva doprava a doprava, když text jde zprava doleva. end Stejné jako vpravo, pokud jde text zleva doprava a doleva, když text jde zprava doleva.

HTML5 CSS2.1 IE Cr Op Sa Fx

Výsledek tohoto příkladu je znázorněn na Obr. 1.

Rýže. 1. Zarovnejte text v prohlížeči Safari

Internet Explorer až do verze 7.0 včetně jej interpretuje poněkud odlišně tento příklad než jiné prohlížeče, zarovnává nejen text, ale i bloky (obr. 2).

Rýže. 2. Zarovnání textu v aplikaci Internet Explorer 7

Objektový model

document.getElementById("elementID ").style.textAlign

Prohlížeče

IE až do verze 7.0 včetně zarovnává nejen obsah prvku na úrovni bloku, ale také prvek samotný.

HTML tagy, které určují zarovnání a odsazení textu

Zarovnaný text používaný v typografii

Níže uvedený příklad ukazuje, jak zarovnat text na šířku stránky:

align="left"	align="right"
	Počet pracovníků zaměstnaných v sektoru služeb a šíření informací každým dnem roste. Jestliže symboly minulých staletí byly farma a továrna, pak symbolem současného 21. století je kancelář vybavená počítači, které mají přístup k informačnímu toku.
align="justify"	align="center"
Počet pracovníků zaměstnaných v sektoru služeb a šíření informací každým dnem roste. Jestliže symboly minulých staletí byly farma a továrna, pak symbolem současného 21. století je kancelář vybavená počítači, které mají přístup k informačnímu toku.	Počet pracovníků zaměstnaných v sektoru služeb a šíření informací každým dnem roste. Jestliže symboly minulých staletí byly farma a továrna, pak symbolem současného 21. století je kancelář vybavená počítači, které mají přístup k informačnímu toku.

Hodnota zdůvodnění zajišťuje jednotnost zarovnat text vpravo a vlevo, to je na šířku. Tato metoda je široce používána v tisku.

Zarovnání textu v HTML na střed a šířku

Zarovnat text v HTML na střed, text vpravo:

Výsledek:

Atributy a hodnoty

• align="left" - definuje zarovnání textu doleva(výchozí).
• align="center" - zarovná text na střed.
• align="right" - zarovná text doprava.

Zarovnat | HTML odsazení textu

HTML text a jeho odsazení v levé části stránky

Budeme vyrábět odsazení textu vlevo dvěma způsoby:

Výsledek:

Zobrazit v novém okně.

Vlastnost text-align-last ( nezaměňovat s HTML align) určuje, jak bude zarovnán poslední řádek bloku nebo řádek před vynuceným přerušením. To je důležité, protože poslední řádek odstavce obvykle neobsahuje dostatek textu, aby zaplnil celý prostor.

V tomto článku se budeme zabývat všemi aspekty vlastnosti text-align-last, včetně hodnot, které přijímá, a podpory prohlížeče.

Použití a přijaté hodnoty

Použití vlastnosti text-align-last je jednoduché. Zde je úryvek kódu pro zarovnání posledního řádku textu doprava:

Úvodní graf ( text-align: justify; // Povinné pro IE a Edge text-align-last: right; )

Vlastnost může nabývat sedmi hodnot. Pravděpodobně znáte standardní textové hodnoty HTML align:left , right a center . Zarovnávají text na posledním řádku vpravo, vlevo a na střed kontejneru.

Níže uvedený příklad ilustruje rozdíly mezi těmito třemi hodnotami:

Zobrazit příklad

Čtvrtá hodnota, justify , zarovnává poslední řádek tak, aby byl text rovnoměrně rozložen po celé šířce kontejneru. Toho je dosaženo přidáním vhodného počtu mezer mezi slova. V závislosti na množství textu lze tuto vlastnost použít k úplnému vyplnění mezery na posledním řádku, aniž by to skončilo příliš velkými mezerami mezi slovy.

Text ve druhém odstavci je také rozložen po šířce, ale protože poslední řádek obsahuje pouze jedno slovo, je umístěn vlevo.

Zobrazit příklad

Zarovnání posledního řádku textu doleva je vhodné pro jazyky, které se čtou zleva doprava ( LTR), ale u jazyků RTL to nebude správné. V takových případech může použití hodnot vlevo nebo vpravo způsobit problémy.

Naštěstí můžete použít počáteční hodnotu k zarovnání textu k okraji, kde začíná psaní a čtení. To znamená, že nastavením vlastnosti text-align-last na start zarovnáte text vlevo u jazyků LTR a vpravo u jazyků RTL.

Koncovou hodnotu můžete také použít k zarovnání textu na protější okraj, než kde začínáte psát a číst. To bude odpovídat hodnotě vpravo pro jazyky LTR a vlevo pro jazyky RTL.

Zobrazit příklad

Výchozí hodnota pro tuto vlastnost je auto . Při použití je text na posledním řádku zarovnán podle hodnoty vlastnosti HTML text align, pokud není nastavena na zarovnání . V opačném případě je text distribuován po šířce kontejneru pouze v případě, že je vlastnost text-justify nastavena na distribute . Jinak je text zarovnán k okraji, kde začíná psaní a čtení.

Důležité poznámky

Aby text-align-last fungoval, musí být vlastnost text-align nastavena na justify . Ale toto pravidlo je implementováno pouze v IE a Edge. Ve Firefoxu a Chrome tato vlastnost funguje bez nastavení zarovnání textu na zarovnání . V níže uvedeném příkladu by měl být text v Edge a IE zarovnán doprava. V jiných prohlížečích budou poslední řádky odstavců zarovnány podle hodnoty vlastnosti text-align-last a zbývající řádky budou zarovnány doprava.

Zobrazit demo

Pokud nenastavíme zarovnání textu na zarovnání zarovnat HTML , nebude výsledek vypadat tak hezky. Rozložení textu tedy s největší pravděpodobností nastavíte na šířku.

Tato vlastnost funguje, i když má odstavec vynucený konec řádku zadaný pomocí značky
nebo něco takového. Mějte na paměti, že tato vlastnost ovlivní všechny poslední řádky textu v zadaném prvku, nejen ten nejvzdálenější. Pokud například text uvnitř článku nebo prvku div obsahuje tři odstavce, poslední řádek v každém bude zarovnán podle vlastnosti text-align-last nastavené pro celý nadřazený prvek.

Pokud potřebujete zarovnat pouze úplně poslední řádek obsahu, můžete použít selektory :last-child nebo :last-of-type. Vezměte si kód z ukázky níže jako příklad:

článek ( text-align: justify; ) article p:last-of-type ( text-align-last: right; )

Poslední řádek posledního odstavce našeho článku zarovnává doprava. Zbývající řádky jsou zarovnány na základě hodnoty vlastnosti HTML text align.

Zobrazit demo

Pro změnu zarovnání můžete použít i další selektory: :sudý a :lichý.

Někdy se může odstavec skládat pouze z jednoho řádku. V tomto případě, pokud jste zadali hodnoty pro vlastnost text-align a text-align-last, bude mít přednost druhá vlastnost.

Zvažte následující fragment kódu:

p ( text-align: justify; ) p:nth-of-type(2) (text-align-last: left; )

Pokud má druhý odstavec pouze jeden řádek, bude text zarovnán doleva, protože přednost bude mít text-align-last. Níže uvedené demo ukazuje tento kód CSS v akci a pár dalších HTML příklady zarovnat.

Zobrazit demo

Podpora prohlížeče

Podporu této vlastnosti lze povolit pomocí možnosti " Povolit funkce experimentální webové platformy"V Google Chrome a Opera, počínaje verzemi 35 a 22. Je plně podporován v prohlížečích Chrome 47+ a Opera 34+.

Chcete-li použít tuto vlastnost ve Firefoxu, budete ji muset předponu -moz- . Počáteční a koncové hodnoty nejsou podporovány IE. Edge přitom tuto vlastnost plně podporuje. Jediný populární prohlížeč, který plně nepodporuje text-align-last, je Safari.

O tom, která písmena budou velká a která malá, obvykle rozhoduje sám tvůrce webu na základě pravidel pravopisu a svých vlastních preferencí. Proces změny případů znaků však lze pomocí vlastnosti automatizovat textová transformace. Tato vlastnost může nabývat čtyř hodnot:

• žádný - text je psán beze změn;
• kapitalizovat- každé slovo bude začínat velkým písmenem;
• malá písmena - všechny znaky se stanou malými písmeny (malými písmeny);
• velká písmena- všechny znaky budou velká (velká písmena).

Například následující pravidlo určuje, že nadpis H1 by měl být velkými písmeny:

H1 (transformace textu: velká písmena;)

Je vhodné nastavit automatickou změnu velikosti písmen u zkratek, názvů prvků, nadpisů a dalších textové prvky, kde je potřeba psát velkými nebo malými písmeny.

Dekorace textu: vlastnost text-decoration

Vlastnictví text-dekorace umožňuje dodat textu další design. Hodnoty této vlastnosti jsou konstanty žádný, podtržení, přetržení, přeskočení A blikat, která vám umožní zobrazit prostý text, nakreslit čáru nad, pod nebo přes text nebo nechat text blikat. Příklad použití různých hodnot této vlastnosti je na obrázku 11.4.

Rýže. 11.4.

Nejčastější využití nemovitosti text-dekorace je změnit výchozí podtržení odkazu. Například následující pravidlo určuje, že odkazy by měly být podtržené:

A:link (text-decoration: underline;)

Mezery mezi slovy: vlastnost word-spacing

Chcete-li nastavit mezery mezi slovy v textu, použijte vlastnost word-spacing. Hodnoty této vlastnosti lze nastavit pomocí klíčové slovo normal , což je výchozí nastavení a nastavuje standardní mezery pro aktuální písmo. Chcete-li nastavit mezery navíc ke standardním, můžete zadat hodnotu v libovolných dostupných jednotkách CSS a hodnota může být záporná.

Následující pravidlo tedy zvětšuje mezery mezi slovy v záhlaví H1 o 1 em:

H1 (mezera slov: 1 em;)

Zarovnání textu: vlastnost zarovnání textu

Zarovnání je umístění levého nebo pravého okraje bloku textu podél neviditelného svislá čára. Chcete-li zarovnat text, použijte vlastnost text-align. Platné hodnoty pro tuto vlastnost jsou left, right, center a justify, které určují zarovnání doleva, doprava, na střed a zarovnání do bloku.

Následující pravidlo nastavuje zarovnání na střed všech prvků obsažených v prvku DIV:

DIV (zarovnání textu: na střed;)

Proklad: vlastnost výšky řádku

Proklad je vzdálenost mezi základními liniemi čar, které jsou blízko u sebe. Za normálních okolností závisí mezera mezi řádky na typu a velikosti písma a je automaticky určena prohlížečem. Tuto hodnotu však lze změnit pomocí vlastnosti line-height. Výchozí hodnota normální způsobí, že prohlížeč automaticky vypočítá mezery mezi řádky. Jakékoli číslo větší než nula je považováno za násobitel velikosti písma aktuálního textu. Jako hodnoty pro tuto vlastnost je také možné použít libovolné jednotky délky akceptované v CSS. Je také povoleno používat procentuální zápis a v tomto případě se výška písma bere jako 100 %. Záporné řádkování není povoleno.

Letter spacing: vlastnost letter-spacing

Prohlížeč automaticky upraví mezery mezi znaky na základě velikosti a typu písma. V některých případech je nutné upravit vzdálenost mezi písmeny. Chcete-li řídit mezery mezi písmeny, použijte vlastnost letter-spacing. Hodnoty této vlastnosti mohou být libovolné jednotky délky CSS, ale doporučuje se používat relativní jednotky založené na velikosti písma (em a ex). Na rozdíl od řádkování vlastnost letter-spacing umožňuje použití záporné hodnoty, ale v tomto případě je třeba zajistit, aby byla zachována čitelnost textu.

Následující pravidlo zvyšuje mezery mezi znaky v záhlaví H1 o 0,5 em.

Dobrý den, milí čtenáři tohoto blogu. Dnes pokračujeme ve studiu a dále máme vlastnosti text-decoration, vertical-align, text-align, text-indent a řadu dalších, které pomáhají navrhovat vzhled textů v Html kódu.

V minulém článku jsme se podívali na vlastnosti, které jsou určeny ke konfiguraci vzhled fonty na .

Ještě dříve jsme se podrobně podívali na všechny typy, dozvěděli jsme se, jak je lze seskupit a jaké priority prohlížeč nastavuje při jejich interpretaci. Je pravda, že to vše bylo rozděleno do několika článků, takže abyste nebyli zmateni, doporučuji vám prostudovat materiály v uvedeném pořadí.

Dekorace textu, zarovnání textu, odsazení textu v CSS

Jak pracovat s textem v CSS? Bylo by logické předpokládat, že pro tento účel existují speciálně navržená pravidla. Začněme text-align, což je vlastně náhrada za atribut align (sloužil k zarovnání obsahu jako P odstavců nebo nadpisů).

Má pouze čtyři možné významy:

Význam zůstává stejný jako dříve. Zarovnání textu- toto je horizontální zarovnání čar. Toto pravidlo platí výhradně pro prvky bloku (odstavce, nadpisy atd.), tzn. ty značky, ve kterých se může objevit několik řádků. Protože Vzhledem k tomu, že vložené prvky mohou mít pouze jeden řádek, není v nich žádný zvláštní smysl používat zarovnání textu.

Je jasné, že hodnoty tohoto pravidla znamenají zarovnání, respektive: vlevo, vpravo, na střed a šířku stránky (Zarovnat - současně vlevo a vpravo zvětšením vzdálenosti mezi slovy) . Je samozřejmé, že hodnota Justify by měla být použita pro prvky s alespoň několika řádky textu, jinak nebude viditelný efekt.

Například jsem odůvodnil předchozí odstavec (můžete vidět, že má hladké okraje vlevo i vpravo) pomocí:

Text-align:justify;

Standardně je vodorovné zarovnání textu vlevo, tzn. Není třeba konkrétně psát text-align:left, pokud jste samozřejmě předtím nezadali jiné zarovnání. Mimochodem, tento odstavec jsem zarovnal na střed (na střed), opět pro jasný příklad, ale tady je myslím vše jasné.

Další pravidlo CSS odsazení textu umožňuje určit červenou čáru, například pro text ve značce odstavce P. Odsazení červené čáry lze určit zadáním hodnoty (buď se znaménkem plus nebo mínus pomocí ) nebo pomocí procent:

Z čeho se počítají procenta v odsazení textu? Z šířky oblasti přidělené pro text. Tito. Pravidlo CSS text-indent:50% nastaví červenou čáru rovnou polovině délky této čáry. Tento odstavec slouží jako příklad takového pravidla.

Nebo můžete například nastavit zápornou hodnotu pro červenou čáru v odsazení textu a pak dostaneme přibližně to, co vidíte v tomto odstavci. Za úspěch tento výsledek Napsal jsem toto pravidlo CSS pro značku odstavce P:

Odsazení textu:-1em;

Typické použití text-indent (pro nastavení standardní červené čáry) může vypadat takto: text-indent:40px; (mimochodem se vztahuje na tento odstavec). Toto pravidlo, stejně jako výše popsané zarovnání textu, platí pouze pro blokové prvky, tj. kde se může objevit několik řádků (odstavců, nadpisů atd.).

Dobře, přejděme k tomu text-dekorace(návrh pomocí vodorovné čáry), který je již aplikován na všechny Html prvky (inline i block).

Může mít pouze čtyři významy:

Tito. lze použít pomocí zdobení textu: overline, line-through nebo underline, nebo nepoužít vůbec nic (žádné). Některé prvky HTML již mají výchozí design vodorovná čára, například (ve výchozím nastavení jsou podtržené).

Zvýrazňovat něco jiného podtržením (kromě hypertextových odkazů) proto není dobré, protože uživatelé mají v podvědomí napsáno, že jakmile je to podtrženo (a také barevně zvýrazněno), znamená to, že na to mohou kliknout a přejít. Zvýrazněním běžného textu podtržením ale uživatele uvádíte v omyl a následně jste zklamáni svým zdrojem (myslel si, že ano, ale ukázalo se, že...).

Nuance při použití pravidla pro zdobení textu CSS spočívá v tom, že můžete zadat tři (nebo dvě) hodnoty najednou pro jakýkoli prvek Html (nevynechejte žádnou) a jako výsledek získáte podtržený-podtržený-přeškrtnutý fragment textu(to zní a vypadá skvěle, že?):

Text-decoration:underline overline line-through;

Hodnoty pro zdobení textu (pokud jich chcete použít několik najednou) je třeba zapsat prostřednictvím vesmírného znaku.

Vertical-align - vertikální zarovnání

Dále máme vertikální zarovnání - vertical-align. Pro téměř všechny prvky v kódu HTML to znamená zarovnání vložených prvků s textem vzhledem k jejich základní čáře. Pravda, pro to to znamená trochu jinak - veškerý obsah, který je v těchto buňkách, bude zarovnán vertikálně.

Pro pravidlo CSS vertikálního zarovnání můžete použít následující hodnoty:

Čáry jsou standardně zarovnány podle účaří. Podívejte, podal jsem žádost zvětšit velikost písma pro tento kus textu a tyto dva fragmenty jsou zarovnány se základní (spodní) linií. Vertikální zarovnání pomocí vertikálního zarovnání je přesně určeno ke změně způsobu zarovnání čar.

Pokud například napíšu vertical-align:baseline pro stejný zvětšený kus textu, nedojde k žádným změnám, protože výchozí hodnota se pro toto pravidlo CSS používá.

Mimochodem, jako hodnoty pro něj můžete použít i čísla a nápis vertical-align:0 bude znamenat to samé jako vertical-align:baseline, tzn. základní linie je ekvivalentní nule. Pokud tedy chceme naznačit jakýkoli posun ve vertikálním zarovnání, pak tento posun bude specifikován vzhledem k základní čáře (nebo nule).

Můžete to napsat takto:

vertical-align:10px;

A budeme přijímat posunout fragment větším písmem nahoru 10 pixelů vzhledem k základní čáře. Pokud napíšeme zápornou hodnotu:

Vertical-align:-10px;

Pak dostaneme posunout fragment dolů vzhledem k základní linii. Z ukázek je patrné, že díky posunu se výška řádku zvětšila tak, aby se do něj text vešel, aniž by kolidoval se sousedním řádkem. Posun lze také zadat v Em a Ex a v procentech, které se budou počítat z výšky řádku tohoto prvku (připomeňme si, že v minulém článku jsme se učili, jak jej nastavit pomocí ).

Chcete-li svisle zarovnat obsah buněk tabulky, mělo by svislé zarovnání použít hodnoty Top a Bottom k zarovnání obsahu k horní a dolní části buňky (dobře, střed v buňce tabulky se používá jako výchozí hodnota svislého zarovnání ).

A pro prvky písma můžete použít text-top, text-bottom, middle. Použijme to jako příklad tento kus textu význam:

vertical-align:middle;

jaký byl výsledek? Střední čára zvětšeného fragmentu je zarovnána s účaří běžného textu, tzn. dostali jsme vertikální zarovnání ke středové čáře. Pro text-top a text-bottom bude vše stejné. Toto je text-top a toto je text-bottom .

Hodnoty vlastnosti CSS vertical-align sub a super odpovídají sub- a super-indexu, ke kterému došlo v čisté HTML(před použitím Vlastnosti CSS pro vizuální design).

Transformace textu, mezery mezi písmeny, mezery mezi slovy a mezery

Standardně se nepoužívá žádný a znamená, že se znaky v textu nijak nezmění – jak je psáno v Html, tak se budou zobrazovat. Hodnota Velká písmena pro text-transform převede všechna písmena ve fragmentu na velká písmena ( příklad je uveden v této větě, kde bylo použito pravidlo text-transform:velká písmena a písmena se původně psala malými písmeny).

Hodnota malých písmen pro pravidlo transformace textu CSS vám umožní transformovat všechny znaky ve fragmentu na malá písmena a hodnota velkých písmen změní všechna první písmena slova na velká ( příklad v této větě- text-transform:capitalize). Tito. pomocí text-transform můžete s prostým textem dělat, co chcete, a pak vše snadno vrátit zpět.

Pokud tedy máte například za úkol všechny nadpisy pouze napsat velkými písmeny, pak je zapište jako obvykle do Html a pomocí text-transform:uppercase je vytvořte velkými písmeny v CSS. Pokud se pak rozhodnete něco změnit zpět, stačí udělat malou změnu ve stylech, a ne v obsahu všech 100 500 záhlaví na vašem webu.

Ve výchozím nastavení jsou mezery mezi písmeny a slovy nastaveny na Normální, nebo jsou stejné jako nula (tj. vzdálenost mezi znaky a slovy se nijak nemění). Velikost změny vzdálenosti v těchto pravidlech lze zadat pouze v pixelech, buď Em nebo Ex, ale ne v procentech.

Můžete však použít jak kladné (řídkost znaků nebo slov), tak záporné hodnoty (přibližování znaků nebo slov k sobě). Například můžete "Takto prořídíme znaky v této frázi" pomocí následujícího pravidla CSS:

Mezera mezi písmeny: 0,4 em;

Nebo můžete „takto přiblížíte symboly v této frázi“ používáním:

Letter-spacing:-1px;

Totéž lze říci o mezerách mezi slovy, pouze s tím rozdílem, že vzdálenost mezi slovy se bude měnit, jako například v této frázi pomocí této konstrukce CSS:

mezera mezi slovy:4em;

Podobně můžete použít záporné hodnoty v mezerách mezi slovy, abyste snížili vzdálenost mezi slovy.

No a poslední CSS pravidlo pro dnešek, které umožňuje určitým způsobem formátovat text v Html kódu, je toto bílý prostor. Zodpovídá za zobrazení bílých znaků na webové stránce, ke kterým došlo při psaní Html kódu.

Jak si pamatujete z článku o, prohlížeč při analýze kódu sloučí všechny mezery, konce řádků a tabulátory do jedné mezery a zalomí řádky na webové stránce přesně podle prázdné znaky, která proběhla v kódu.

Bílé místo tedy může nabývat jedné ze tří hodnot:

Je jasné, že výchozí hodnota je Normální a v tomto případě se vše zobrazuje tak, jak jsem popsal výše. Ale při použití hodnoty Pre dostaneme úplnou analogii s použitím, tzn. Na webové stránce se text zobrazí se všemi těmi bílými znaky navíc, které byly přítomny při psaní kódu, a prohlížeč již nebude moci provádět přenosy pomocí nich.

No, jaký to má význam? nynírap Jednoduše zabrání prohlížeči zabalit jakékoli bílé znaky, které najde uvnitř fragmentu, pomocí pravidla CSS white-space:nowrap. Můžete si sami vyzkoušet, jak to celé funguje, vytvořením jednoduchého souboru Html a uzavřením libovolné části textu do značek, jako je tento:

Hodně štěstí! Brzy se uvidíme na stránkách blogu

Mohlo by vás to zajímat

Styl seznamu (typ, obrázek, pozice) - Pravidla CSS pro přizpůsobení vzhledu seznamů v Html kódu
Umístění pomocí Z-indexu a pravidla kurzoru CSS pro změnu kurzoru myši
Výplň, okraj a ohraničení – zasazeno Interní CSS a vnější okraje, stejně jako rámečky pro všechny strany (nahoře, dole, vlevo, vpravo)
K čemu je CSS, jak napojit kaskádové styly HTML dokument a základní syntaxi tohoto jazyka
Plovoucí a jasné v CSS - nástroje pro rozložení bloků
CSS - co to je, jak se kaskádové styly připojují HTML kód pomocí Stylu a odkazu
Jednotky dimenze (pixely, Em a Ex) a pravidla dědičnosti v CSS
Tagy, class, Id a univerzální selektory, stejně jako selektory atributů v moderním CSS
Poloha (absolutní, relativní a pevná) - metody polohování HTML prvky v CSS (pravidlo vlevo, vpravo, nahoře a dole)
Pozadí v CSS (barva, pozice, obrázek, opakování, příloha) – vše pro nastavení pozadí nebo barvy pozadí Html obrázky Prvky