Listy CSS są bardzo pomocne w dotarciu do zestawu punktów numerowanych lub wypunktowanych. W tym artykule dowiesz się, jak kontrolować typ, położenie i styl przy użyciu CSS. Następujące wskaźniki zostaną tutaj omówione,
- Właściwości CSS
- Właściwość typu stylu listy
- Listy CSS: przykładowy program
- Wartości znaczników dlaWe właściwości list-style-position
A więc zacznijmy,
Listy CSS
Właściwości CSS
Istnieje pięć różnych właściwości CSS, w których można go używać do kontrolowania list:
- Typ listy: Pozwala nam kontrolować kształt lub wygląd znacznika.
- Pozycja w stylu listy: określa, że do zawinięcia do drugiej linii potrzebny jest długi punkt lub powinien być wyrównany z pierwszą linią lub zaczynać się od znacznika.
- List-style-image: Określa, że obraz dla znacznika powinien być dodany lub bardziej atrakcyjny niż punktory lub numerowane punkty.
- Styl listy: pokazuje skrót do poprzednich właściwości.
- Przesunięcie markera: Określa odległość między znacznikiem a tekstem wprowadzonym na liście.
Tutaj najczęściej używanymi listami są: typ-styl-listy i pozycja-stylu-listy. Zostało to wyjaśnione poniżej
jak zrobić moc w Pythonie
Przechodząc do tego artykułu o listach CSS
Właściwość typu stylu listy
We właściwości typu list pozwala kontrolować kształt i styl punktorów lub znaczników w przypadku listy nieuporządkowanej. W przypadku listy uporządkowanej jest to numeracja znaków.
Poniższa tabela reprezentująca listy nieuporządkowane:
| Wartość | Opis |
| Żaden | NA |
| Dysk | Jest wypełnione kółkiem. (Domyślnie) |
| okrąg | To jest pusty krąg. |
| Kwadrat | Jest wypełniony kwadratem. |
Poniższa tabela przedstawiająca uporządkowane listy:
| Wartość | Opis | Przykład |
| Dziesiętny | To jest liczba | 1,4,3 |
| Wiodące zero dziesiętne | 0 przed rzeczywistą liczbą | 01, 04, 03 |
| Dolna alfa | Są to małe litery alfanumeryczne. | a, b, c, d |
| Alfa górna | Są to wielkie litery alfanumeryczne. | A, B, C, D |
| Dolno-rzymski | Jest to małe cyfry rzymskie. | I, II, III, IV, V |
| Górno-rzymski | To wielkie cyfry rzymskie. | I, II, III, IV, V |
| Dolnogrecki | Marker jest w języku dolno-greckim | alpha, gamma |
| Dolno-łaciński | Marker jest zapisany w małej łacinie | a, b, c, d |
| Górno-łaciński | Marker jest w górnej łacińskiej | A, B, C, D |
Przechodząc do tego artykułu o listach CSS
Listy CSS: przykładowy program
- Jawa
- Pyton
- Kątowy
- Jawa
- Pyton
- Kątowy
- Jawa
- Pyton
- Kątowy
- Jawa
- Pyton
- Kątowy
- Jawa
- Pyton
- Kątowy
Wynik
Przechodząc do tego artykułu o listach CSS
Właściwość list-style-position
Wartości znaczników dla właściwości pozycji w stylu listy
We właściwości pozycji stylu listy wskazuje, że znacznik powinien pojawić się wewnątrz lub na zewnątrz pola zawierającego punktory. Może mieć jedną z dwóch wartości:
| Wartość | Opis |
| Żaden | NA |
| Wewnątrz | W tym przypadku, jeśli tekst znajdzie się w drugiej linii, tekst zawinie się pod znacznikiem, a także pokaże, gdzie tekst zacząłby się, gdyby listy miały dolinę na zewnątrz. |
| na zewnątrz | W tym przypadku, jeśli tekst trafi do drugiej linii, tekst zostanie wyrównany do początku pierwszej linii. |
Przykład:
- Matematyka
- Nauki społeczne
- Fizyka
- Matematyka
- Nauki społeczne
- Fizyka
- Matematyka
- Nauki społeczne
- Fizyka
- Matematyka
- Nauki społeczne
- Fizyka
Wynik
To prowadzi nas do końca tego artykułu o listach CSS.
Sprawdź nasze który obejmuje szkolenie na żywo prowadzone przez instruktora i rzeczywiste doświadczenie projektowe. To szkolenie zapewni Ci biegłość w pracy z technologiami internetowymi zaplecza i front-endu. Obejmuje szkolenia w zakresie tworzenia stron internetowych, jQuery, Angular, NodeJS, ExpressJS i MongoDB.
Masz do nas pytanie? Wspomnij o tym w sekcji komentarzy w artykule, a my skontaktujemy się z Tobą.