CSSの一般要素がクラスよりも優先されますか？

Question

ul { 
 
    width: 250px; 
 
} 
 
li { 
 
    margin: 10px; 
 
} 
 
ul.illuminations { 
 
    list-style-position: outside; 
 
} 
 
ul.season { 
 
    list-style-position: inside; 
 
} 
 
ul.2 { 
 
    list-style: inside circle; 
 
    width: 300px; 
 
} 
 
li.3 { 
 
    margin: 100px; 
 
}

<ul class="illuminations"> 
 
    <li>That idol, black eyes and yellow mop, without parentsw our court ...</li> 
 
    <li>Gracious son of Pan! Around your forehead crowned with flowerets ...</li> 
 
    <li>When the world is reduced to a single dark wood for our four...</li> 
 
</ul> 
 
<hr /> 
 
<ul class="season"> 
 
    <li>Once, if my memory serves me well, my life was a banquet...</li> 
 
    <li>Hadn't I once a youth that was lovely, heroic, and fabulous...</li> 
 
    <li>Autumn already! - But why regret the everlasting sun if we are</li> 
 
</ul> 
 
<hr /> 
 
<h1>Quotes from Edgar Allan Poe</h1> 
 
<ul class="2"> 
 
    <li class="3">I have great faith in fools; self-confidence my friends call it.</li> 
 
    <li class="3">All that we see or seem is but a dream within a dream.</li> 
 
    <li class="3">I would define, in brief, the poetry of words as the rhythmical creation of beauty.</li> 
 
</ul>

最初の二つのリストは、異なるマーカーの位置を取得しません。ただし、最後のリストでは、より具体的な宣言を使用して、リストスタイルと幅属性を取得しません。これは私が何度も遭遇した問題です。なぜこれがあり、属性を上書きするために特定の要素をターゲットに設定する必要がありますか？

Answer 1

CSS識別子は数字で始めることはできません。したがって.2と.3は無効なセレクタです。 .\32と.\33のようにエスケープすることができます。

ul { 
 
    width: 250px; 
 
} 
 
li { 
 
    margin: 10px; 
 
} 
 
ul.\32 { 
 
    list-style: inside circle; 
 
    width: 300px; 
 
} 
 
li.\33 { 
 
    margin: 100px; 
 
}

<ul class="2"> 
 
    <li class="3">I have great faith in fools; self-confidence my friends call it.</li> 
 
    <li class="3">All that we see or seem is but a dream within a dream.</li> 
 
    <li class="3">I would define, in brief, the poetry of words as the rhythmical creation of beauty.</li> 
 
</ul>