偽類和偽元素

• 給連結定義樣式
  • 正常連結： ：link
  • 訪問過的連結： ：visited（只能定義字型顏色）
  • 滑鼠滑過的連結： ：hover
  • 正在點選的連結： ：active
• 其他
  • 獲取焦點： ：focus
  • 指定元素前： ：before
  • 指定元素後： ：after
  • 選中的元素： ：：selection
• 其他選擇器
  • 給段落定義樣式
    • 首字母： ：first-letter
    • 首行： ：first-line
  • 屬性選擇器 可以挑選帶有特殊屬性的標籤。
    • 語法：

[屬性名]
[屬性名="屬性值"]
[屬性名-="屬性值"]
[屬性名|="屬性值"]
[屬性名^="屬性值"]
[屬性名$="屬性值"]
[屬性名*="屬性值"]

子元素選擇器

• 子元素選擇器可以給另一個元素的子元素設定樣式
• 語法： 父元素>子元素{ }
• 比如body>h1將選擇body子標籤中的所有h1標籤

其他子元素選擇器

• 選擇第一個子標籤 ：first-child
• 選擇最後一個子標籤 ：last-child
• 選擇指定位置的子元素 ：nth-child
• 選擇指定型別的子元素
  :first-of-type
  :last-of-type
  :nth-of-type

兄弟選擇器

• 除了根據祖先父子關係，還可以根據兄弟關係查詢元素。
• 語法：
  • 查詢後邊一個兄弟元素
    • 兄弟元素 + 兄弟元素{ }
  • 查詢後邊所有的兄弟元素
    • 兄弟元素 ~ 兄弟元素{ }

否定偽類

• 否定偽類可以幫助我們選擇不是其他東西的某種東西
• 語法 ：not(選擇器){ }
• 比如p:nto(.hello)表示選擇所有的p元素但是class為hello的除外

繼承

• 就像父親的財產會遺傳給兒子一樣，在CSS中祖先元素的樣式同樣也會被子元素繼承
• 繼承是指應用在一個標籤上的那些CSS樣式會同時被應用到其內嵌標籤上
• 比如為父元素設定了字型顏色，子元素也會應用上相同的顏色
• 當然並不是所有的樣式都會被繼承

選擇器的優先順序

• 內聯樣式：優先順序1000
• id選擇器：優先順序100
• 類、屬性、偽類選擇器：優先順序10
• 元素選擇器：優先順序1
• 萬用字元：優先順序0
• 繼承：沒有優先順序

文字標籤

• < em >和< strong >
  • em標籤用於表示一段內容中的著重點
  • strong標籤用於表示一個內容的重要性
  • 這兩個標籤可以單獨使用，也可以一起使用

<p>
	<strong>警告：任何情況下不要接近殭屍。</strong>
	他們只是<em>看起來</em>很友好，實際上他們是為了吃你的胳膊！
</p>

• 通常em顯示為斜體，而strong顯示為粗體

• < i >和< b >
  • i標籤會使文字變成斜體
  • b標籤會使文字變成粗體
  • 這兩個標籤和em和strong類似，但是這兩個標籤沒有語義
  • 所以根據html5標準，當我們只想設定文字特殊顯示，而不需要強調內容時就可以使用i和b標籤
• < small >
  • small標籤表示細則一類的旁註，通常包括免責宣告、注意事項、法律限制、版權資訊等
  • 瀏覽器在顯示small標籤時會顯示一個比父元素小的字號

<p><small>&copy;2018愛奇藝.保留所有權利.</small></p>

• < cite >
  • 使用cite標籤可以指明對某內容的引用或參考。例如，戲劇、文章或圖書的標題，歌曲、電影、照片或雕塑的名稱等

<p>
	<cite>《七龍珠》</cite>講的是召喚神龍的故事</p>

• < blockquote >和< q >
  • blockquote和q表示標記引用的文字
  • blockquote用於長引用，q用於短引用
  • 在兩個標籤中還可以使用cite屬性來表示引用的地址

孟子曾經說過：
	<blockquote>天將降大任於斯人也</blockquote>
	他說的真對啊！
<p>孔子曾經說過：<q>學而時習之不亦悅乎</q><p>

• < sup >和< sub >
  • sup和sub用於定義上標和下標
  • 上標主要用於表示類似於10³中的3
  • 下標則用於表示類似於H₂O中的2
• < ins >和< del >
  • ins表示插入的內容，顯示時通常會加上下劃線
  • del表示刪除的內容，顯示時通常會加上刪除線
• < code >和< pre >
  • 如果你的內容包含程式碼示例或檔名，就可以使用code元素
  • pre元素表示的時預格式化文字，可以使用pre包住code來表示一段程式碼

<pre>
	<code>
		function fun(){
			alert("hello")
		}
	</code>
</pre>