Zoznamy CSS sú veľmi užitočné pri dosahovaní množiny očíslovaných alebo odrážok. Tento článok vám ukáže, ako ovládať typ, pozíciu, štýl pomocou CSS. Nasledujúce ukazovatele budú uvedené tu,
- Vlastnosti CSS
- Vlastnosť typu zoznamu
- Zoznamy CSS: Ukážkový program
- Hodnoty značiek preVo vlastnosti list-style-position
Poďme teda do toho,
Zoznamy CSS
Vlastnosti CSS
Existuje päť rôznych vlastností CSS, v ktorých ho môžete použiť na ovládanie zoznamov:
- Zoznamový štýl: Umožňuje nám ovládať tvar alebo vzhľad značky.
- Poloha v štýle zoznamu: Určuje, že na zalomenie do druhého riadku je potrebný dlhý bod, ktorý by sa mal zarovnať s prvým riadkom alebo začínať značkou.
- List-style-image: Určuje, že obrázok značky by mal byť pridaný alebo zatraktívnený skôr ako odrážky alebo očíslované body.
- Štýl zoznamu: Zobrazuje skratku k predchádzajúcim vlastnostiam.
- Posunutie značky: Určuje vzdialenosť medzi značkou a textom zadaným v zozname.
Tu sú bežne používané zoznamy: list-style-type a list-style-position. Je to vysvetlené nižšie
ako nastaviť cestu k triede v systéme Windows 10
Pokračujeme týmto článkom v zoznamoch CSS
Vlastnosť typu zoznamu
Vo vlastnosti typu štýl zoznamu vám umožňuje ovládať tvar a štýl bodov odrážok alebo značky v neusporiadanom prípade zoznamu. V prípade usporiadaného zoznamu je to číslovanie znakov.
Nasledujúca tabuľka predstavujúca neusporiadané zoznamy:
| Hodnota | Popis |
| Žiadne | NA |
| Disk | Je to vyplnený kruh. (Predvolený) |
| Kruh | Je to prázdny kruh. |
| Námestie | Je vyplnený štvorec. |
Nasledujúca tabuľka predstavujúca objednané zoznamy:
| Hodnota | Popis | Príklad |
| Desatinné miesto | Je to číslo | 1,4,3 |
| Desatinná úvodná nula | 0 pred skutočným číslom | 01, 04, 03 |
| Lower-alpha | Ide o malé alfanumerické znaky. | a B C d |
| Horná alfa | Jedná sa o veľké alfanumerické znaky. | A B C D |
| Nižšie rímske | Sú to malé rímske číslice. | i, ii, iii, iv, v |
| Hororománsky | Sú to veľké rímske číslice. | I, II, III, IV, V |
| Dolno-grécky | Značka je v dolnej gréčtine | alfa, gama |
| Nižšie latinskoamerické | Značka je v latinčine | a B C d |
| Horná-latinčina | Značka je v latinčine | A B C D |
Pokračujeme týmto článkom v zoznamoch CSS
Zoznamy CSS: Ukážkový program
- Java
- Python
- Uhlové
- Java
- Python
- Uhlové
- Java
- Python
- Uhlové
- Java
- Python
- Uhlové
- Java
- Python
- Uhlové
Výkon
Pokračujeme týmto článkom v zoznamoch CSS
Vlastnosť list-style-position
Hodnoty značiek pre vo vlastnosti list-style-position
Vo vlastnosti list-style-position ukazuje, že značka by sa mala objaviť vo vnútri alebo mimo poľa obsahujúceho odrážky. Môže to mať jednu z dvoch hodnôt:
| Hodnota | Popis |
| Žiadne | NA |
| Vo vnútri | V takom prípade, ak text ide do druhého riadku, potom sa text zalomí pod značku. Tiež ukáže, kde by sa text začal, ak by zoznamy mali vonku údolí. |
| vonku | V takom prípade, ak text prejde do druhého riadku, bude text zarovnaný so začiatkom prvého riadku. |
Príklad:
- Matematika
- Spoločenské vedy
- Fyzika
- Matematika
- Spoločenské vedy
- Fyzika
- Matematika
- Spoločenské vedy
- Fyzika
- Matematika
- Spoločenské vedy
- Fyzika
Výkon
Týmto sa dostávame na koniec tohto článku o zoznamoch CSS.
Vyskúšajte naše ktorá prináša živé školenie vedené inštruktorom a skúsenosti s projektmi v reálnom živote. Toto školenie umožňuje získať zručnosti na prácu s webovými technológiami typu back-end a front-end. Zahŕňa školenie zamerané na vývoj webových aplikácií, jQuery, Angular, NodeJS, ExpressJS a MongoDB.
Máte na nás otázku? Uveďte to prosím v sekcii komentárov článku a my sa vám ozveme.