我們都知道
CSS selector的優先權是：
inline style > ID > Class > Tag
◎ inline style 就是內嵌在各標籤 裡的「style="..."」 這個attribute
◎ ID 就是 「井字號 (#)」開頭的Selector
◎ Class 就是 「點 (.)」開頭的Selector
◎ Tag 就是像「h1」、「span」、「a」這種用Tag來做依據的Selector
但是以下為什麼Tag優先權會比Class來得高呢？
<style>
.myclass { font-size: 20px; }
ul#aaa li { font-size: 15px; }
li.myclass { font-size: 10px; }
ul.bbb li { font-size: 25px; }
ul { font-size: 30px; }
</style>
<ul id="aaa" class="bbb">
<li id="myli" class="myclass">Hello</li>
</ul>
優先順序是：
ul#aaa li > ul.bbb li > li.myclass > .myclass > ul
「ul」的「font-size」是繼承而來的，優先權最低這無庸置疑，
但是為什麼「.myclass」的優先權居然比「ul#aaa li」、「ul.bbb li」和「li.myclass
」還來得低呢？
尤其是「ul#aaa li」和「ul.bbb li」
明明這兩個Selector是Tag層級的，為什麼優先權會比Class層級的「.myclass」 (還有「
li.myclass」)還來得高呢？
另外，
「li.myclass」優先權比「.myclass」 還來得高又該怎麼解釋呢？
請各位高手解釋
感激不盡