基本選擇器包括標簽選擇器、類選擇器和ID選擇器三類，其他選擇器都是在這三類選擇器的基礎上組合形成
標簽選擇器
示例：
<style type="text/css">
p{
font-size:12px;
color:red;
}
</style>
類選擇器
標簽選擇器雖然方便，但是也存在缺陷，因為每個標簽選擇器所定義的樣式不僅僅影響某一個特定對象，而且會影響到頁面中所有同名的標簽。
類選擇器可以為網頁對象定義不同的樣式類，實現不同元素擁有相同的樣式、相同的元素擁有不同的樣式。
類選擇器以一個"."為前綴開頭，讓后跟隨一個自定義的類名
如圖：
示例1：
<!doctype html>
<html>
<head>
<style type="text/css">
p{
font-size: 12px;
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
color: aqua;
}
</style>
<meta charset="utf-8">
<title>示例</title>
</head>
<body>
<p>問君能有幾多愁，恰似一江春水向東流</p>
<p>剪不斷，理還亂，是離愁，別是一番滋味在心頭</p>
<p>獨自莫憑欄，無限江山，別時容易見時難。流水落花春去也，天上人間</p>
</body>
</html>
運行結果：
示例2：
示例3：
<!doctype html>
<html>
<head>
<style type="text/css">
p{
font-size: 12px;
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
color: aqua;
}
.font18px{font-size: 18px;}
.underline{text-decoration: underline;}
.italic{font-style: italic;}
</style>
<meta charset="utf-8">
<title>示例</title>
</head>
<body>
<p class="underline">問君能有幾多愁，恰似一江春水向東流</p>
<p class="font18px">剪不斷，理還亂，是離愁，別是一番滋味在心頭</p>
<p class="italic">獨自莫憑欄，無限江山，別時容易見時難。流水落花春去也，天上人間</p>
</body>
</html
類選擇器可以精確控制界面中的每一個對象樣式，而不管這個對象屬於是什么類型的標簽，同一個類樣式可以被多個對象引用，也不管這個對象是屬於什么類型的標簽。
通過類選擇器指定的標簽范圍，能夠更精確的控制頁面元素的樣式，避免類樣式對於所有元素的影響。
<!doctype html>
<html>
<head>
<style type="text/css">
p{
font-size: 12px;
color:brown;
}
.font18px{font-size: 18px;}
.underline{text-decoration: underline;}
.italic{font-style: italic;}
p.font18px{/*指定段落的類樣式*/font-size: 24px;}
</style>
<meta charset="utf-8">
<title>示例</title>
</head>
<body>
<div class="font18px">問君能有幾多愁，恰似一江春水向東流</div>
<p class="font18px">剪不斷，理還亂，是離愁，別是一番滋味在心頭</p>
<p class="italic">獨自莫憑欄，無限江山，別時容易見時難。流水落花春去也，天上人間</p>
</body>
</html>
