HTML Listen


HTML Angebote Web-Autoren drei Möglichkeiten für die Angabe Listen von Informationen. Alle Listen müssen ein oder mehrere Listenelemente enthalten. Listen können enthalten:

  • <ul> - Eine ungeordnete Liste. Dies wird auflisten Artikel unter Verwendung Klar Aufzählungszeichen.
  • <ol> - Eine geordnete Liste. Dies wird verschiedene Schemata von Zahlen verwenden, um Liste Sie Ihre Artikel.
  • <dl> - Eine Definitionsliste. Dies angeordnet Ihre Artikel in der gleichen Weise, wie sie angeordnet in einem Wörterbuch sind.

HTML ungeordnete Listen

Eine unsortierte Liste ist eine Sammlung von verwandten Gegenständen, die keine spezielle Reihenfolge oder Sequenz haben. Diese Liste wird erstellt von mit HTML <ul> tag. Jedes Artikel in der Liste ist mit einem Aufzählungszeichen markiert.

Beispiel

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
<ul>
<li>Beetroot</li>
<li>Ginger</li>
<li>Potato</li>
<li>Radish</li>
</ul>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  • Beetroot
  • Ginger
  • Potato
  • Radish

Das Attribut type

Sie können mit typ -Attribut für <ul> Tag, um Gibt an Art der Kugel Sie wie. Standardmäßig ist es eine Scheibe. Im Folgenden sind die möglichen Optionen:

<ul type="square">
<ul type="disc">
<ul type="circle">

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung<ul typ="square">

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
   <ul type="square">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ul>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  • Beetroot
  • Ginger
  • Potato
  • Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung <ul type="disc"> :

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
   <ul type="disc">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ul>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  • Beetroot
  • Ginger
  • Potato
  • Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung <ul type="circle"> :

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
   <ul type="circle">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ul>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  • Beetroot
  • Ginger
  • Potato
  • Radish

HTML geordneten Listen

Wenn Sie erforderlich werden legte um Ihre Artikel in einer nummerierten Liste stattdessen von Aufzählungszeichen dann HTML geordnete Liste wird sein verwendet. Diese Liste wird erstelle durch die Verwendung <ol> tag. Die Numerierung beginnt bei eine und wird inkrementiert durch eine für jedes aufeinanderfolgende bestellt Liste element Mit tagged <li>.

Beispiel

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
<ol>
<li>Beetroot</li>
<li>Ginger</li>
<li>Potato</li>
<li>Radish</li>
</ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Das Attribut type

Sie kann Verwendung typ-Attribut für <ol> Tag, um Gibt an die Art der Nummerierung Sie wie. Standardmäßig ist eine Zahl. Im Folgenden sind die möglichen Optionen:

<ol type="1"> - Default-Case Numerals.
<ol type="I"> - Upper-Case Numerals.
<ol type="i"> - Lower-Case Numerals.
<ol type="a"> - Lower-Case Letters.
<ol type="A"> - Upper-Case Letters.

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung <ol type="1">

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="1">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung <ol type="I">

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="I">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung <ol type="i">

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="i">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung<ol type="A">

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="A">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Beispiel

Es folgt ein Beispiel, wo wir unter Verwendung<ol type="a">

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="a">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

Der Start Attribut

Sie können mit start -Attribut für <ol> Tag, um den Ausgangspunkt der Nummerierung müssen Sie angeben. Im Folgenden sind die möglichen Optionen:

<ol type="1" start="4">    - Numerals starts with 4.
<ol type="I" start="4">    - Numerals starts with IV.
<ol type="i" start="4">    - Numerals starts with iv.
<ol type="a" start="4">    - Letters starts with d.
<ol type="A" start="4">    - Letters starts with D.

Beispiel

Es folgt ein Beispiel, wo wir verwendung<ol type="i" start="4" >

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
   <ol type="i" start="4">
   <li>Beetroot</li>
   <li>Ginger</li>
   <li>Potato</li>
   <li>Radish</li>
   </ol>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

  1. Beetroot
  2. Ginger
  3. Potato
  4. Radish

HTML Definitionslisten

HTML und XHTML unterstützen eine Liste Stil, welche genannt wirdDefinitionslisten wo Einträge werden wie in einem Wörterbuch oder Lexikon aufgeführt. Die Definitionsliste ist der ideale Weg, um ein Glossar, Liste von Begriffen oder andere Name / Wert-Liste zu präsentieren.

Definitionsliste macht von folgenden drei Tags.

  • <dl> - Defines the start of the list
  • <dt> - A term
  • <dd> - Term definition
  • </dl> - Defines the end of the list

Beispiel

<!DOCTYPE html>
<html>
<head>
<title>HTML Definition List</title>
</head>
<body>
<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>
</body>
</html>

Dies wird folgendes Ergebnis produzieren:

HTML
This stands for Hyper Text Markup Language
HTTP
This stands for Hyper Text Transfer Protocol
Advertisements