Hvilken etikett brukes for å åpne listen over definisjoner. Opprette lister i HTML. De klareste stjernene er synlige fra jorden

En punktliste defineres ved å legge til en liten markør, vanligvis en fylt sirkel, før hvert listeelement. Selve listen er dannet ved hjelp av en beholder

, og hvert listeelement starter med taggen
• som vist under.
  • Første punkt
  • Andre punkt
  • Tredje ledd

  Listen må inneholde en avsluttende kode.

Eksempel 11-1 er HTML-koden for å legge til en punktliste på en nettside.

Eksempel 11.1. Lag en punktliste

• Cheburashka
• Krokodille Gena
• Shapoklyak
• Rotte Larisa

Resultatet av dette eksemplet er vist i fig. 11.1.

Ris. 11.1. Punktlistevisning

Legg merke til polstringen øverst, nederst og til venstre på listen. Slike innrykk legges til automatisk.

Markører kan ha en av tre former: sirkel (standard), sirkel og firkant. Typeattributtet til taggen brukes til å velge markørstilen.

. Tillatte verdier er gitt i tabellen. 11.1
Tab. 11.1. List opp kulestiler

Listetype	HTML-kode	Eksempel
Liste med kuler i form av en sirkel		Først Sekund Den tredje
Liste med kuler i form av en sirkel		Først Sekund Den tredje
Liste med firkantede kuler		Først Sekund Den tredje

Utseendet til markører kan variere litt i ulike nettlesere, samt når du endrer font og tekststørrelse.

Å lage en liste med firkantede markører er vist i eksempel 11.2.

Eksempel 11.2. Type markører

Endre tro

• endring av religiøs tro (å velge mellom: buddhisme, konfucianisme, hinduisme). Spesialtilbud - jødedom og islam sammen;
• en endring i troen på det elskede partiets ufeilbarlighet;
• troen på at romvesener eksisterer;
• preferanse for et politisk system, som det beste i sitt slag (å velge mellom: føydalisme, sosialisme, kommunisme, kapitalisme).




Resultatet av dette eksemplet er vist i fig. 11.2.

- 4,5 av 5 basert på 2 stemmer

Svært ofte må viss informasjon på nettstedet presenteres i form av lister.

Lister lar deg organisere og systematisere forskjellig informasjon og presentere den for besøkende i en praktisk form.

Lister i HTML finnes i tre varianter: punktlister, nummererte lister og definisjonslister. La oss se hvordan du lager dem i rekkefølge.

Merket liste.

Denne typen liste er den mest brukte. Punktliste i HTML lages ved hjelp av tagger

