Wie erstelle ich eine ungeordnete Liste mit Bildsymbolen in HTML?

WBOY
Freigeben: 2023-09-06 15:49:15
nach vorne
1667 Leute haben es durchsucht

Geordnete Listen sind nummeriert, ungeordnete Listen sind nicht nummeriert, sie können mithilfe von Tags erstellt werden

    und Tags
  • werden verwendet, um die Elemente der Liste zu definieren. Wir können 4 Arten ungeordneter Listen in HTML erstellen -
    • CD – Dadurch wird eine ungeordnete Liste erstellt, die mit Aufzählungszeichen markiert ist (Standard).

    • Kreise – Dadurch wird eine ungeordnete Liste mit der Bezeichnung Kreise erstellt.

    • Quadrat – Dadurch wird eine ungeordnete Liste mit der Bezeichnung „Quadrat“ erstellt.

    • Keine – Dadurch wird eine ungeordnete Liste ohne Tags erstellt.

      Wie erstelle ich eine ungeordnete Liste mit Bildsymbolen in HTML?

    Grammatik

    Hier ist die Syntax zum Erstellen einer ungeordneten Liste mit quadratischen Aufzählungszeichen in HTML.

    <ul style="list-style-image: url(image.png)">
       <li>Item in list…</li>
       <li>Item in list…</li>
       <li>Item in list…</li>
    </ul>
    
    Nach dem Login kopieren

    Beispiel 1

    Im Folgenden finden Sie ein Beispiel für die Erstellung einer ungeordneten Liste mit Bildaufzählungszeichen in HTML.

    <!DOCTYPE html>
    <html>
    <head>
       <meta charset="UTF-8">
       <meta http-equiv="X-UA-Compatible" content="IE=edge">
       <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
       <ul style="list-style-image: url(images/11.png)">
          <li>Abdul</li>
          <li>Jason</li>
          <li>Yadav</li>
       </ul>
    </body>
    </html>
    
    Nach dem Login kopieren

    Das Folgende ist die Ausgabe des obigen Beispielprogramms.

    Beispiel 2

    Sehen wir uns ein weiteres Beispiel für die Erstellung einer ungeordneten Liste mithilfe von Bildaufzählungszeichen an -

    <!DOCTYPE html>
    <html>
    <head>
       <title>HTML Unordered List</title>
    </head>
    <body>
       <h2>Tutorials</h2>
       <p>The list of tutorials:</p>
       <ul style="list-style-image: url('/theme/css/icons/image-editor.png');">
          <li>Java</li>
          <li>C++</li>
          <li>Ruby</li>
       </ul>
    </body>
    </html>
    
    Nach dem Login kopieren

    Nachdem der obige Code ausgeführt wurde, lautet die Ausgabe wie folgt: -

    Das obige ist der detaillierte Inhalt vonWie erstelle ich eine ungeordnete Liste mit Bildsymbolen in HTML?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

  • Verwandte Etiketten:
    Quelle:tutorialspoint.com
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage