Heim  >  Artikel  >  Web-Frontend  >  CSS: Detaillierte Erläuterung der Verwendung von list-style-image

CSS: Detaillierte Erläuterung der Verwendung von list-style-image

黄舟
黄舟Original
2017-06-29 10:13:263799Durchsuche

Verstehen Sie die Verwendung des CSS-Attributs list-style-image? Hier ist eine Beschreibung, die das Markup des Listenelements durch ein Bild ersetzt wird als Bild einer geordneten oder ungeordneten Listenelementmarkierung bezeichnet.

CSS list-style-image-Eigenschaft Listensymbol

Definition und Verwendung

Die list-style-image-Eigenschaft ersetzt das Markup eines Listenelements durch ein Bild.

Beschreibung

Dieses Attribut gibt ein Bild an, das als Symbol für ein geordnetes oder ungeordnetes Listenelement dient. Die Platzierung des Bildes relativ zum Inhalt des Listenelements wird normalerweise mithilfe des Attributs list-style-position gesteuert.

Hinweis: Geben Sie immer ein „list-style-type“-Attribut an, falls das Bild nicht verfügbar ist.

CSS: Detaillierte Erläuterung der Verwendung von list-style-image

Beispiel

Ein Bild als Elementmarkierung in einer Liste festlegen:

ul  
{  
list-style-image:url("/i/arrow.gif");  
list-style-type:square;  
}

Browserunterstützung

Alle Browser unterstützen das list-style-image-Attribut.

Hinweis: Jede Version von Internet Explorer (einschließlich IE8) unterstützt den Attributwert „inherit“ nicht.

Mögliche Werte

CSS: Detaillierte Erläuterung der Verwendung von list-style-image

Syntax:

list-style-image : none | url (url)

Parameter:

none: Nicht angegebenes Bild
URL: Verwenden Sie eine absolute oder relative Adresse, um ein Hintergrundbild anzugeben.

Beschreibung:

Legt das Bild des Listenelement-Tags als fest oder ruft es ab Objekt.
Wenn das Attribut „list-style-image“ keins ist oder das angegebene Bild nicht verfügbar ist, wird das Attribut „list-style-type“ wirksam.
Die entsprechende Skriptfunktion ist listStyleImage. Bitte sehen Sie sich andere Bücher an, die ich geschrieben habe.

Beispiel:

ul.out { list-style-position: outside; list-style-image: url("images/ie.gif"); }


Das obige ist der detaillierte Inhalt vonCSS: Detaillierte Erläuterung der Verwendung von list-style-image. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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