1 css的引入
內嵌式：
<style type="text/css">
</style>外聯式：
<link rel="stylesheet" href="index.css">
行內樣式：
<p style="color: blue;">這是一個p標籤！</p>
2 選擇器
Note：選擇器的優先級
1 基本
2組合
3屬性
4分組
5僞類
6元素
1 基本選擇器
1 標籤選擇器 標籤名
2 類選擇器 .類名
3 ID選擇器 #id名
4 通用選擇器 * 選中所有
2 組合選擇器
1 後代選擇器 div p（空格） //所有孫子
2 子代選擇器 div>p //親兒子
3 鄰接選擇器 div+p
4 兄弟選擇器 div~p
3 屬性選擇器（html標籤的屬性）
//屬性名查找
[title] {
color: red;
}//屬性名加值（可用正則）
[title="hello"] {
color: red;
}[title^="hello"] { //以hello爲頭的
color: red;
}
//表單
input[type="text"] {
backgroundcolor: red;
}
4 分組選擇器（用逗號，可同時設置這些選擇器）
div,p {
color: red;
}
5 僞類選擇器（用冒號，一般是a,input的一些行爲）
//沒有訪問的超鏈接a標籤樣式：
a:link {
color: blue;
}
//訪問過的超鏈接a標籤樣式：
a:visited {
color: gray;
}
//鼠標懸浮在元素上應用樣式：
a:hover {
background-color: #eee;
}
//鼠標點擊瞬間的樣式：
a:active {
color: green;
}
//input輸入框獲取焦點時樣式：
input:focus {
outline: none;
background-color: #eee;
}
6 僞元素選擇器（用冒號）
//first-letter 用於爲文本的首字母設置特殊樣式。
p:first-letter {
font-size: 48px;
}
//before 用於在元素的內容前面插入新內容。//after 用於在元素的內容後面插入新內容。
3 屬性
1 字體
font-family (字體系列)
把多個字體名稱作爲一個“回退”系統來保存。如果瀏覽器不支持第一個字體，則會嘗試下一個。瀏覽器會使用它可識別的第一個值。font-weight (字體粗細)
normal 默認值，標準粗細
bord 粗體
border 更粗
lighter 更細
100~900 設置具體粗細，400等同於normal，而700等同於bold
inherit 繼承父元素字體的粗細值font-size (字體大小)
p {
font-size: 14px;
}
//設置成inherit表示繼承父元素的字體大小值。font-style (字體樣式)
normal 正常
italic 斜體
oblique 傾斜
2 文本
text-align 文本水平對齊
left 左邊對齊 默認值
right 右對齊
center 居中對齊
justify 兩端對齊line-height 行高(一般行高等於盒子高度，使文字垂直居中)
text-decoration 文字裝飾
none 默認，定義標準的文本
underline 定義文本下的一條線
overline 定義文本上的一條線
line-through 定義穿過文本下的一條線
inherit 繼承父元素的text-decoration屬性的值text-indent 文本縮進
3 顏色
1 十六進制值 如: ＃FF0000
2 RGB值 如: RGB(255,0,0)
3 顏色的名稱 如: red
4 背景
background-color 背景顏色 transparent默認透明
background-image 背景圖像
background-size 背景圖片的尺寸background-repeat 規定如何重複背景圖像
repeat 默認。背景圖像將在垂直方向和水平方向重複
repeat-x 背景圖像將在水平方向重複
repeat-y 背景圖像將在垂直方向重複
no-repeat 背景圖像將僅顯示一次
inherit 規定應該從父元素繼承background-repeat屬性的設置background-attachment 規定背景圖像是否固定或者隨着頁面的其餘部分滾動
scroll 默認值。背景圖像會隨着頁面其餘部分的滾動而移動
fixed 當頁面的其餘部分滾動時，背景圖像不會移動
inherit 規定應該從父元素繼承background-attachment屬性的設置background-position 規定背景圖像的位置
//1
top left center left bottom left
top center center center bottom center
top right center right bottom right
如果只設置了一個關鍵詞，那麼第二個值就是"center"
//2 x% y%
第一個值是水平位置，第二個值是垂直位置
左上角是 0% 0%。右下角是 100% 100%
如果只設置了一個值，另一個值就是50%
//3 xpx ypx
同2
//4
inherit 規定應該從父元素繼承background屬性的設置
5 display
none 隱藏
block 以塊級元素顯示
inline 以行內元素顯示
inlline-block 行內塊級元素