<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>標題標簽</title> <xxx></xxx>這是一個成對標簽，</xxx>表示該標簽的結束標簽。
<style type="text/css"> </style>/*這個標簽，<style>標簽用於為HTML定義樣式。type 屬性是必需的，定義 style 元素的內容。唯一的可能值“text/css”*/
/*在HTML中，Style內包含選擇器，選擇器有，標簽選擇器、類選擇器、ID選擇器、子選擇器、包含（后代）選擇器、通用選擇器以及最后的偽類選擇符和分組選擇符。*/
/*標簽選擇器：這個是最簡單的選擇器，只需要在style內添加 標簽｛樣式｝如在h1標簽中讓字體變為紅色：h1{ color:red;}
類選擇器：它的組成部分，.stren{ 各類樣式 如 color:red;} 然后使用class=“stren”（這里的stren是類選擇器名稱，可以用任意英文代替，但不能是漢字以及拼音。）為標簽設置一個類，如<span class="stren"></span> 注：該選擇器可以單獨使用，也可以與其他元素結合使用。例：。.stren{font-size:20px} <span class="stren" ></span>。
ID選擇器：ID選擇器，與類選擇器相同也不同，它的組成部分，#stren{各類樣式},然后他不想類選擇器那樣用CLASS而是直接<span id="stren"></span>(這里的stren也是選擇器名稱，和類選擇器一樣。)注：ID選擇器只能使用一次。也就是說，同一個選擇器名稱只能出現一次。而類選擇器同一個名稱可以使用N次、
子選擇器：子選擇器用於選擇指定標簽元素的第一代子元素 語法如下.food>li{border:1px solid red;} <ol class="food"><li><ol><li></li></ol></li></ol>這里子選擇器只制定第一個<li></li>的樣式，它的第二代元素<li></li>樣式不會改變。
后代選擇器：語法為.first span{color:red;} 后代選擇器包含所有的第一代以及后代的樣式。<p class="first"></p>.p標簽中，所有的標注標簽span內的第一代一級后代的樣式。<ul class="fist"></ul>也一樣適用。
通用選擇器：通用選擇器和標簽選擇器差不多，只是標簽選擇器，選擇器是文本中的標簽。而通用選擇器，選擇器用*｛｝表示。它的作用是匹配HTML中所有的標簽元素，很強大，用一個通用標簽改全部。
偽類選擇符：它是給HTML中不存在的標簽設置樣式，這里不存在的標簽表示“標簽中的某種狀態”。比如說，我們給HTML中一個標簽元素的鼠標滑過狀態來設置字體顏色。不過目前為止，可以兼容所有瀏覽器的偽類選擇符就是A標簽上實用：hover。語法為a:hover{color:red;}這樣設置后，<a href="地址連接">文字</a> 添加了偽類選擇符，你鼠標划過“文字”會發現字體變成紅色。
分組選擇符：如果你想給兩個標簽選擇器添加同一種樣式，那么可以使用分組選擇符。比如h1{ color:red;} span{ color:red;} 把這兩個用分組選擇符就是h1,span{color:red;}