浮動、快捷鍵
一、
1.counter-reset:F44;計數器重置,默認值為0
2.counter-increment:F44;計數器自增,每次+1
3.content:counter(F44);輸出當前計數器的值
二、
1.background:linear-gradient(角度或方向,起始顏色,結束顏色);——background:linear-gradient(to top,red,yellow); 漸變色
2.transform:scale(寬,高);——transform:scale(1,2); 漸變動作,變形
3.transition:指定屬性 漸變是否線性 持續時間;——transition:all linear 3s; 漸變動作過渡時間
4.transition-delay:5s; 設置延遲過渡時間
三、何時使用margin和padding
1.Margin:border需要空白(距離)時,空白(距離)不需要背景色(縱向重疊,取最大值橫向疊加)
2.Padding:border內側需要空白(距離)時,空白(距離)需要背景色(縱向、橫向都疊加)
(1)margin用來隔開元素與元素之間的距離,padding是用來隔開元素與內容之間的距離
(2)margin用於布局,元素與元素之間互不相幹,padding元素與內容之間的間距,讓內容與元素之間有一段“所謂的呼吸距離”
四、float(浮動)
浮動的基本行為:
1.子級浮動,導致父級元素塌陷
例:li浮動,在ul邊框之下顯示,並且ul高度為0
2.包裹性:若浮動元素沒有設置寬度,會疊加到最小寬度
3.元素浮動後,橫向的margin疊加
4.浮動元素影響其他元素(位置 布局)
五、
margin:auto;居中
clear:both;清除浮動
border 邊框,占像素
outline 邊框,不占像素,不能設置單獨邊框,只能四邊顯示
overflow:hidden;溢出隱藏,超出隱藏。 如果未設置寬高,子級浮動,自動找回父級高度
font-size:0;可以清除文本的大小(圖片和文字之間的間隙)
outline:none;去除焦點框
六、emmet快捷鍵
1.兄弟級關系用“ + ”
2.創建父級元素使用“ ^ ”
3.分組,通常用於子級
4.類名快捷 格式:元素名稱+“ . ”+類名
5.ID快捷 格式:元素名稱+“ # ”+類名
6.類名自增1 格式:元素名+“ . ”+“ 類名 ”+“ $ ”+“ * ”+“ 個數 ”
7.類名自增2 格式:元素名+“ . ”+“ 類名 ”+“ $ ”+“ $ ”+“ * ”+“ 個數 ”
8.類名自增3 格式:元素名+“ . ”+“ 類名 ”+“ $ ”+“ @ ”+“ - ”+“ * ”+“ 個數 ”
9.類名自增4 格式:元素名+“ . ”+“ 類名 ”+“ $ ”+“ @ ”+“ n ”+“ * ”+“ 個數 ” n: 從n開始排序自增
10.組合縮寫 格式:元素名+“ . ”+“ 類名 ”+“ # ”+“ ID名 ”
11.屬性快捷鍵 格式:元素名稱[屬性名稱=“屬性值”]
12.添加元素內容 格式:元素名稱{元素內容}
浮動、快捷鍵