首頁 > Web開發 > 詳細

CSS3的transform 轉換

時間:2019-06-28 14:35:44      閱讀:44      評論:0      收藏:0      [點我收藏+]

標簽:javascrip   for   scrip   osi   默認   pre   元素   origin   orm   

transform是可以實現元素位移,旋轉,縮放和變形。
只介紹了2D轉換~

    1. translate 位移:改變元素位置 最多設置兩個值,一個水平,一個垂直。如果設置為負數,則代表反方向。可設置百分比。
      eg:實現元素脫標絕對居中
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(-50%,-50%);
      

        

      2.rotate 旋轉:單位是deg 正數代表順時針,負數代表逆時針。默認元素的旋轉中心在中間位置。可修改旋轉中心:transform-origin

      3.scale 縮放:改變元素大小,寫的值是倍數,不可以設置負數,值大于1放大,值小于1縮小。
      4.skew 傾斜:改變元素傾斜的角度,單位是deg,第一個值代表水平,第二個值代表垂直。

CSS3的transform 轉換

標簽:javascrip   for   scrip   osi   默認   pre   元素   origin   orm   

原文:https://www.cnblogs.com/JiAyInNnNn/p/11102173.html

(0)
(0)
   
舉報
評論 一句話評論(0
登錄后才能評論!
? 2014 bubuko.com 版權所有 魯ICP備09046678號-4
打開技術之扣,分享程序人生!
             

魯公網安備 37021202000002號

湖南快乐十分钟走势图