正常的 旋轉(zhuǎn)的transform:rotate(45deg);? deg單位代表多少度

平移的transform:translate(100px,0px);? (水平方向移動，垂直方向移動)

縮放的transform:scale(1.5,1);? (水平方向移動，垂直方向移動)

如果水平和垂直都一樣可以簡寫為? ? transform:scale(1.5);

綜合的 transform:rotate(45deg) translate(100px,0px) scale(1.5);

注意點：1、如果需要進(jìn)行多個轉(zhuǎn)換，那么用空格隔開

2、2D的轉(zhuǎn)換模塊會修改元素的坐標(biāo)系，所以旋轉(zhuǎn)之后再平移就不是水平平移的

形變中心點

transform-origin: 水平方向 垂直方向；

取值有： 像素? 百分比? 特殊關(guān)鍵字（left/center/right? top/center/bottom）

默認(rèn)情況下所有元素都是以自己的中心點作為參考來旋轉(zhuǎn)的, 我們可以通過形變中心點屬性來修改它的參考點

旋轉(zhuǎn)軸向

想圍繞哪個軸旋轉(zhuǎn)，那么只需要在rotate后面加上哪個軸即可。

transform:rotateZ();? 默認(rèn)的

transform:rotateX();

transform:rotateY();

過場動畫和過渡動畫區(qū)別

透視屬性 近大遠(yuǎn)小

perspective:500px;? 后面的這個像素 是指距離這個物理的距離

注意點：透視屬性必須添加到需要呈現(xiàn)近大遠(yuǎn)小效果的元素的父元素上面

盒子陰影和文字陰影

盒子的陰影

box-shadow:水平偏移 垂直偏移 模糊度 陰影擴(kuò)展 陰影顏色 內(nèi)外陰影；

注意點1、盒子的陰影分為內(nèi)外陰影，默認(rèn)情況下就是外陰影

2、快速添加陰影只需要編寫三個參數(shù)即可

box-shadow:水平偏移 垂直偏移 模糊度；

默認(rèn)情況下陰影的顏色和盒子內(nèi)容的顏色一致

文字的陰影

如何給文字添加陰影

text-shadow:水平偏移 垂直偏移 模糊度 陰影顏色；

注意點：快速添加陰影只需要編寫三個參數(shù)即可

text-shadow:水平偏移 垂直偏移 模糊度；

默認(rèn)情況下陰影的顏色和文字的顏色一致

翻轉(zhuǎn)的菜單

ul>li{菜單名}*5

/*設(shè)置透明度 0透明? 1不透明*/

opacity:0;

定位的元素會覆蓋沒有定位的元素