組合選擇器
標籤選擇器、類別選擇器和ID選擇器是可以組合起來使用的。一般的組合方式是標籤選擇器和類別選擇器組合，標籤選擇器和ID選擇器組合。由於這兩種組合方式的原理和效果一樣，所以只介紹標籤選擇器和類別選擇器的組合。組合選擇器只是一種組合形式，並不算是一種真正的選擇器，但在實際中經常使用。
例如 .orderlist li {xxxx} 或.tableset td {}
我們使用的時候一般用在重複出現並且樣式相同的一些標籤裡，例如li td dd等。
例如<h1 class="red"></h1> H1.red {color: red}
組合選擇器清單
1. A,B 多個元素選擇，同時配對所有A元素和B元素，A和B之間用逗號分隔 div,p { color:red; }
2. A B 後子元素選擇器，並符合所有屬於A元素後代的B元素，A和B之間用空格分隔 #nav li { display:inline; li a { font-weight:bold; }
#3. A > B 子元素選擇器，符合所有A元素的子元素B div > strong { color:#f00; }
4. A + B 相鄰元素選擇器，並符合所有相鄰元素選擇器，符合所有相鄰元素選擇器，符合所有相鄰元素選擇器，與所有相鄰元素選擇器相匹配緊接著A元素之後的同級元素B p + p { color:#f00; }
5. A ~ B 普通相鄰元素選擇器，符合所有指定元素的相鄰元素。 div ~ p { color:#f00; }
#多元素選擇器
//css 程式碼：
<style>
#div.mydivred,p.mypred
#{padding:10px;background-color:#ffffff;border:1px #000000 solid;color:red;}
</style>
</style>
## #####//html 代碼############<div class="mydivred"> div.mydivred</div>
<p class="mypred"> p.mypred</p>
試試看
#後位元素選擇器
#<style>
#<style>
#fuji .ziji
#{
## padding:10px;
background-color:#ffffff;
border:1px #000000 solid;color:red;
#}
</style>
<div id="fuji">##<div class ="ziji"> div.ziji</div>
</div>
#嘗試
子元素選擇器
#<style>
<style>
zys>span
{
#################################################################################################### #############padding:10px;#########################background-color:#ffffff;## ######################border:1px #000000 solid;color:red;################# #######}#########################</style>############# ###########<div id="zys">########################<span class= "any"> div.ziji</span>#########################</div>
試試看
#相鄰元素選擇器
##<style>
##<style>
## div+p
{
background-color:yellow;
##}
</style>
<div>
<h2>My name is Donald</h2>
<p>I live in Duckburg.</p>
</div>
##試試看
#普通相鄰元素選擇器
div~p
######{############ background-color: green; ############}###############################<div>######################<div>### #########<p>段落1。 在 div 中。 </p>############<p>段落 2。 在 div 中。 </p>############</div>###############<p>段落 3。不在 div 中。 </p>##################<p>段落 4。不在 div 中。 </p>############試試看########################
下一節