So entfernen Sie die Punkte von ul- und li-Tags in HTML

下次还敢
Freigeben: 2024-04-27 21:00:44
Original
846 Leute haben es durchsucht

Um Punkte aus ul- und li-Tags in HTML zu entfernen, können Sie die folgenden Schritte ausführen: Verwenden Sie den CSS-Stil list-type none: ul, li { list-style-type: none }. Verwendung vor Pseudoelement und Inhaltsattribut: li {position: relative; padding-left: 1em; Höhe: 0,

So entfernen Sie die Punkte von ul- und li-Tags in HTML

So entfernen Sie den Punkt in ul- und li-Tags in HTML

In HTML zeigen ul-Tags (ungeordnete Liste) und li-Tags (Listenelement) normalerweise einen kleinen runden Punkt als Markierung an . Wenn Sie diese Punkte entfernen müssen, können Sie ein CSS-Stylesheet verwenden.

Methode:

  1. Verwenden Sie den Listenstiltyp „Keine“:

    <code class="css">ul, li {
      list-style-type: none;
    }</code>
    Nach dem Login kopieren
  2. Verwenden Sie vor Pseudoelement und Inhaltsattribut:

    <code class="css">li {
      position: relative;
      padding-left: 1em;
    }
    
    li:before {
      content: "";
      position: absolute;
      left: 0;
      top: 0.2em;
      width: 0.5em;
      height: 0.5em;
      background-color: #000;
      border-radius: 50%;
    }</code>
    Nach dem Login kopieren

Us Altersbeispiel:

<code class="html"><ul>
  <li>项目 1</li>
  <li>项目 2</li>
  <li>项目 3</li>
</ul></code>
Nach dem Login kopieren
<code class="css">ul, li {
  list-style-type: none;  // 使用列表样式类型 none
}</code>
Nach dem Login kopieren

Effekt :

Die runden Punkte werden entfernt und eine ungeordnete Liste mit reinem Textinhalt wird erstellt.

Hinweis:

  • Die oben bereitgestellten Lösungen funktionieren nur auf modernen Browsern wie Firefox, Chrome und Safari.
  • Für ältere Browser wie Internet Explorer sind möglicherweise zusätzliche Hacks oder JavaScript erforderlich, um den gleichen Effekt zu erzielen.

Das obige ist der detaillierte Inhalt vonSo entfernen Sie die Punkte von ul- und li-Tags in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:php.cn
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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!