Jest elementem listy definicji. HTML: Lista numerowana i wypunktowana
Listy są ważną częścią treści, ponieważ pomagają organizować informacje. Tekst na listach jest lepiej postrzegany i łatwiejszy do zapamiętania.
Najprostszy jest taki, że przed każdym jego elementem znajduje się znacznik – okrąg, kwadrat lub okrąg. Kolejność pozycji na liście punktowanej nie jest istotna.
Aby go stworzyć wystarczy użyć tylko dwóch tagów:
I
to kontener zawierający listę, której elementy są określone przez znacznik
- Kamień
- Nożyczki
- Papier
Domyślnie znacznikiem listy jest czarne kółko ( dysk). Dodając do tagu
atrybut typ i przypisując mu odpowiednią wartość znacznik można zamienić na okrąg ( koło) lub czarny kwadrat ( kwadrat).
Różni się od oznaczonego tym, że ważna jest kolejność znajdujących się w nim elementów, dlatego zamiast znacznika stosuje się tutaj kolejne cyfry lub litery. O kolejność na liście nie musisz się martwić: to zadanie wykonuje przeglądarka. Jeśli zmienisz listę (usuń lub dodasz pozycję nie w kolejności), przeglądarka przeliczy ją i wyświetli poprawnie.
Tagi służą do tworzenia list numerowanych
I
definiuje początek i koniec listy, tag
zastąpiony przez
.
- Kamień
- Nożyczki
- Papier
Ponieważ w przypadku list numerowanych sprawy nie zawsze są takie proste, w przypadku tagu
utworzył następujące atrybuty (uwaga: poniżej znajduje się tylko lista numerowana):
1. typ. Atrybut ten umożliwia numerowanie listy nie tylko cyframi arabskimi, ale także cyframi rzymskimi lub literami łacińskimi różnej wielkości liter. typ obsługuje wartości 1 (domyślnie), a, A, i, I (spróbuj sam z nimi poeksperymentować).
2. start. Numeracja nie zawsze musi zaczynać się od jedynki. Atrybut ten umożliwia ustawienie wartości początkowej - numeru pierwszego elementu listy. Można w nim określić, że raport zaczyna się na przykład od cyfry 100 lub litery K.
3. wywrócony. Jeśli lista nie powinna wynosić od 1 do 10, ale od 10 do 1, wówczas należy użyć tego atrybutu. Jeśli jest określony, numeracja będzie odwrotna.
Aby przypisać dowolny numer elementowi znajdującemu się na środku listy należy użyć w tagu
Zmieniając numer jednego elementu na środku listy, zmienisz numerację wszystkich elementów po nim - raport zacznie się od wartości zawartej w atrybucie value. Na przykład, jeśli elementowi 18 przypiszesz liczbę 35, to elementy następujące po nim będą miały numery nie 19, 20, 21, ale 36, 37, 38.
Lista definicji
Typ listy, który nie jest tak dobrze znany, jak te omówione powyżej. Zawiera terminy i ich definicje. Utworzono przy użyciu tagów:
- kontener zawierający listę.
Zakres stosowania list definicyjnych obejmuje glosariusze, podręczniki, testy, słowniki i inne pojemne zestawienia typu „Termin - wyjaśnienie”.
Oto przykładowa lista definicji:
- Deskryptor
- Podstawowa jednostka języka znaczników, znana wszystkim jako „Tag”.
- Atrybut
- Właściwość tagu, która ją daje dodatkowe funkcje projekt tekstu.
- Etykieta
- Pojedynczy tag, który nie musi być zamykany.
Lista składająca się z list zagnieżdżonych jedna w drugiej. Może zawierać listy różnych typów. Trudność tworzenia polega na zachowaniu prawidłowego zagnieżdżenia tagów, gdyż w wielopoziomowej strukturze łatwo się pogubić.
Oto przykład lista wielopoziomowa:
- Strukturalny
- Pascal
- Oberona
- Otchłań
- Zorientowany obiektowo
- Jawa
- Funkcjonalny
- Seplenienie
- Pyton
HTML udostępnia specjalny zestaw znaczników do prezentacji informacji w formie list. Listy są jedną z najczęściej stosowanych form prezentacji danych, zarówno w dokumenty elektroniczne i w druku. Z listami spotykamy się niemal codziennie – może to być lista niezbędnych zakupów w sklepie, uczniów na zajęciach, czy po prostu rzeczy do zrobienia. Możliwość organizowania struktur list jest dostępna w wielu redaktorzy tekstu w szczególności potężny edytor tekstu Microsoft Word posiada wygodne narzędzia do formatowania list różnego typu (możliwości tworzenia list HTML za pomocą programu Microsoft Word zostały omówione w rozdziale 8). Oto kilka przypadków, w których korzystanie z list jest całkiem wygodne:
- Łączenie fragmentów informacji w jedną strukturę w celu stworzenia czytelnego wyglądu.
- Opis złożonych procesów krok po kroku.
- Układ informacji w formie spisu treści, z akapitami wskazującymi odpowiednie sekcje dokumentu.
Należy pamiętać, że powyższe punkty są precyzyjnie zorganizowane w formie struktury listowej.
HTML udostępnia następujące główne typy list: lista punktowana, numerowana i lista definicji. Aby zaimplementować listy różne typy Używane są następujące tagi:
- ,
- (LI - element listy, element listy). Etykietka
- nie wymaga odpowiedniej zawieszki zamykającej, chociaż jej obecność w zasadzie nie jest zabroniona. Przeglądarki zwykle rozpoczynają każdy nowy element listy w nowym wierszu podczas wyświetlania dokumentu.
Podane informacje są wystarczające do skonstruowania podstawowej listy punktowanej. Podajmy przykład dokumentu HTML wykorzystującego listę punktowaną, której wyświetlanie przez przeglądarkę pokazano na ryc. 2.1.
Przykład listy punktowanej - Baran
- Byk
- Bliźnięta
- Rak
- Lew
- Panna
- Waga
- Skorpion
- Strzelec
- Koziorożec
- Wodnik
- Ryba
Znaki zodiaku:
Ryż. 2.1. Wyświetlanie w przeglądarce listy punktowanej
Należy pamiętać, że oprócz elementów listy oznaczonych tagiem
- , mogą występować inne elementy HTML. W powyższym przykładzie jednym z tych elementów jest zwykły tekst, który nie jest pozycją listy, ale pełni funkcję jej tytułu.
Notatka
Niektóre podręczniki dotyczące języka HTML wskazują, że do ustawienia tytułu listy należy użyć znacznika kontenera.
(LH - nagłówek listy, nagłówek listy). Ten tag nie jest obecnie rozpoznawany przez żadną popularną przeglądarkę i nie jest częścią specyfikacji HTML. Tym samym jego użycie staje się bezcelowe, choć nie spowoduje żadnych błędów. W tagu
- można określić dwa parametry: COMPACT i TYPE.
- .
Przykładowy wpis:
-
.
Notatka
Przeglądarki różnie interpretują typ tokena element indywidualny lista. Przeglądarka Netscape zmienia wygląd znacznika dla tego i wszystkich kolejnych, aż do momentu napotkania kolejnej redefinicji wyglądu znacznika. Przeglądarka internetowa Explorer zmienia wygląd znacznika tylko dla tego elementu.
Graficzne znaczniki listy
Możesz używać obrazów graficznych jako punktorów list, co jest powszechnie stosowane do tworzenia atrakcyjnych, dobrze zaprojektowanych dokumentów HTML. W rzeczywistości takiej możliwości nie zapewnia bezpośrednio język HTML, ale jest ona implementowana nieco sztucznie. Nie oznacza to, że nie jest to zalecane czy naganne, a jedynie, że nie będą tu stosowane żadne specjalne konstrukcje języka HTML.
Aby zrozumieć ideę, należy zrozumieć mechanizm implementacji list na stronach HTML. Okazuje się, że tag list
- (podobnie jak zresztą tagi list innych typów, omówione poniżej) wykonuje jedno zadanie - informuje przeglądarkę, że wszystkie informacje znajdujące się za tym tagiem powinny zostać wyświetlone przesunięte w prawo (wcięte) o określoną wartość. Tagi
- , które wskazują poszczególne elementy listy, udostępniają standardowe znaczniki elementów listy.
Jeśli potrzebujemy zbudować listę ze znacznikami graficznymi, możemy w ogóle obejść się bez tagów
- . Wystarczy wstawić żądany obraz graficzny przed każdym elementem listy. Jedynym problemem do rozwiązania jest oddzielenie elementów listy od siebie. Możesz w tym celu użyć znaczników akapitu
Lub wymuś przesunięcie wiersza
. Przykład realizacji listy ze znacznikami graficznymi, której wyświetlanie pokazano na rys. 2.2 pokazano poniżej:Lista punktowana Znaki zodiaku:
Baran
Ryż. 2.2. Lista punktowana z punktorami graficznymi
W powyższym przykładzie znacznikiem elementu listy jest plik graficzny Green_ball.gif. Należy pamiętać, że wykorzystanie grafiki na stronach HTML może znacznie zwiększyć ilość przesyłanych informacji. Jednak w w tym przypadku wzrost ten jest wyjątkowo mały. Tutaj ten sam plik jest używany dla wszystkich znaczników,
który zostanie przesłany tylko raz. Rozmiary plików małego obrazu są również bardzo małe.
Notatka
Techniki tworzenia list z punktorami graficznymi zostały omówione kolejno w Rozdziale 8.
Lista numerowana
Innym typem listy zaimplementowanym w HTML jest lista numerowana. W przeciwnym razie listy tego typu nazywane są uporządkowanymi. Nazwisko jest często używane jako formalne tłumaczenie nazwy odpowiedniego znacznika
- , za pomocą których listy tego typu są organizowane w dokumentach HTML (OL - Ordered List, uporządkowana lista).
- .
Oto przykład dokumentu HTML wykorzystującego listę numerowaną: którego pokazanie przeglądarkę pokazano na rys. 2.3.
Przykład listy numerowanej - Syriusz
- K anopus
- Arktur
- Alfa Centauri
- Vega
- Apel K
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Wetelgeza
- Aldebarana
. . .- Mizar
. . .- Polarny
Najjaśniejsze gwiazdy widoczne z Ziemi:
Ryż. 2.Z. Lista numerowana
W tagu
- Można określić następujące parametry: COMPACT, TYPE i START.
- .
Przykładowy wpis:
- .
Parametr znacznika START
- pozwala rozpocząć numerowanie listy od czegoś innego niż jeden. Wartość parametru START musi być zawsze liczbą naturalną, niezależnie od rodzaju numeracji list. Oto przykład:
- dla list numerowanych pozwala na użycie parametrów TYPE i VALUE. Parametr TYPE może przyjmować takie same wartości jak dla tagu
- .
- .
Notatka
Przeglądarki różnie interpretują typ numeracji poszczególnych elementów listy. Przeglądarka Netscape zmienia typ numeracji tego elementu i wszystkich kolejnych, aż do następnego przesłonięcia. Internet Explorer zmienia wygląd liczby tylko dla tego elementu.
Zwartość parametru tagu VALUE
- - umożliwia zmianę numeru danego elementu listy. Zmienia to numerację wszystkich kolejnych elementów. Typową aplikacją są listy, w których brakuje niektórych elementów. Przykład takiej listy podano powyżej (ryc. 2.3). Zawiera uporządkowaną listę najjaśniejszych gwiazd, w której 58. i 75. miejsce zawiera gwiazdy dobrze widoczne na naszych szerokościach geograficznych (Mizar jest najjaśniejszą gwiazdą w konstelacji Wielkiej Niedźwiedzicy, a Polaris jest najjaśniejszą gwiazdą w konstelacji Wielkiej Niedźwiedzicy) .
Podajmy kolejny oryginalny przykład zastosowania różnych typów numeracji. Poniższy kod HTML zawiera trzy listy o różnej numeracji. Dla ułatwienia przeglądania każda z list umieszczona jest w osobnej komórce tabeli. Wszystkie trzy listy są identyczne i różnią się jedynie rodzajem numeracji: w pierwszej kolumnie tabeli znajdują się cyfry arabskie, w drugiej – rzymskie, a w trzeciej numeracja jest prowadzona literami łacińskimi. Należy pamiętać, że elementy listy są puste, tj. po dowolnym tagu
- nie ma danych. Przykładem tego rodzaju może być tabela zgodności zapisu liczb cyframi arabskimi i rzymskimi. Okazuje się, że generatorem takiej tabeli może być dowolna przeglądarka obsługująca listy (rys. 2.4), wystarczy wpisać podany kod HTML. Numeracja cyframi rzymskimi działa poprawnie aż do wartości 3999. Studiując prawą kolumnę, możesz zrozumieć, jak odbywa się numeracja literami rzymskimi. Po wyczerpaniu jednoliterowej numeracji (od A do Z) za kolejną liczbę przyjmuje się pierwszą dwuliterową liczbę - AA itp.
Stosowanie różnych typów numeracji w listach -
. . .
-
. . .
-
. . .
Ryż. 2.4. Różne typy numeracji list HTML
Lista definicji
Listy definicji, zwane także słownikami definicji, są specjalnym rodzajem list. W przeciwieństwie do innych typów list, każdy element listy definicji zawsze składa się z dwóch części. Pierwsza część elementu listy zawiera definiowany termin, a druga część zawiera tekst w formie hasła słownikowego, który ujawnia znaczenie terminu.
Listy definicji są określane przy użyciu znacznika kontenera
- (Lista definicji). Wewnątrz pojemnika z metką
- (Definicja terminu) definiowany termin jest zaznaczony i znacznik
- (Opis definicji) - akapit z jej definicją. Dla tagów
- I
- Możesz pominąć odpowiednie znaczniki zamykające.
Ogólnie lista definicji jest zapisana w następujący sposób:
- Termin
- Definicja terminu
W tekście po tagu
- nie można używać elementów na poziomie bloku, takich jak znaczniki akapitu
Lub nagłówki
-
. Co do zasady, tekst definiowanego terminu powinien znajdować się w jednej linii. Tekst zawierający definicję terminu wyświetlany jest od następnej linii (lub każdej linii w przypadku niektórych przeglądarek) po definicji terminu, wcięty w prawo. W informacji umieszczonej po tagu
- można zlokalizować elementy na poziomie bloków. Wynika z tego w szczególności, że listy definicji mogą być zagnieżdżane.
W tagu
- można podać parametr COMPACT, którego przeznaczenie jest podobne do pozostałych list opisanych powyżej.
- Osoba flegmatyczna
- Pasywny, bardzo pracowity, powolny w adaptacji;
stabilny nastrój, mało podatny na wpływy zewnętrzne;
letarg reakcji emocjonalnych i powolność wolicjonalnej aktywności
- Optymistyczny
- Aktywny, energiczny, elastyczny, -
żywotność i ruchliwość reakcji emocjonalnych, szybkość i siła przejawów wolicjonalnych
- Choleryczny
- Aktywny, bardzo energiczny, wytrwały;
porywczość i siła reakcji emocjonalnych, gwałtowne przejawy woli
- Melancholijny
- Pasywny, łatwo się męczy, trudno się przystosowuje, -
słabość przejawów wolicjonalnych i przewaga obniżonego nastroju, zwątpienie - Zempia
- Księżyc
- Mapac
- Fobos
- Deimos
- Uran
- Ariel
- Umbriel
- Tytania
- Oberona
- Miranda
- Neptun
- Tryton
- Nereida
Główne zastosowania list:
Numerowane - aby wyświetlić listę kolejnych elementów w ściśle określonej kolejności.
Punktowane — aby wyświetlić listę elementów w losowej kolejności.
Wielopoziomowy - aby określić informacje o niektórych elementach.
Lista definicji - używana do formatowania słowników.
Strona HTML z listą numerowaną
Tagi służą do tworzenia list numerowanych
-
Etykietka
-
Domyślnie elementy listy są numerowane w kolejności 1, 2, 3... Za pomocą atrybutu TYPE możesz zmienić styl numerowania.
Wartość Numeracja TYP A A, B, C.. a a, b, c.. I I, II, III.. i i, ii, iii.. 1 1. 2. 3..
Jeśli już dodasz istniejąca lista nowe wartości, przeglądarka automatycznie je przeliczy.
Za pomocą atrybutów START VALUE możesz zmienić kolejność numeracji listy.
START - służy do podania numeru początkowego listy, innego niż 1.
WARTOŚĆ - umożliwia przypisanie dowolnej liczby dowolnemu elementowi listy.
Przykład:
Strona HTML z listą punktowaną
Tagi służą do tworzenia list punktowanych
- wskazać początek/koniec pojedynczego elementu listy.
Domyślnie elementy listy są oznaczone czarnym kółkiem. Atrybut TYPE może służyć do zmiany stylu oznakowania.
W obrębie tej samej listy można używać różnych oznaczeń elementów listy.
Przykład:
Strona HTML z listą wielopoziomową
Do tworzenia list wielopoziomowych można używać list punktowanych, numerowanych albo ich kombinacji. Listę wielopoziomową tworzy się poprzez zagnieżdżenie jednej listy w treści drugiej. Głównym zadaniem nie jest pomylić się. W tym celu radzę zrobić różne wcięcia dla poszczególnych list.
Listy definicji stron HTML
Do tworzenia list definicji wykorzystywane są trzy znaczniki:
- - początek/koniec listy.
- - początek/koniec określonego terminu.
- - początek/koniec artykułu wyjaśniającego termin.
Tagi
- I
- nie ma potrzeby zmieniać. Te. Można „powiązać” kilka terminów z jedną definicją i odwrotnie.
Przykład:
Kod HTML:
- Termin 1
- Streszczenie 1 do semestru 1
- Streszczenie 2 do semestru 1
Wyświetlacz przeglądarki:
Termin 1 Streszczenie 1 do semestru 1 Streszczenie 2 do semestru 1Ponieważ na tej stronie do niektórych elementów zastosowano określone style, ich wyświetlanie w tabeli różni się nieco od tego, co otrzymasz.
Listy wypunktowane umożliwiają podzielenie dużego tekstu na osobne bloki, z których każdy zaczyna się od wypunktowania – zwykle małej kropki. Przyciąga to uwagę czytelnika do tekstu i zwiększa jego czytelność.
Z elementem
- Związane są następujące funkcje:
- w miejscu, w którym to następuje
- , przeglądarka automatycznie dodaje podział wiersza;
- lista ma wcięcia na górze i na dole;
- Domyślnie znaczniki są wyświetlane jako wypełnione kółko;
- Każdy element listy jest przesunięty w prawo w stosunku do tekstu głównego.
- dysk - znaczniki w formie wypełnionego koła;
- okrąg - znaczniki w formie otwartego koła;
- kwadrat - kwadratowe znaczniki.
- Sepulki
- Sepulkaria
- Sepulacja
- To nie zadziała, więc będziesz musiał to obejść. Aby to zrobić, ukryj znaczniki listy za pomocą właściwości list-style o wartości none i w tekście przed treścią
- Dodajemy własny znak za pomocą pseudoelementu ::before. W przykładzie 2 trójkąt pełni rolę takiego znacznika.
Przykład 2: Użycie::przed
Listy - Sepulki
- Sepulkaria
- Sepulacja
Wynik tego przykładu pokazano na ryc. 2. Ponieważ użycie właściwości list-style o wartości none w ogóle nie usuwa znaczników, a jedynie ukrywa je, lista wydaje się przesunięta w prawo. Aby pozbyć się tej funkcji, w przykładzie dodano właściwość wcięcia tekstu o wartości ujemnej. Jego zadaniem jest przesunięcie tekstu o jeden znak w lewo.
Ryż. 2. Dowolne znaczniki na liście
Znak nie musi być w formacie szesnastkowym; można go wstawić bezpośrednio do tekstu. Najważniejsze jest, aby zapisać dokument w kodowaniu UTF-8 i aby edytor to obsługiwał. Same znaki i ich kody można pobrać np. z LibreOffice Writer (ryc. 3).
Ryż. 3. Wybór symbolu w LibreOffice
Lista z ręcznie rysowanymi znacznikami
Style umożliwiają ustawienie dowolnego odpowiedniego obrazu jako znacznika za pomocą właściwości list-style-image. Wartością jest względna lub bezwzględna ścieżka do pliku graficznego, jak pokazano w przykładzie 3.
Przykład 3: Używanie obrazu jako znacznika
Listy - Sepulki
- Sepulkaria
- Sepulacja
Najlepiej wybrać mały obrazek, aby nie zamienić elementów listy w podpisy. Na ryc. Rysunek 4 przedstawia wynik przykładowego wykorzystania małych obrazków jako znaczników.
Ryż. 4. Rysunek jako marker
Używanie obrazu w stylu listy ma pewne wady:
- wzoru nie można przesuwać w górę ani w dół;
- Położenie obrazu względem tekstu może się różnić w różnych przeglądarkach.
Tych niedociągnięć można uniknąć, korzystając z właściwości tła, która ustawia obraz tła. Dla każdego elementu listy
- usuwamy oryginalne znaczniki i ustawiamy obraz tła bez powtarzania. Aby tekst nie pojawił się na górze obrazka, przesuwamy go w prawo za pomocą dopełnienia w lewo (przykład 4).
Przykład 4: Używanie tła
Ul ( lewy margines: -1em; ) li ( styl listy: brak; tło: url(images/bullet.png) bez powtórzeń 0 2px; dopełnienie po lewej stronie: 20px; )
Położenie tekstu i punktora
Znacznik względem tekstu można umieścić na dwa sposoby: znacznik zostaje przesunięty poza granicę elementów listy lub owinięty wokół tekstu (rys. 5).
wewnątrz poza Ryż. 5. Rozmieszczenie znaczników względem tekstu
Aby kontrolować położenie znaczników, użyj właściwości list-style-position. Ma ono dwa znaczenia: na zewnątrz – punktory umieszczane są na zewnątrz bloku tekstu (jest to wartość domyślna) oraz wewnątrz – punktory są częścią bloku tekstu i są wyświetlane w elemencie listy (przykład 5).
Przykład 5: Zmiana położenia znaczników
Listy - Zanim zaczniesz, sprawdź, czy wyposażenie zawarte w zestawie 3BM jest dołączone.
- W przypadku braku jednego lub większej liczby urządzeń peryferyjnych należy niezwłocznie skontaktować się z obsługą techniczną BOK.
- Po wizualnej kontroli obszaru roboczego możesz ostrożnie włączyć zasilanie 3BM.
Wynik tego przykładu pokazano na ryc. 6.
Korzystając z list HTML, możesz utworzyć menu dla swojej witryny z różnymi elementami i podelementami. Za pomocą list tworzona jest treść (mapa) witryny, co jest bardzo wygodne dla wyszukiwarek.
I tak istnieją znaczniki „” - definiują one listę punktowaną.
Tagi „” – definiują pozycje, czyli elementy listy punktowanej.Najpierw utwórzmy prostą listę kilku pozycji:
<HTML > <głowa > <tytuł > Prosta lista punktowana w formacie HTMLtytuł > głowa > <ciało > <ul > <ja > Jedenja > <ja > Dwaja > <ja > Trzyja > <ja > Czteryja > ul > ciało > HTML >- Trzy
W przypadku oznaczeń HTML można ustawić niektóre typy zapisane wewnątrz
pierwszy tag”- „W wpisz=""
- Cztery
- Cztery
- Rtęć
- Wenus
- Ziemia
- Jupiter
- Saturn
- Neptun
- Pluton
- tytuł „wstaw kolejną listę, a następnie zamknij ją drugim tagiem”
Stwórzmy listę, w której zamiast punktów będą małe kółka (kropki przebite). Ten typ nazywa się „ koło"
<HTML > <głowa > <tytuł > Lista punktowana w formacie HTMLtytuł > głowa > <ciało > <typ ul= "koło"> <ja > Jedenja > <ja > Dwaja > <ja > Trzyja > <ja > Czteryja > ul > ciało > HTML >Teraz zamiast typu „okrąg” ustawmy „typ” kwadrat" (kwadraty)
<HTML > <głowa > <tytuł > Lista punktowana w formacie HTMLtytuł > głowa > <ciało > <typ ul= "kwadrat"> <ja > einja > <ja > zweija > <ja > Dreija > <ja > vierja > ul > ciało > HTML >Lekcje CSS obejmują szczegółową pracę z listami, z których można dowiedzieć się, jak ustawić kolory dla elementów i tekstu w nich, a także jak ustawić typ samego znacznika (może to być nie tylko kwadrat
lub kropka – może to być niemal dowolny symbol).Listy numerowane html Listy można nie tylko oznaczać, ale także numerować, bo czasami jest to konieczne. Mogą to być cyfry (1, 2, 3...) oraz litery alfabetu angielskiego pisane małymi i dużymi literami. Rozważ wszystko, co opisano powyżej.
Do ustalenia numeracji wykorzystywane są znaczniki „”.
Typ jest określony wewnątrz pierwszego tagu.Numerowanie według liczb (od jednego)
<HTML > <głowa > <tytuł > Numerowane listahtmltytuł > głowa > <ciało > <ol > <ja > Razja > <ja > Dwaja > <ja > Trzyja > <ja > Czteryja > ol > ciało > HTML >Jeśli chcesz, aby numeracja zaczynała się od zera (zero) lub na przykład od trzech, musisz napisać tagi w pierwszym zacznij="" i wymagany numer.
<HTML > <głowa > <tytuł > Lista numerowana htmltytuł > głowa > <ciało > <stary początek= "0" > <ja > zeroja > <ja > jedenja > <ja > dwaja > <ja > trzyja > ol > ciało > HTML >Przyjrzyjmy się teraz, jak ustawić „numerację liter”.
małymi literami:
<HTML > <głowa > <tytuł > Listy numerowane htmltytuł > głowa > <ciało > <stary typ = "A"> <ja > Rtęćja > <ja > Wenusja > <ja > Ziemiaja > <ja > Marsja > ol > ciało > HTML >wielkimi literami:
<HTML > <głowa > <tytuł > Numerowane listy HTMLtytuł > głowa > <ciało > <stary typ = "A"> <ja > Jupiterja > <ja > Saturnja > <ja > Uranja > <ja > Neptunja > <ja ><b> Plutonb>ja > ol > ciało > HTML >Oprócz zwykłych list w formacie HTML możesz tworzyć listy wielopoziomowe, czyli podsekcje dla określonych pozycji. Aby to zrobić, po tagu i tytule „
"
<HTML >
<głowa >
<tytuł > Lista wielopoziomowa HTMLtytuł >
głowa >
<ciało >
<typ ul= "kwadrat" >
<ja > Skrzypceja >
<ja > Gitara<ul >
<ja > klasycznyja >
<ja > gitara rytmicznaja >
<ja > gitara elektrycznaja >
ul >
ja >
<ja > Bębnyja >
<ja > Dudoczkaja >
ul >
ciało >
HTML >
- Skrzypce
- Gitara
- klasyczny
- gitara rytmiczna
- gitara elektryczna
- Bębny
- Dudoczka
Rysunek 1 przedstawia wynik przykładu ilustrującego powyższe cechy listy punktowanej.
Ryż. 1. Widok listy punktowanej
Typ znacznika
Znaczniki mogą przybierać jedną z trzech form: wypełnione koło (domyślnie), otwarte koło i kwadrat. Aby wybrać typ znacznika, użyj właściwości list-style-type lub uniwersalnej właściwości list-style (przykład 1). Obowiązują następujące wartości:
Przykład 1: Zmiana wyglądu znacznika
Listy Przykład pokazuje, jak utworzyć listę punktowaną, używając małego kwadratu w jednolitym kolorze jako ikony punktora. Choć liczba wartości jest ograniczona do trzech, nie oznacza to, że do dyspozycji mamy tylko trzy rodzaje znaczników. Istnieje wiele znaków specjalnych, które z powodzeniem mogą pełnić funkcję ikony znacznika. Przykręć je bezpośrednio do
Następna lekcja będzie poświęcona tworzeniu prostego menu w oparciu o wiedzę zdobytą podczas tej lekcji.
Etykietka
- Zaznaczany jest początek/koniec całej listy.
Etykietka
- wskazać początek/koniec pojedynczego elementu listy.
Etykietka
-
Oto przykład dokumentu HTML, który wykorzystuje listę definicji:
Przykład listy definicji Klasyfikacja typowych temperamentów człowieka,
na podstawiena poglądach Hipokratesa
Wygląd danego dokumentu HTML w przeglądarce pokazany jest na rys. 2.5.
Ryż. 2.5. Lista definicji (podobna do grupy haseł w słowniku)
Typ list
I - .
Listy tego typu zostały pierwotnie zaprojektowane tak, aby były bardziej zwarte niż zwykłe listy punktowane. Zgodnie z zasadami pisania elementów tych list, nie wolno było w nich stosować elementów blokowych, co oznacza, że nie można było realizować zagnieżdżania list tego typu. Każdy element listy był jednym wierszem tekstu.
Dla list takich jak
planowano wprowadzenie ograniczenia „długości tekstu elementu listy (24 znaki). Takie ograniczenie pozwoliłoby nam wyprowadzić listy jak
w formie podobnej do wyświetlania katalogów w systemy operacyjne UNIX i MS-DOS w przypadku użycia przełącznika /W (wiele kolumn). Ponadto dla elementów listy tego typu nie były wyświetlane znaczniki. Obecnie wszystkie te plany nie zostały wdrożone, gdyż nie zaleca się dalszego korzystania z tego typu list. Nowoczesne wersje przeglądarek wyświetlają listy tego typu dokładnie w taki sam sposób, jak listy podobne
- .
Zagnieżdżone listy
Są chwile, kiedy trzeba uwzględnić całą listę tego samego lub innego typu w elemencie listy jednego typu. Spowoduje to utworzenie list wielopoziomowych lub zagnieżdżonych. HTML pozwala na dowolne zagnieżdżanie różnych typów list, ale należy zachować ostrożność podczas ich organizowania.
Poniżej znajduje się kod HTML dokumentu z zagnieżdżonymi listami, którego wyświetlanie pokazano na rys. 2.6. W tym przykładzie każdy element listy punktowanej zawiera własną listę numerowaną.
Przykład listy zagnieżdżonej Satelity niektórych planet
- można zlokalizować elementy na poziomie bloków. Wynika z tego w szczególności, że listy definicji mogą być zagnieżdżane.
-
P przykładowy wpis:
- .
- .
Wpis ten określa numerację wykazu rozpoczynającą się od dużej litery łacińskiej „E”. Dla pozostałych typów numeracji wpis START=5 ustawi numerację odpowiednio od liczby „5”, cyfry rzymskiej „V” itd.
Zmianę rodzaju numeracji listy oraz wartości liczbowych można dokonać dla dowolnego elementu listy. Etykietka
- dla list numerowanych pozwala na użycie parametrów TYPE i VALUE. Parametr TYPE może przyjmować takie same wartości jak dla tagu
Parametr COMPACT ma takie samo znaczenie jak listy punktowane. Parametr TYPE służy do określenia typu numeracji list. Może przyjmować następujące wartości:
TYPE = A - ustawia znaczniki w postaci wielkich liter łacińskich;
TYPE = a - ustawia znaczniki w postaci małych liter alfabetu łacińskiego;
TYPE = I - ustawia znaczniki w postaci dużych cyfr rzymskich;
TYPE = i - ustawia znaczniki w postaci małych cyfr rzymskich;
TYP = 1 - ustawia znaczniki w postaci cyfr arabskich.
Wartość domyślna to zawsze TYP = 1, czyli numeracja przy użyciu cyfr arabskich. Dotyczy to również zagnieżdżonych list numerowanych. Tutaj, w przeciwieństwie do list punktowanych, przeglądarki domyślnie nie różnicują numeracji na różnych poziomach zagnieżdżenia list. Należy pamiętać, że po numerze elementu listy zawsze znajduje się dodatkowy znak „kropka”.
Parametr TYPE o tych samych wartościach może służyć do określenia stylu numeracji poszczególnych elementów listy. W tym celu w znaczniku elementu listy można podać parametr TYPE z odpowiednią wartością
Listy tego typu zazwyczaj reprezentują uporządkowaną sekwencję poszczególnych elementów. Różnica w stosunku do list punktowanych polega na tym, że na liście numerowanej każdy element jest automatycznie poprzedzany numerem seryjnym. Rodzaj numeracji zależy od przeglądarki i można go ustawić za pomocą parametrów znaczników listy. W przeciwnym razie implementacja list numerowanych jest bardzo podobna do implementacji list punktowanych.
Tagi
- I
Aby utworzyć listę numerowaną, należy użyć znacznika kontenera, wewnątrz którego znajdują się wszystkie elementy listy. Tagi listy otwierającej i zamykającej zapewniają podział wiersza przed i po liście, oddzielając w ten sposób listę od głównej zawartości dokumentu.
Podobnie jak w przypadku listy punktowanej, każdy element na liście numerowanej musi zaczynać się od znacznika
- , które wskazują poszczególne elementy listy, udostępniają standardowe znaczniki elementów listy.
Parametr COMPACT jest zapisywany bez wartości i służy do wskazania tego przeglądarce tę listę należy przedstawić w zwartej formie. Na przykład czcionka lub odległość między wierszami listy itp. może zostać zmniejszona.
Notatka
Obecnie obecność parametru COMPACT w tagu
- nie wpływa w żaden sposób na wyświetlanie list w wiodących przeglądarkach. Dlatego używanie tego parametru nie ma sensu, zwłaszcza, że jego użycie nie jest zalecane przez specyfikację HTML 4.0.
Parametr TYPE może przyjmować wartości: krążek, okrąg i kwadrat. Ten parametr służy do wymuszania wyglądu punktorów listy. Dokładny typ znacznika będzie zależał od przeglądarki, z której korzystasz. Typowe opcje wyświetlania są następujące:
TYPE = dysk - znaczniki wyświetlane są w postaci wypełnionych okręgów; TYP = okrąg - znaczniki wyświetlane są jako otwarte okręgi; TYP = kwadrat - znaczniki wyświetlane są jako wypełnione kwadraty. Przykładowy wpis:
-
.
Wartość domyślna to TYP = płyta. W przypadku zagnieżdżonych list punktowanych wartością domyślną jest krążek na pierwszym poziomie, okrąg na drugim poziomie, kwadrat na trzecim poziomie i dalej. To jest dokładnie to, co się robi najnowsze wersje Przeglądarki Netscape i Internet Explorera. Należy pamiętać, że inne przeglądarki mogą wyświetlać znaczniki inaczej. Na przykład w specyfikacji HTML 4.0 typ znacznika wyświetlanego, gdy TYPE = kwadrat jest określony jako kwadratowy kontur.
Parametr TYPE o tych samych wartościach może służyć do określenia typu znaczników dla poszczególnych elementów listy. W tym celu w znaczniku elementu listy można podać parametr TYPE z odpowiednią wartością
- .
- ,
- ,
- , za pomocą których listy tego typu są organizowane w dokumentach HTML (UL - Unordered List, unordered list).
Używana jest lista punktowana znaki specjalne, zwane znacznikami list (często nazywane punktorami, co jest formalną wymową angielskiego terminu bullet). O wyglądzie znaczników list decyduje przeglądarka, a podczas tworzenia list zagnieżdżonych przeglądarki automatycznie różnicują wygląd znaczników na różnych poziomach zagnieżdżenia.
Tagi I<LI >
Aby utworzyć listę punktowaną, należy skorzystać z kontenera tagów, w którym znajdują się wszystkie elementy listy. Tagi listy otwierającej i zamykającej zapewniają podział wiersza przed i po liście, oddzielając w ten sposób listę od głównej treści dokumentu, więc nie ma potrzeby używania tutaj znaczników akapitu
.
Każdy element listy musi zaczynać się od znacznika
