讓邊框變成圓角
border-radius
: 100px;
border-radios
: 10px 20px 30px 40px;
transform
:rotate
(45deg)
;/*retate是順時針旋轉角度*/
transform
:translate
(50px, 100px)
;/*把元素從左側移動 50 畫素，從頂端移動 100 畫素*/
/* 把寬度轉換為原始尺寸的 2 倍，把高度轉換為原始高度的 4 倍。*/
transform
:scale
(2,4)
;
/*圍繞 x 軸把元素翻轉 30 度，圍繞 y 軸翻轉 20 度。*/
transform
:skew
(30deg,20deg)
;
matrix() 方法需要六個引數，包含數學函式，允許您：旋轉、縮放、移動以及傾斜元素。
/*各個屬性分別為: x縮放, x旋轉, x平移, y縮放, y旋轉, y平移*/
transform
:matrix
(0.866,0.5,-0.5,0.866,0,0)
;-ms-transform
:matrix
(15,0.5,-0.5,0.866,0,0)
;/* ie 9 */
-moz-transform
:matrix
(0.866,0.5,-0.5,0.866,0,0)
;/* firefox */
-webkit-transform
:matrix
(1,0.5,-0.5,0.866,0,0)
;/* safari and chrome */
-o-transform
:matrix
(0.866,0.5,-0.5,0.866,0,0)
;/* opera */
/*x平移 y平移 陰影度 顏色*/
box-shadow
: 0px 0px 70px indianred;
@keyframes aj
/*終止狀態*/to}
@keyframes aj
50%100%
}
animation
: 1s aj infinite;
/*呼叫時間 動畫效果名稱 是否重複*/
transition
:width 2s, height 2s;
/*transition有四個屬性
transition 簡寫屬性，用於在乙個屬性中設定四個過渡屬性
transition-property 規定應用過渡的 css 屬性的名稱。
transition-duration 定義過渡效果花費的時間。預設是 0。
transition-timing-function 規定過渡效果的時間曲線。預設是 "ease"。
transition-delay 規定過渡效果何時開始。預設是 0。
*/
CSS3中的box sizing屬性
box sizing屬性是css3中新新增的屬性，用來替換原來的css盒子模型，box sizing屬性值的不同，元素的高度和寬度的計算方法也不同。box sizing的三個屬性值，我們只針對前兩個說明 box sizing content box box sizing border box box...
css3中的動畫屬性
一 過渡動畫 transition 過渡動畫，就是能讓css樣式的變化，體現的更明顯一點，讓使用者能更清晰的看見樣式的變化。過渡的實現我們一般通過事件來觸發 例如滑鼠單擊 獲得焦點 被點選或對元素任何改變中觸發 1.transition property 檢索或設定物件中的參與過渡的屬性 all為預...
CSS3新增屬性用法整理CSS3新增屬性用法整理
css3新增屬性用法整理 css3新增屬性用法整理 1 box shadow 陰影效果 2 border color 為邊框設定多種顏色 3 border image 邊框 4 text shadow 文字陰影 5 text overflow 文字截斷 6 word wrap 自動換行 7 bord...