• . Samtidig legges det til en markør overfor hvert element i listen, som standard er det en markør i form av en sirkel. Ved hjelp av tagger opprettes en beholder, der elementene i listen er plassert: .

  Punktlistekoden vil se slik ut:

  • Alternativ som dette
  • Dette alternativet
  • Et slags alternativ

  Du kan prøve å lage en HTML-side ved å bruke denne koden, og du vil få følgende liste som et resultat:

  

  Som du kan se, er hvert element i listen plassert på en ny linje, med visse innrykk til venstre, øverst og nederst. Hvert element i listen starter med et punkt, som kan være en fylt sirkel (brukt som standard), en sirkel eller en firkant. stikkord

  det er en type attributt, ved hjelp av hvilken stilen til markøren er satt. Dette attributtet har følgende verdier:
  • plate - sirkel;
  • sirkel - sirkel;
  • firkantet - firkantet.

  Plateverdien brukes som standard.

  Et eksempel på å lage en punktliste med sirkelmarkører:

  • Alternativ som dette
  • Dette alternativet
  • Et slags alternativ

  Som et resultat vil listen ha følgende form:

  

  Opprette en punktliste med firkantede markører:

  • Alternativ som dette
  • Dette alternativet
  • Et slags alternativ

  Listen vil se slik ut:

  

  Typeattributtet kan brukes på mer enn bare en tag

  , men også til taggen
  • . På denne måten kan du lage en liste med en rekke markører.
    • Alternativ som dette
    • Dette alternativet
    • Et slags alternativ

    Resultatet blir følgende:

    

    Nummererte lister.

    Nummererte lister i HTML er lister der hvert element har et serienummer, nummererte lister opprettes ved hjelp av taggen

    og nestet i taggene

    1. 1. Første linje
       2. Andre linje
       3. tredje linje

       En slik liste ser slik ut:

       

       Standardnummereringen er arabiske tall. Men taggen

       det er et typeattributt, ved hjelp av verdiene som nummereringen kan gjøres med store (type="A") eller små bokstaver (type="a") latinske bokstaver, romertall i øvre (type= "I") og nedre (type="i") register.

       Nedenfor er forkortede versjoner av koden, og typen nummerering som kan være i ett eller annet tilfelle.

       Listevisning:

       Listevisning:

       

       Nummerering med små bokstaver i det latinske alfabetet:

       Listevisning:

       

       Listevisning:

       

       Listevisning:

       

       Liste over definisjoner i HTML.

       Lister med definisjoner er en spesiell type lister. De er forskjellige ved at hvert element i listen består av to elementer, et begrep og en tekst som avslører betydningen. Disse listene er opprettet ved hjelp av tagger

       . stikkord

       oppretter en beholder for listen, tag

       angir termen og taggen

       beskrivelse eller definisjon av et begrep.

       Denne listen er skrevet som følger:

       Termin 1

       Definisjon av begrep 1

       termin 2

       Definisjon av begrep 2

       termin 3

       Definisjon av begrep 3

       Dette vil resultere i følgende liste:

       

       Som du kan se, skaper dette passende innrykk for begrepet og definisjonsteksten.

       Nestede eller flernivålister i HTML.

       Noen ganger er det nødvendig å neste en annen liste i ett element i en bestemt type liste. HTML har muligheten til å neste lister på ubestemt tid innenfor elementer i andre lister.

       Her er for eksempel koden som legger nummererte lister i punktlisteelementer.

       • Alternativ som dette
         1. Første linje
         2. Andre linje
         3. tredje linje
       • Dette alternativet
         1. Første linje
         2. Andre linje
         3. tredje linje
       • Et slags alternativ
         1. Første linje
         2. Andre linje
         3. tredje linje

       Nummererte lister er et sett med elementer med deres serienumre. Type og type nummerering avhenger av parametrene til elementet

       , som brukes til å lage listen. Følgende verdier kan fungere som nummereringselementer:
       • Arabiske tall (1, 2, 3, ...);
       • Arabiske tall med innledende null for sifre mindre enn ti (01, 02, 03, ..., 10);
       • store latinske bokstaver (A, B, C, ...);
       • små latinske bokstaver (a, b, c, ...);
       • Romertall med store bokstaver (I, II, III, ...);
       • romertall med små bokstaver (i, ii, iii, ...);
       • armensk nummerering;
       • georgisk nummerering.

       Fra et praktisk synspunkt kan prinsippene for å vise elementene i en punktliste brukes på samme måte som en nummerert liste. Men gitt at vi har å gjøre med en oppregning, er det noen funksjoner som vil bli diskutert videre.

       Listenummerering

       Det er lov å starte listen med et hvilket som helst tall; elementets startattributt brukes til dette formålet

       eller verdi på elementet
       1. . Verdien er et hvilket som helst positivt heltall. Det spiller ingen rolle hvilken type nummerering som er satt, selv om latinske bokstaver brukes som en liste. Hvis både start- og verdiattributtene brukes på listen, har sistnevnte forrang og nummereringen starter fra tallet spesifisert av verdi , som vist i eksempel 1.

          Eksempel 1 - Endre nummereringen av listen

          4. Du bør ta godt vare på arbeidsplassen din.
          5. Juster belysningen i rommet slik at lyskilden er på siden eller bak operatøren.
          10. For å unngå medisinske komplikasjoner, anbefales det å velge en stol med et mykt sete.
          
          
          

          Det første elementet i listen i dette eksemplet vil starte med romertall IV, siden attributtet start="4" er spesifisert, deretter blir tallet V, og det siste elementet, ute av rekkefølge, tildelt tallet X (fig. 1).

          Ris. 1. Romertall i listen

          Skrive tall

          Som standard har en nummerert liste en viss form: først er det et tall, deretter et punktum, og etter det vises tekst atskilt med et mellomrom. Denne formen for skriving er visuell og praktisk, men noen utviklere foretrekker å se en annen måte å nummerere lister på. Nemlig å erstatte prikken med en lukkebrakett, som vist i fig. 2 eller noe lignende.

          

          Ris. 2. Type nummerert liste med parentes

          Stiler lar deg endre nummereringen av lister ved å bruke egenskapene for innhold og motvekst. Først må ol-velgeren settes til mot-tilbakestilling : element , dette er nødvendig slik at nummereringen i hver ny liste starter på nytt. Ellers vil nummereringen fortsette og i stedet for 1,2,3 vil du se 5,6,7. Vareverdien er en unik telleridentifikator, vi velger den selv. Deretter må du skjule de originale markørene gjennom stilegenskapen listestil med verdien ingen .

          Innholdsegenskapen fungerer vanligvis sammen med ::after og ::before pseudo-elementene. Så, li::before-konstruksjonen sier at før hvert element i listen, må noe innhold legges til (eksempel 2).

          Eksempel 2. Lage din egen nummerering

          Li::before ( innhold: counter(item) ") "; /* Legg til parenteser til tall */ counter-increment: item; /* Angi tellernavn */ )

          Innholdsegenskapen med verdien teller(element) gir ut et tall; ved å legge til en parentes, som vist i dette eksemplet, får vi ønsket type nummerering. Motvekst er nødvendig for å øke listetallet med én. Vær oppmerksom på at den samme identifikatoren, kalt element , brukes hele veien. Den endelige koden er vist i eksempel 3.

          Eksempel 3 - Endre listevisning

          1. Først
          2. Sekund
          3. Den tredje
          4. Fjerde
          
          
          

          På måten ovenfor kan du lage en hvilken som helst type nummerert liste, for eksempel ta et tall i hakeparenteser, i dette tilfellet vil bare én linje endres i stilene.

          Innhold: "[" counter(item) "] ";

          Liste med russiske bokstaver

          Det er en nummerert liste med latinske bokstaver, men det er ingen russiske bokstaver for listen. De kan tilsettes kunstig ved å bruke teknikken ovenfor. Siden nummereringen gjøres gjennom stiler, forblir selve listen original, bare den valgte klassen legges til den, la oss kalle den kyrilic (eksempel 4).

          Eksempel 4. Kode for å lage en liste

          1. En
          2. To
          3. Tre

          Bokstaver legges til ved å bruke ::before pseudo-elementet og innholdsegenskapen. Siden hver linje må ha sin egen bokstav, vil vi bruke pseudoklassen :nth-child(1), nummeret på bokstaven er skrevet i parentes. Den første bokstaven er selvfølgelig A, den andre er B, den tredje er C osv. Hele dette settet legges til li-velgeren som følger (eksempel 5).

          Eksempel 5 Bruke :nth-child Pseudo-Class

          Kyrisk li:nth-child(1)::before ( innhold: "a)"; ) .cyrilic li:nth-child(2)::before ( innhold: "b)"; ) .cyrilic li:nth-child(3)::before ( innhold: "til)"; )

          I dette eksemplet er hver bokstav etterfulgt av en parentes, alle bokstaver er små. Du kan definere din egen type listenummerering, for eksempel kan den inneholde store bokstaver med en prikk, med en eller to parenteser, eller bare bokstaver. I motsetning til standardnummerering står vi fritt til å gjøre hva vi vil her. En liste på ti bokstaver burde være nok for nesten alle situasjoner, men hvis dette plutselig viser seg å ikke være nok, er det ingenting som hindrer oss i å utvide listen til å inkludere i det minste alle bokstavene i det russiske alfabetet.

          Vi justerer til slutt justeringen og plasseringen av bokstavene, spesifiser eventuelt skriftstørrelse, farge og andre parametere (eksempel 6).

          Eksempel 6. Liste med russiske bokstaver

          1. Borsch
          2. Gjeddekoteletter
          3. Kulebyak
          4. Sopp i rømme
          5. Pannekaker med kaviar
          6. Kvass
          
          
          

          Resultatet av dette eksemplet er vist i fig. 3.

          Lister brukes ofte på nettsider, så dette spørsmålet er veldig relevant. Det er to typer lister i HTML: nummererte og unummererte (punkter). Spesielle tagger brukes til å bygge lister. Vi vil bli kjent med hovedtaggene i denne leksjonen. La oss se på typene lister i HTML i rekkefølge og bruke ekte eksempler for å forstå hvordan de er forskjellige og hvordan de vises.

          Nummererte lister i HTML

          Nummererte lister i HTML er en ordnet sekvens av elementer. I en nummerert liste innledes hvert element automatisk av et serienummer. Den nummererte listen ser slik ut:

          1. Første element på listen
          2. Det andre elementet på listen
          3. Tredje element på listen
          4. Fjerde element på listen
          5. Femte element på listen

          I dette eksemplet vil listen vises med arabiske tall. Nummererte lister har attributter som kan brukes til å angi formatet for visning av listenummerering:

          1. Attributter "I" eller "i" - listen er nummerert med romerske bokstaver (store eller små bokstaver);
          2. Attributter "A" eller "a" - nummerering med latinske bokstaver (store eller små bokstaver);
          3. «start»-attributtet brukes for å sikre at nummereringen ikke starter fra det første elementet, som en parameter angis serienummeret som listen skal dannes fra.

          Eksempel. Nummerert liste, som er dannet av romerske bokstaver og begynner med det andre elementet:

          2. Første element på listen
          3. Det andre elementet på listen
          4. Tredje element på listen
          5. Fjerde element på listen
          6. Femte element på listen

          Punktlister i HTML

          Uordnede lister kalles også uordnede eller punktlister. For å markere elementene i en slik liste, brukes spesialtegn (markører). Utseendet til listemarkørene er spesifisert i HTML-koden ved hjelp av spesielle attributter. Et eksempel på en punktliste i HTML:

          • Første element på listen
          • Det andre elementet på listen
          • Tredje element på listen
          • Fjerde element på listen
          • Femte element på listen

          I dette tilfellet vil listen bli dannet av markører i form av en tykk prikk. Attributtene til en uordnet liste er:

          1. "plate" - markører i form av en fylt sirkel
          2. "sirkel" - markører i form av en tom sirkel
          3. "firkant" - markører i form av en fylt firkant

          Et eksempel på å sette en spesifikk markør i listen:

          • Første element på listen
          • Det andre elementet på listen
          • Tredje element på listen
          • Fjerde element på listen
          • Femte element på listen

          Grafiske bilder kan også brukes som listemarkører, som lar deg designe et HTML-dokument på en vakker måte. I praksis brukes dette veldig ofte. For å implementere denne oppgaven, må du skrive i koden banen til bildet som skal tjene som en markør:

          Første element på listen
          Det andre elementet på listen
          Tredje element på listen
          Fjerde element på listen
          Femte element på listen

          Lister kan også nestes, de består av flere lister:

          1. Første element på listen
          2. Det andre elementet på listen
          • Første underpunkt på listen
          • Andre punkt på listen
          3. Tredje element på listen
          4. Fjerde element på listen
          5. Femte element på listen

          Det er kanskje alt jeg ønsket å snakke om lister i HTML. Lister er svært vanlige på nettsider. For å danne dem, må du kjenne til visse slutningsregler.

          Lister er en viktig del av innholdet fordi de hjelper til med å organisere informasjon. Tekst i lister blir bedre oppfattet og lettere å huske.

          Den enkleste - før hvert av elementene er det en markør - en sirkel, en firkant eller en sirkel. Rekkefølgen på elementene i en punktliste er ikke viktig.

          For å lage den trenger du bare å bruke to tagger:

          og
          • .
            er en beholder som inneholder en liste hvis elementer er gitt av taggen
            • .
              • En stein
              • Saks
              • Papir
              
              
              

              Som standard brukes en svart sirkel som en listemarkør ( disk). Ved å legge til taggen

              Egenskap type og ved å tilordne en passende verdi til den, kan markøren endres til en sirkel ( sirkel) eller svart firkant ( torget).

              Den skiller seg fra den merkede ved at rekkefølgen på elementene i den er viktig, og derfor brukes fortløpende tall eller bokstaver her i stedet for en markør. Det er ingen grunn til å bekymre seg for rekkefølgen i listen: nettleseren tar seg av denne oppgaven. Hvis du endrer listen (fjerner eller legger til et element ute av drift), vil nettleseren beregne den på nytt og vise den riktig.

              Tagger brukes til å lage nummererte lister.

              og
              1. . Container
                 definerer begynnelsen og slutten av listen, tag
                 1. setter begynnelsen og slutten av elementet - bare alt, som i en punktliste
                    endret til
                    .
                    1. En stein
                    2. Saks
                    3. Papir
                    
                    
                    

                    

                    Siden det ikke alltid er så enkelt med nummererte lister, for taggen

                    opprettet følgende attributter (merk: nedenfor er bare en nummerert liste):

                    1. type. Dette attributtet lar deg nummerere listen ikke bare med arabisk, men også med romertall eller latinske bokstaver med forskjellige kasus. type støtter verdier 1 (standard), a, A, i, I (prøv å eksperimentere med dem selv).

                    2. start. Nummerering trenger ikke alltid å starte fra én. Dette attributtet lar deg angi startverdien - nummeret til det første elementet i listen. I den kan du spesifisere at rapporten begynner, for eksempel med tallet 100 eller bokstaven K.

                    3. reversert. Hvis listen ikke skal gå fra 1 til 10, men fra 10 til 1, må dette attributtet brukes. Hvis det er satt, vil nummereringen bli reversert.

                    For å sette et vilkårlig nummer til et element i midten av listen, må du bruke i taggen

                    1. Egenskap :

                    2. Det førti-femte elementet etter det trettiåttende

                    Ved å endre nummeret på ett element i midten av listen, vil du også endre nummereringen av alle elementene som følger det - rapporten vil starte fra verdien i verdiattributtet. For eksempel, hvis du tilordnet tallet 35 til element 18, vil elementene etter det ikke ha numrene 19, 20, 21, men 36, 37, 38.

                    Liste over definisjoner

                    Ikke så kjent listetype som diskutert ovenfor. Består av begreper og deres definisjoner. Laget med tagger:

                    - beholderen som inneholder listen.

                    - term tag.

                    - definisjonsmerke

                    Omfanget av definisjonslister er ordlister, oppslagsverk, tester, ordbøker og andre fyldige oppregninger av typen "Term - forklaring".

                    Her er en eksempelliste med definisjoner:

                    Beskrivelse

                    Den grunnleggende enheten i markup-språket, kjent for alle som en "Tag".

                    Egenskap

                    En tag-egenskap som gir den ekstra tekststilingsalternativer.

                    Merkelapp

                    En enkelt tagg som ikke trenger å lukkes.

                    
                    
                    

                    

                    En liste som består av lister nestet i hverandre. Kan inkludere lister over forskjellige typer. Kompleksiteten i opprettelsen ligger i å observere riktig nesting av tagger, siden det er lett å bli forvirret i en flernivåstruktur.

                    Her er et eksempel på en flernivåliste:

                    Programmeringsspråk er delt inn i:

                    • Strukturell
                    1. Pascal
                    2. Oberon
                    1. Limbo
                    • Objekt orientert
                    1. Java
                    • Funksjonell
                    1. Lisp
                    2. Python