Opsommingstekens en genummerde lijsten HTML

Er zijn twee soorten lijsten, in de taal van HTML: besteld en ongeordende. Hun creatie is bijna hetzelfde. Zelfs labels verschillen met één teken. U kunt ook lijsten met meerdere niveaus, die zowel genummerd en marker kunnen zijn.

Deze lijsten kunnen worden omgezet naar believen. Het hangt allemaal af van je fantasie. Ten eerste, beschouwen we de standaard lijsten, zoals in Word, en dan zullen we ze te verbeteren en uit alle erkenning.

Genummerde HTML lijst

Neutraal besteld HTML lijst kan worden gemaakt met de volgende tags:

1. Eerste item lijst

2. Tweede item lijst

3. Het derde punt lijst

   Eenvoudige lijst hier eruit

   Volgens de normen, moet elk item in de lijst worden in de opening en de afsluitende tag li. Maar als je niet de afsluitende tag te zetten, het resultaat is precies hetzelfde. De geleider is erg handig. Tijdens de conversie lijst, analyseert hij de opening labels. Als hij een nieuw

4. ziet, dan zet ze automatisch in de voorkant van .

   Zo kan de lijsten worden gedaan zoals hieronder aangegeven.

   Maar vanuit het oogpunt van de professionals is onjuist.

   opsommingen

   Unnumbered (of markering) lijsten zijn precies hetzelfde, alleen in plaats van de ol tag geschreven ul.

   In opsommingen, geen cijfers of letters - alleen de verschillende personages, die markers worden genoemd.

   Multilevel genummerde lijst HTML

   Veel mensen zijn geïnteresseerd in een dergelijke kans. Daarom dient te worden opgemerkt dat een HTML-genummerde lijst multilevel kan zijn. Extra lagen kunnen dezelfde of geëtiketteerd zijn.

   Als u een lijst die is opgegeven in het bovenstaande voorbeeld te maken, moet u het volgende te schrijven.

   Merk op dat in deze code, in tegenstelling tot het eerste voorbeeld, het toegevoegde kenmerk type. Dankzij hem, kunt u het type van de sortering voor zowel genummerd en voor de markering lijsten op te geven.

   Voor genummerde aangeven van welk alfabet of cijfers, en voor de overige gevallen - de aard van de marker.

   sorteren optielijst

   Als u een speciale HTML-tag te gebruiken, kunt genummerde lijsten op elke gewenste manier worden.

   U kunt het type attribuut op elke waarde van de tabel opgeven. Of klas stijl css geef de list-style-type met het gewenste type sorteren.

   Vertaling van waarden is heel simpel. Voldoende basiskennis van het Engels. Maar zelfs als je het woord "cirkel", "vierkant", en ga zo maar door. N. niet kan vertalen, kunt u visueel te zien wat het resultaat is wanneer u deze waarden opgeeft in het kenmerk van het type.

   Voor genummerde lijsten, moet u de volgende opties gebruiken:

   • 1 - Arabische cijfers;
   • A - hoofdletters letters ;
   • een - kleine letters;
   • I - hoofdletters Romeinse cijfers;
   • i - kleine Romeinse cijfers.

   Standaard wordt de lijst altijd gebruikt met Arabische cijfers. Dat wil zeggen, als je niets opgeeft, is conform type = "1".

   Daarnaast kunnen genummerde lijsten beginnen op elke gewenste positie. Default - de sluiting van 1. Maar als je wilt kun je zelfs beginnen met een honderdtal. Om dit te doen, moet je het begin attribuut met elke waarde op te geven.

   Bovendien kan in omgekeerde volgorde worden gesloten. Om dit te doen, schrijf omgekeerd.

   Het maken van lijsten

   Genummerde HTML lijst kan zo mooi zijn ingericht dat je niet meteen kunt wel raden dat dit de gebruikelijke lijst, en niet een foto gemaakt in Photoshop.

   Hier zijn prachtige voorbeelden van lijsten.

   Zoals blijkt uit het voorbeeld, is het mogelijk om het uiterlijk en de nummering van de elementen zichzelf te veranderen.

   U kunt een gewone lijst als deze te maken.

   In de CSS-stijlen moet u het ontwerp voor de ol tag op te geven. Merk op dat in dit geval worden de instellingen worden toegepast op alle lijsten van alle sites die deze stijl bestand.

   Beschouw eerst uitvoeringsvorm met een cirkelvormige controlelijst. Terug naar de codelijst. Er is Set klasse afgeronde lijst. Dat is het met deze klasse noodzaak om te sleutelen, om dergelijke schoonheid te maken. Bel de klasse die u als u wilt.

   Beschouw nu een vierkant ontwerp.

   De stijlen zijn zeer vergelijkbaar. Het verschil is dat in het eerste geval is er een afronding element door middel van css opties.

   browser ondersteuning

   Het is belangrijk om te begrijpen dat niet alle browsers ondersteunen alle css attributen.

   Bijvoorbeeld, je wilt een genummerde lijst in het midden te maken. HTML-code zal hetzelfde zijn, maar het resultaat in oudere browsers kan heel verschillend zijn.

   Hetzelfde geldt voor het ontwerp van de nummering.

   Zoals u kunt zien, heeft de pleinen rond de nummers in oudere versies van IE niet verschijnen, omdat de handler niet de nieuwe attributen die u in staat om een dergelijke registratie te maken te leren kennen.

   Professionele coder moeten anticiperen en begrijpen dat niet alle gebruikers maken gebruik van moderne computers. Niet alle geïnstalleerde Windows 7, 8, 10. Er is een percentage van de gebruikers die nog steeds zit op de Windows XP en maakt gebruik van een oudere versie van Internet Explorer.

   In de regel, bijna alle moderne ontwerpen om het verbeteren van hun elementen worden niet ondersteund. De gebruiker zal voelen dat hij niet werken aan de vormgeving van de site. Dat al verhuisd. De elementen zijn gebundelde samen. Om dit te voorkomen, moet u alle opties te tellen.

   Sommige webmasters zijn een oogje dichtknijpen voor hen, omdat hun aandeel in de markt van vandaag wordt steeds minder en minder. Maar voor professionele waarderen elke bezoeker, vooral als het is een commerciële site.

   Doe iets geschikt voor alle of overwegen alle opties voor de browser.