目錄：

• 初識CSS

• 盒子模型

• 定位

• 擴充套件

一、初識CSS

1.1CSS的優勢

　　內容和表現分離 表現的統一 豐富樣式，使佈局更靈活 有利於網頁搜尋

<!--基本寫法-->
<style type="text/css">
　　h1{
　　　　font-size:15px;
　　　　color:#0000ff;
　　　　}
</style>

<!--三種基本的選擇器-->
    <!--01.標籤選擇器-->
        比如：h1
    <!--02.類選擇器-->
        比如：.lei
    
 
<!--03.Id選擇器，一個id只能用一次-->
        比如：#id 

<!--CSS的三種引用方式-->
  <!--01.行內-->
      <p style="color:#0000ff;"></p>
  <!--02.內部-->
      <style type="text/css">
　　  h1{
　　　　  font-size:15px;
　　　　  color:#0000ff;
　　  }
    </style>
  <!--03.外部-->
    <!--引用-->
 

        <link rel="stylesheet" type="text/css" href="css/new_file.css"/>
    <!--匯入-->
         <style type="text/css">@import ulr("css/new_file.css")</style>


<!--行內樣式>內部樣式>外部樣式-->
<!--ID選擇器>類選擇器>標籤選擇器-->



<!--複合選擇器-->
    <!--01.後代選擇器-->
        E F  後代  必須用空格隔開，中間不能插入任何符號  子元素的子元素也被選中
        E>F 子代  E是父F是子 選中所有子元素
        E+F  相鄰  選中第一個子元素
        E~F  通用 所有子元素都被選中
        緊挨的是交集選擇器 有逗號的並集選擇器 全域性選擇器
    
 
<!--02.交集選擇器-->
         p.one{color:#0000ff;}只能p標籤使用one樣式
    <!--03.並集選擇器-->
         多個選擇器用逗號連線成，同時生成多個相同樣式

<!--結構偽類選擇器-->
   type 考慮型別
     ul li :first-child          第一個元素li
     ul li : last-child          最後一個元素li
     ul li p:nth-child(2)        選擇第二個子元素 第二個標籤是p
     ul li p:nth-of-type(2) 父元素第二個型別為p元素 第幾個p標籤

<!--屬性選擇器-->
   E[atrr]               選擇有某個屬性的元素
   E[atrr='val']      設定的屬性attr並且值為val
   E[attr^=val]      開頭是val
   E[attr$=val]      結尾是val
   E[attr*=val]      包含val

<!--繼承特性，子類會繼承父類-->

.