html5
????普通：
header section footer nav article aside figure
????特殊：
canvas video audio(controls控制臺(tái))
????表單：
type
time
color
range
number
????自動(dòng)獲取焦點(diǎn)：
autofocus
????提示文字：
placeholder
css3：
background:-webkit-linear-gradient(top,red,blue,green);
????瀏覽器的前綴：
????以前：
background:-webkit-linear-gradient(top,red,blue,green);
background:-ms-linear-gradient(top,red,blue,green);
background:-moz-linear-gradient(top,red,blue,green);
background:-o-linear-gradient(top,red,blue,green);
????現(xiàn)在：
background:-webkit-linear-gradient(top,red,blue,green);
background:linear-gradient(top,red,blue,green);
-webkit- 谷歌
-ms- IE
-moz- 火狐
-o- 歐朋
圓角：
border-radius:10px; ---四個(gè)方向的圓角都是10px
圓：
1.正方形
2.值是：50%；（寬高的一半）
左上角單獨(dú)寫(xiě)法：
border-top-left-radius:50px;
border-top-left-radius:100px 50px;---上邊100px弧度 左邊50px弧度！
動(dòng)畫(huà)：
????第一種動(dòng)畫(huà)：
????????用法：改變誰(shuí)提前給它加好這個(gè)動(dòng)畫(huà)樣式！
????transition:1s all; ---過(guò)渡動(dòng)畫(huà)！
????transition:3s all ease-in-out;
transition:時(shí)間 所有樣式 運(yùn)動(dòng)形式;
好處：
????1. 什么樣式都可以！
????2. 和js配合起來(lái)很輕松！
????3. 性能很高！
***跳變的動(dòng)畫(huà)做不了?。ㄗ兒脦状危?/p>
????第二種動(dòng)畫(huà)：
????定義動(dòng)畫(huà)
@-webkit-keyframes aaa{
0%{width:100px;height:100px; background:red;}
50%{width:300px;height:100px; background:yellow; border-radius:50%;}
100%{width:100px;height:100px; background:red;}
????調(diào)用：（讓誰(shuí)改變，給誰(shuí)調(diào)用?。?/p>
-webkit-animation:aaa 2s infinite;
-webkit-animation:動(dòng)畫(huà)名 時(shí)間 運(yùn)動(dòng)形式;
infinite（無(wú)限運(yùn)動(dòng)）
背景色：
1.red blue
2.#000 #fff
3.rgb（0,0,0）---css3
background:rgba(0,0,0,0.5);
background:rgba(0,0,0,透明度);
盒子陰影：
默認(rèn)外陰影！
box-shadow:5px 5px 5px 5px #000;
1.X軸偏移量（正數(shù)向右）
2.Y軸偏移量（正數(shù)向下）
3.模糊度
4.陰影大小
5.顏色
內(nèi)陰影:inset
box-shadow:inset 5px 5px 5px 5px blue;
文本陰影：
????text-shadow:5px 5px 5px #000;
????????1.X軸偏移量（正數(shù)向右）
????????2.Y軸偏移量（正數(shù)向下）
????????3.模糊度
????????4.顏色
***注意：
????1.沒(méi)有內(nèi)陰影
????2. text-shadow:5px 5px 5px blue,15px 15px 2px red,30px 30px 2px green;
背景色漸變：
線(xiàn)性：
background:linear-gradient(red,blue,green);
方向：默認(rèn)從上往下
背景色：linear-gradient(顏色1,顏色2,顏色3)；
-webkit-linear-gradient(top,red,blue,green);
-webkit-linear-gradient(開(kāi)始方向,red,blue,green)
------單詞表示法：
background:-webkit-linear-gradient(10deg,red,blue,green)---度數(shù)表示法：
60deg--60度；---按照逆時(shí)針來(lái)走的！
background:linear-gradient(45deg,red 25%,blue 25%,blue 50%,yellow 50%,yellow 75%,green 75%);
徑向：
background:radial-gradient(red,blue);
1.形狀1
background:radial-gradient(100px 100px,red,blue);
background:radial-gradient(x軸半徑 y軸半徑,red,blue);
2.形狀2
background:radial-gradient(ellipse,red,blue);----會(huì)隨著div的寬高變橢圓
background:radial-gradient(circle,red,blue);----就是圓
3.位置：圓的中心點(diǎn)的位置！
全：background:radial-gradient(位置,形狀,red,blue);
1.單詞表示法
-webkit-radial-gradient(left top,100px 100px,red,blue)
2.數(shù)值（以div的左上角為起點(diǎn)）
background:-webkit-radial-gradient(0 0,100px 100px,red,blue);
第一個(gè)值是left
第二個(gè)是top
背景色：-webkit-
背景圖大?。?/p>
background-size:100% 100%;
背景圖大小：寬 高！
background-size:contain;
寬度100%（寬度和父級(jí)寬度一致，高度按照寬度比例變化-為了保持圖片不變形）
background-size:cover;
高度100%（高度和父級(jí)高度一致，寬度寬度按照高度比例變化-為了保持圖片不變形）
蒙版：
-webkit-mask:url(img/666.png) no-repeat center;
效果：配合背景圖達(dá)到效果（對(duì)于素材來(lái)說(shuō)：透明的地方不顯示，不透明顯示）
