css
css(Cascading Style Sheets) ，通常稱爲 css 樣式表或層疊樣式表（級聯樣式表）
主要是設置 html頁面中的文本內容、圖片的外形、頁面的佈局及外觀顯示樣式
引入方式及其權重
選擇器
常見的樣式
字體樣式
| 屬性 | 表示 | 注意 |
|---|---|---|
| font-size | 字題大小 | 通常用的單位是px 像素 |
| font-family | 字體種類 | |
| font-weight | 字體粗細 | 加粗： 700 或者 bold 不加粗 ： normal 或者 400 數字不跟單位 |
| font-style | 字體樣式 | 傾斜： italic 不傾斜： normal |
| font | 字體連寫 | 書寫順序：font-style font-weight font-size/line-height font-family; |
外觀樣式
| 屬性 | 表示 | 注意點 |
|---|---|---|
| color | 顏色 | 我們通常用 十六進制 ， 簡寫形式 #fff |
| line-height | 行高 | 控制行與行之間的距離 |
| text-align | 水平對齊 | 可以設定文字水平的對齊方式 |
| text-indent | 首行縮進 | 通常用於段落首行縮進2個字的距離 text-indent: 2em; |
| text-decoration | 文本修飾 | 下劃線： underline 取消下劃線： none |
背景樣式
| 屬性 | 作用 | 值 |
|---|---|---|
| background-color | 背景顏色 | 預定義的顏色值/十六進制/RGB代碼 |
| background-image | 背景圖片 | url(圖片路徑) |
| background-repeat | 是否平鋪 | repeat/no-repeat/repeat-x/repeat-y |
| background-position | 背景位置 | length/position 分別是x 和 y座標， 切記 如果有 精確數值單位，則必須按照先X 後Y 的寫法 |
| background-attachment | 背景固定還是滾動 | scroll/fixed |
| 背景簡寫 | 更簡單 | 背景顏色 背景圖片地址 背景平鋪 背景滾動 背景位置; 他們沒有順序 |
css的特性
層疊性
多種樣式疊加，如果樣式衝突，則後面的覆蓋前面的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div {
width: 200px;
height: 200px;
color: lightblue;
font-size: 18px;
}
div {
color: lightgreen;
}
</style>
</head>
<body>
<div>一朵菊花，一個小鬼</div>
</body>
</html>
繼承性
子元素可以繼承父元素的樣式（text-、font-、line-、color）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div {
width: 200px;
height: 200px;
color: lightblue;
font-size: 18px;
}
</style>
</head>
<body>
<div>
<p>一朵菊花，一個小鬼</p>
</div>
</body>
</html>
優先級（權重）
當定義CSS樣式時，出現多個規則應用在同一元素上，就需要進行全權重的計算了
傳送門