Heim > Artikel > Web-Frontend > In Bezug auf das Problem des Listenstils, bei dem das Listenattribut in CSS geändert wird, um den Li-Tag-Stil zu steuern

In Bezug auf das Problem des Listenstils, bei dem das Listenattribut in CSS geändert wird, um den Li-Tag-Stil zu steuern

不言Original: 2018-06-11 14:50:192317Durchsuche

Dieser Artikel befasst sich hauptsächlich mit der Änderung des Listenattributs in CSS, um den Li-Tag-Stil zu steuern. Jetzt kann ich ihn mit Ihnen teilen

list_style-Attribute werden verwendet, um die Attribute der Liste zu ändern, list-style-type wird verwendet, um den Listenelementtyp festzulegen, list-style-position wird verwendet, um die Position des Listenelements festzulegen, und list-style-image wird verwendet um die Verwendung von Bildern zum Ersetzen der Listenelementmarkierung festzulegen

list_style-Attribut wird verwendet, um die Attribute der Liste zu ändern

Das Format ist wie folgt:
list_style: Listenelement-Markierungstyp Position der Listenelement-Markierung Listenelement-Markierung;
kann auch alleine verwendet werden Listenelement-Tag festlegen:
list-style-type wird zum Festlegen des Listenelementtyps verwendet:
Die Der Standardwert ist die Scheibe, die ein ausgefüllter Kreis ist.
Gemeinsame Werte: keine leer
Kreis Hohlkreis
Quadrat ausgefüllte Quadrate
Dezimalzahlen
lateinische Kleinbuchstaben a, b, c. ...
Großlateinische Großbuchstaben A, B, C....
list-style-position Wird verwendet, um die Position dieses Listenelements festzulegen:
Der Standardwert „außen“ bedeutet außerhalb des li-Tags . Dies dient zum Hinzufügen eines Randes zum li: 1px solides Rot; Sie können die Position der Markierung sehen.
innen bedeutet, dass sich die Markierung innerhalb des li-Tags befindet, was beim Hinzufügen eines Rahmens deutlich sichtbar ist.
list-style-image wird verwendet, um die Verwendung von Bildern zum Ersetzen von Listenelement-Tags festzulegen:
Standardwert: keiner
Optionaler Wert: URL, das Format ist URL ("URL-Adresse"); >Beispiel:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<style type="text/css"> 
ul { 
border:1px solid red; 
} 
li{ 
border:1px solid red; 
list-style:disc outside url(news_list.gif); 
list-style-position:5px; 
} 
</style> 
</head> 
<ul> 
<li>你好</li> 
<li>我好</li> 
</ul> 
<body> 
</body> 
</html>

Spezifiziert ein „list-style-type“-Attribut für den Fall, dass das Bild nicht verfügbar ist.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website.

Verwandte Empfehlungen:

Der Unterschied und die Priorität der Verwendung von href und onclick im A-Tag von HTML

Anleitung Verwenden Sie CSS3. Linearer Farbverlauf. Linearer Farbverlauf erstellt Rahmen.

Das obige ist der detaillierte Inhalt vonIn Bezug auf das Problem des Listenstils, bei dem das Listenattribut in CSS geändert wird, um den Li-Tag-Stil zu steuern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php css css3 html href position border li

Stellungnahme：

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

Vorheriger Artikel：Informationen zur DW-Methode zum Einfügen von CSS-Stilen in HTMLNächster Artikel：Informationen zur DW-Methode zum Einfügen von CSS-Stilen in HTML

In Verbindung stehende Artikel

Mehr sehen