子選擇器(選擇器之間使用大於符號):選擇父元素的子元素,不包括子元素的子元素

CSS

.div1 > p {
	color: #F00;
}
.div2 p {
	color: #F00;
}

HTML

 <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>

結果

div1-P1

div1-P2

div2-P1

div2-P2


HTML 標籤中的屬性進行選擇

CSS

p[title] {
	color: #F00;
}

HTML

<p title="t1">有title屬性的段落標籤</p>
<p>無title屬性的段落標籤</p>

結果

有title屬性的段落標籤

無title屬性的段落標籤