html選擇器
CSS的作用：
就是用來改變文本的樣式
CSS三大特性
繼承性：給父類元素設置一些屬性以後，子類也可以使用，叫繼承性
如果對父類標籤設置樣式以後，如果子類標籤沒有單獨設置樣式默認繼承父類的樣式
注意：
1、並不是所有的都可以繼承，只有以color font- text line開頭的纔可以繼承
2、繼承不僅僅是直接子代可以繼承，後代同樣可以繼承
3、超鏈接的文字顏色和下劃線是不能繼承的
層疊性
就是css處理衝突的能力
注意點：
層疊型只有在多個選擇器同時選中同一個標籤，有設置了相同的屬性，纔會發生層疊型
如果多個選擇器設置的屬性沒有重複則樣式重疊
優先級
當多個選擇器選中同一個標籤，並且給同一個標籤設置了相同的屬性時，
如何層疊，由優先級來確定
優先級判斷的三種方式：
1、選擇器是否直接選中（間接選中指的就是繼承），如果是間接選中採取就近原則
2、是否是相同的選擇器
如果選擇器相同 誰在後面聽誰的
3、如果是不同的選擇器
根據選擇器的優先級 比如 id選擇器>類選擇器>標籤選擇器
4、!important 優先級最高
color: yellow !important;
注意點：！必須要
important 必須要寫；前面
語法：
選擇器｛
屬性: 屬性值；
｝
p{
color:red;
}
格式：
<style type="text/css">
選擇器{
屬性: 屬性值；
}
</style>
注意點：
style標籤必須寫在head標籤裏面
屬性 type="text/css"可寫可不寫
CSS的三種方式
1、行內樣式--直接寫在標籤裏面的樣式
<p style="color:red">今天星期五，明天再上一天班就可以休息</p>
不推薦使用 增加了結構的複雜度
2、內部樣式
CSS寫在style標籤裏面
<style type="text/css">
h1{
color:red;
}
</style>
3、外部樣式
單獨寫一個css文件，然後在頁面使用引入或導入的方式加載進來（推薦的寫法）
引入： 使用link標籤引入 <link href="path" rel="stylesheet">
導入： 使用@import
<style type="text/css">
@imprt url(path)
</style>
區別：
企業實際開發只是用link方式的，再html外面單獨寫一個css文件
外部鏈接link方式加載原理是，先把css文件和網頁文件全部加載以後再顯示頁面效果，而導入式是先加載結構再加載CSS樣式，所以可能在網速較慢的情況下客戶看到的頁面樣式不是使用css後的樣式
CSS基本選擇器
1、標籤選擇器
直接選擇標籤名，不需要<>,表示對選中的標籤直接設置css樣式，使用標籤選擇器，在頁面中所有的同名標籤都會被選中
2、類選擇器
根據指定的類名稱找到對應的標籤，然後設置樣式
格式：
.類名｛
屬性：屬性值；
｝
注意點：
1、每一個html標籤都有一個屬性叫class
2、class屬性值可以重複
3、類名就是專門給某個特定的標籤設置樣式的(常用)
4、每個標籤可以有多個clss屬性值 每個值之間使用空格隔開
3、Id選擇器
格式：
#id值｛
屬性：屬性值；
｝
注意點：
1、每個標籤都可以添加一個id屬性
2、同一個頁面id屬性值只允許出現一次（如果設置多個同名的值使用id選擇器設置樣式可以有效果
因爲，在後面學習的Js裏面要求一個ID值只能出現一次，因爲js通過id獲取時只能拿到第一個）
3、使用id選擇器需要在ID值前面加#
class選擇器和ID選擇器的編寫規範：
1、 id或class 名稱只能是由數字、字母、下劃線，不能以數字開頭
2、一般不推薦使用和html標籤名一樣的名字
3、在前端開發裏面，一般情況如果設置id屬性值僅僅是爲了設置樣式，我們不推薦使用id選擇器，因爲在前端開發裏面id屬性是留給JS用
基本選擇器的優先級
ID選擇器>類選擇器>標籤選擇器
高級選擇器
層次選擇器
後代選擇器：
格式：
選中的父標籤 選中的後代標籤{
屬性：屬性值；
}
只要是父標籤裏面的後代標籤都會被選中(包括子標籤)
子選擇器
格式：
選中的父標籤>選中的子標籤{
屬性：屬性值；
}
只能選中父標籤的直接子元素
後代選擇器和子選擇器的區別：
後代可以選中子元素和後代元素，而子選擇器只能選中子元素
相鄰兄弟選擇器
格式：
選中的標籤+選中的選擇器 E+F
E+F{
屬性：屬性值；
}
選擇E緊跟其後的F標籤，中間不能隔其他標籤而且只能選中緊跟其後一個
通用兄弟選擇器
格式：
選中的標籤~選中的選擇器 E~F
E~F{
屬性：屬性值；
}
選擇E後面的F標籤都被選中，不管中間有沒有隔開都會被選中
並集選擇器（掌握）
需要同時對多個標籤設置一樣的樣式時
格式： E,F,A｛
｝
表示同時對E F A標籤設置同樣的樣式
h1,h2,h3,h4,h5{
color: yellow;
}
交集選擇器（瞭解）
EF
E只能是標籤選擇器
F可以id選擇器也可以是類選擇器
表示EF兩者同時具備
結構僞類選擇器
格式：
E:first-child{
}
作爲父類元素第一個子元素E
格式：ul li:nth-child(2)
選擇父級元素E的第n個子元素F，F必須是父級元素的第n個子元素
屬性選擇器
* 選擇器
表示所有標籤