                        課程
                    
                        /前端開發
                        
                            /HTML/CSS
                        
                        /初識HTML(5)+CSS(3)-升級版

這兩行代碼表達的什么意思？看不懂！

p span.warning{color:purple;} /*權值為1+1+10=12*/

#footer .note p{color:yellow;} /*權值為100+10+1=111*/

qq_何必忙著為自己解釋_03169832

2016-07-27

源自：初識HTML(5)+CSS(3)-升級版 9-3

關注問題我要回答

1568

操作

收起

3 回答

qq_何必忙著為自己解釋_03169832 提問者
2016-07-27

我的理解：

p span.warning{color:purple;} 第一個空格表是后代選擇器，而span.warning{}是表示span定義的class=warning，精確定位span元素采用的類選擇器。

p span .warning{color:purple;} 同理，因為warning為span的子元素，且class為warning 采用的后代選擇器<a class="warning"></a>?

第一種中的span和warning 為同級關系，第二種中的warning為span的子元素

0 回復有任何疑惑可以回復我~

收起回答

穗積
2016-07-27

標簽的權值為1 類選擇器的權值為10，id選擇器的權值為100，p 和span是標簽。warning和note是類選擇器。footer是id選擇器，在css設置中，當選擇有沖突的時候，會選擇權值高的。比如.warning{color:pink;}這個權值只是10，而p span.warning{color:purple;}權值是12，所以網頁顯示的顏色是purple而不是pink；下面那句話是一樣的道理。