Verwenden von Inline-Stilen zum Auflisten von Listenpunkten anders als Listenelemente

Question

Ich verwende ein internes CSS-Stylesheet, um Stile für meine <ol>- und <li>-Elemente zu definieren. Für eine Liste, die ich habe, möchte ich jedoch Inline-Styling verwenden. Ich möchte, dass die Listenelemente eine Farbe (blau) und die Listenpunkte eine andere (rot) haben. Wenn ich einen internen Stylesheet zu verwenden, würde die im Anschluss an diese für die betreffende Liste erreichen:

<style>ol { list-style-type:upper-roman; color:blue; } ol li span { color: red; } </style> 

Aber ich kann nicht herausfinden, wie dies mit Inline-Styling zu tun. Ich möchte nicht jede <li> stylen. Die folgende Werk nur eine Farbe für alles anwenden:

<ol list-style-type:upper-roman; style="color:blue;"> 
<li><span>Apple</span></li> 
<li><span>Orange<span></li> 
<li><span>Pear<span></li> 
<li><span>Grape<span></li> 
</ol> 

Aber ich weiß nicht, wie in dem Teil zur Inline-Styling-Anweisung, die in dem Inline-Stylesheet hinzuzufügen ist:

ol li span { color: red; } 

um die Listenelemente anders als die Kugeln zu färben, ohne jedes Listenelement selbst zu codieren.

Answer 1

Sie müssen sehr spezifisch und bedacht sein. So funktionieren Inline-Styles. Sie wenden sie direkt auf jedes einzelne Element an. Sie können mit einer Vererbung davonkommen, aber wenn Sie diese Vererbung überschreiben müssen, müssen Sie sie manuell für jedes Element überschreiben.

<ol style="color:blue; list-style-type:upper-roman;"> 
 
    <li><span style="color: red;">Apple</span></li> 
 
    <li><span style="color: red;">Orange</span></li> 
 
    <li><span style="color: red;">Pear</span></li> 
 
    <li><span style="color: red;">Grape</span></li> 
 
</ol>