一.邊框
1.邊框圓角
border-radius
2.邊框陰影
box-shadow
3.邊框圖片
border-inage-source:url("")
border-image-repeat:設定背景圖的平鋪方式,streth(拉伸)round(圖片自動調整縮放比例)
border-image-slice裱框切割
border-image-outset邊框向外邊框背景圖的擴充套件
border-image-width:邊框背景圖的厚度
二.瀏覽器私有化的字首
-webkit:谷歌和蘋果瀏覽器的私有化字首
-moz:火狐瀏覽器私有化字首
-o:表示Opera瀏覽器私有化字首
-ms:表示IE瀏覽器私有化字首
三.文字陰影

1.text-shadow
eg:Text-shadow：10px（水平偏移量） 20px（垂直的偏移量） 10px（模糊程度） 2px（陰影的大小） #fff（陰影的顏色）
2.多個陰影顯示:加逗號後面寫
3.內陰影：Text-shadow：inset 10px（水平偏移量） 20px（垂直的偏移量） 10px（模糊程度） 2px（陰影的大小） #fff（陰影的顏色)
四.背景
1.no-repeat,去除圖片重複性2.background-size: 背景圖片的大小尺寸
3.background-origin: 背景圖片的起始點(border-box以邊框為起始點;content-box預設值以內容為起始點;padding-box以內邊距為起始點)
4.背景裁剪區域 background-clip:border-box/content-box
5.多背景,加逗號後面寫
background:url() left top no-repeat,
url() right top no-repeat,
url() right bottom no-repeat,
url() left bottom no-repeat,
url() no-repeat center center;
五.漸變
1.線性漸變
background:linear-gradient(to left ,yellow ,green );
background: linear-gradient(90deg,yellow,green,red);/
2.徑向漸變
background:radial-gradient();
eg:background: radial-gradient(at center,yellow,green);
background: radial-gradient(50px at left top,yellow,green);//at之前設定向外輻射的範圍
六.過渡
1.transition:param1 param2;
param1 要過渡的屬性 param2要過渡的時間
例:transition: width 8s,height 3s;
2.transition: all 2s;(all表示該元素的所有屬性)