概念：
css層疊樣式表（cascading style sheets），一種用來表現html或xml的語言。
作用：
結構與樣式分離的方式，便於後期的維護和修改；
可以用多套樣式，使網頁有任意樣式切換的效果；
使得頁面載入的更快，降低伺服器的成本。
樣式分類：
1. 內部樣式
"utf-8"
>
document<
/title>
"text/css"
>
p<
/style>
<
/head>
"utf-8"
>
document<
/title>
"stylesheet" type=
"text/css" href=
"test.css"
>
<
/head>
rel=「stylesheet」：rel是relationship的英文縮寫；
type=「text/css」:定義css樣式檔案的型別；
href=「index.css」：引用具體的檔案。
3. 行內樣式
"font-size: 20px"
>行內樣式<
/p>
<
/body>
概念：用來選擇(找到)需要新增樣式的標籤或者位置；
常用選擇器：標籤選擇器、（歸）類選擇器、其他選擇器。
css常用樣式
1. 背景樣式
background-color 顏色值 顏色作為背景顏色；
background-image 位置 作為背景；
background-repeat： repeat repeat-x repeat-y no-repeat 背景的重複方向；
background-attachment ： scroll fixed 背景是否隨著滾動條滾動 ；
fixed 文字滾動，背景不隨著滾動；
scroll 背景隨著文字一起滾動；
background-position 背景影象的起始位置；
background 背景樣式的值是復合了屬性值的組合；
注：background-position屬性列表
（1）top left ,top center ,top right ,center left,center center,center right,bottom left,bottom center,bottom right
如果只定義了乙個值，那麼第二個值將是center
預設值 0% 0%；
（2）x% y% 第乙個值是水平 第二個值是垂直
左上角：0% 0% 右下角：100% 100%
如果規定了乙個值另乙個值就是50%；
（3）apx bpx
左上角：0px 0px 右下角
如果規定了乙個值另乙個值就是50%
2. 文字樣式
color ：表示顏色的內容 設定文字顏色；
direction： ltr rtl 文字的方向/書寫的方向；
letter-spacing： npx(注意：n可以是負數，字元間距；
line-height ： npx 行高（行間距）；
text-align ： left,right ,center, justify（兩端對齊）。
注：direction:ltr和text-align:justify的區別
如果是字母和漢字的話，兩者效果一樣；
主要針對阿拉伯數字，兩者不一樣；
對於direction來說：對於數字改變書寫順序，對於小數點顯示也不一樣。
3. 文字修飾
text-decoration：none,underline,overline,line-through–文字的修飾：下劃線；
text-shadow：h-shadow v-shadow blur color–文字設定陰影；
text-transform：none,capitalize,uppercase,lowercase–改變字母大小寫；
text-indent：npx,nem（em表示字元單位）–首行縮排。
4. 字型類樣式
font-family：隸書，宋體，楷體等字型–設定字型；
font-style：normal，italic，oblique–規定斜體的文字；
font-weight：normal，bold，100-900–文字加粗；
font-size：npx–字型大小。
注：
font-style:
normal：預設的正常顯示；
italic：斜體-絕大多數斜體，個別不斜體的效果；
oblique：所有都實現斜體效果。
font-weight:
中間數值效果不明顯，因為瀏覽器差異性的問題；
只有100和900有效果；
現在基本上設定：normal 和 bold。
5. 列表樣式
list-style-type：none,disc,circle,square,decimal–設定列表專案的外觀；
list-style-position：inside,outside–列表符號的位置；
list-style-image：url,none–把設定為列表專案的標記；
list-style：簡寫屬性，涵蓋以上三個列表樣式屬性。
6. 偽類樣式
概念：通常情況下，超級鏈結上設定的樣式，稱之為偽類；
作用：設定超級鏈結的四種狀態；
注：偽類是使用在超級鏈結上比較多，但是超級鏈結不是偽類；
偽類是選擇器。
偽類包含兩種：狀態性偽類和結構性偽類。
狀態性偽類：
偽類選擇器：
a:link：未訪問的鏈結；
a:visited：已經訪問過的鏈結；
a:hover：滑鼠移動到連線上（浮動，懸停）；
a:active：向被啟用的元素新增樣式；
:focus：選擇擁有鍵盤輸入焦點的元素。
結構性偽類：
:first-child：選擇元素的第乙個子元素；
:last-child：選擇某個元素的最後乙個子元素；
:nth-child(n)：選擇某個元素的乙個或者多個特定的子元素；
:nth-last-child(n)：選擇某個元素的乙個或者多個特定的子元素 ，從這個元素的最後乙個子元素開始；
:first-of-type：選擇乙個上級元素下的第乙個同類子元素。
偽元素選擇器：
注：偽類選擇器是選擇一整行進行設定，而偽元素選擇器是選擇其中一段或者一行數字進行設定。
::selection：選擇指定元素中被使用者選中的內容；
::before： 可以在內容之前插入新的內容；
::after：可以在內容之後插入新的內容；
::first-line：選擇指定選擇器的首行；
::first-letter：選擇文字的第乙個字元。
其他選擇器：
*：萬用字元選擇器 – 文件中所有的內容都會被定位到；
逗號選擇器"," ：聯合選擇器；
空格選擇器 ：子孫（後代）選擇器；
「>」選擇器 ：子選擇器（不是子孫後代）；
"+ "選擇器：同輩，兄弟選擇器；
：屬性選擇器。
選擇器的優先順序：
1、！important
2、行內樣式
3、id
4、類 class
5、標籤
6、萬用字元 *
7、瀏覽器預設屬性
HTML 從零開始的學習過程 1
1.html的概念 html hyper text markup language 超文字標記語言，使用一系列的標籤對文件 圖示以及其他資訊資源進行統一關聯。特點 1.不需要編譯，直接由瀏覽器執行 2.文字檔案 3.檔案字尾名為html 4.對大小寫不敏感。2.html基礎語法部分 基本結構 doc...
HTML 從零開始的學習過程（3）
結構 標題 caption 表頭 th 頭，內容居中顯示，加粗顯示 tr thead 主體 td 表體，預設靠左顯示，不加粗 tr tbody table 腳注 td 表體，預設靠左顯示，不加粗 tr tfoot body 屬性 frame 外部邊框樣式 void，不顯示外側邊框 above，顯示上...
HTML 從零開始的學習過程（7）
position 定位 relative 相對 absolute 絕對 static 無定位 fixed 固定。相對定位 相對定位的偏移參考元素是元素本身，不會使元素脫離文件流，元素的初始衛視佔據的控制項會被保留 語法 position relative 相對定位的偏移是自己之前的位置作為參照進行的...