CSS: Einführung in die Farb- und Größensteuerung mit List-Style-Type

Die Seite, die ich heute erstellt habe, hat ein kleines Symbol, das dem Listensymbol sehr ähnlich ist. Ich wollte es einfach durch den eigenen Stil von ul ersetzen und habe herausgefunden, dass es eine solche Methode gibt notieren Sie es zur späteren Verwendung.

Basierend auf persönlicher Erfahrung können Sie diese Methode verwenden, wenn die Farben gleich sind, aber wenn die Schriftfarbe und die Farbe des Listenelements unterschiedlich sind, müssen Sie ein Diagramm verwenden, um sie zu implementieren, und zur Li-Zeilenhöhe:Npx; Nur Listen und Schriftarten können im IE angezeigt werden

Zitat:

Letztes Jahr, als ich ein CSS-Neuling war, habe ich fragte ein Experte:

Liste Kann -style-type Farbe oder Größe ändern? Der Experte sagte: Nein! Also habe ich es unter Anleitung des Experten anhand von Bildern umgesetzt.

Da ich Autodidakt bin, kann das Schreiben von CSS nicht so standardisiert werden wie bei anderen, sodass ich die Möglichkeit habe, Fehler zu machen und auch die Möglichkeit zu entdecken. Heute werde ich darüber sprechen, wie man die Farbe und Größe des Stils vor list-style-type ändert.

Werfen wir einen Blick auf den Quellcode

<ul class="artul">
    <li><a href="#">这里是SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是很长的SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是关于SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是一些最新的SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是近期SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是SEO常看的网站的文章列表标题目</a></li>
    <li><a href="#">这里是关于SEO网站的文章列表标题目</a></li>
    <li><a href="#">这里是一些最新的SEO网站的文章列表标题目</a></li>
    </ul>

und das entsprechende CSS

Das erste Bild-CSS

.ul {margin:0;padding:0 0 0 15px;color:#ddd;font-size:12px;color:#FFFF00;list-style-type: square }
.ul li {border-bottom:1px dotted #999;}

Das zweite Bild-CSS

.ul {margin:0;padding:0 0 0 15px;color:#ddd;font-size:15px;color:#FF00FF;list-style-type: square }
.ul li {border-bottom:1px dotted #999;}

Ich glaube, jeder weiß es. Ändern Sie einfach die Farbe von ul, um die Farbe zu ändern, und die Schriftgröße, um die Größe zu ändern (Größe wird in IE6 nicht unterstützt, aber Firefox kann)

Das obige ist der detaillierte Inhalt vonCSS: Einführung in die Farb- und Größensteuerung mit List-Style-Type. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!