「我如果能夠遙望彼方,那完全是因為我站在巨人肩膀上的緣故。」
 

09 七月 2015 | 文

CSS子選擇器大於符號 [>]使用方法、HTML 標籤屬性選擇

選擇器之間使用大於符號

選擇父元素的子元素,不包括子元素的子元素

css選擇器使用大於符號可以選擇不含元素內的其他相同子元素,這個語法簡單的使用符號大於[ > ]在選擇器之間。

以下範例可以看出在CSS語法.div1 > p字體顏色為紅色 ,.div1裡面的子元素<p>div1-P2</p>,因為外面父元素為<span>,.div1 > p使用[ > ]符號,所以受引響的只有.div1下一層級的<p>,<p>div1-P2</p>一樣是呈現原來的黑色文字。若沒有使用[>]符號則連同子元素內的,所有<p>都會受樣式影響呈現紅色文字。

<style type="text/css"> .div1 > p { color: red; } .div2 p { color: red; } </style> <div class="div1"> <p>div1-P1</p> <span><p>div1-P2</p></span> </div> <div class="div2"> <p>div2-P1</p> <span><p>div2-P2</p></span> </div>


© UCAMC. All rights reserved.
Powered by CITIAR.