服務熱線:150-8175-4822
邯鄲市最專業的網站建設公司--專注高端網站建設、軟件開發、微信開發等信息化建設為一體的網絡公司
主營業務
系統開發
網站建設
手機網站
網站維護
網站案例
域名注冊
虛似主機
 
邯鄲區縣網站建設
武安網站建設
永年網站建設
磁縣網站設計
峰峰網站制作
馬頭網站策劃維護
 
關于我們
 
公司簡介
企業文化
資質介紹
人才招聘
 
當前位置:首頁 > css3的transform中scale縮放詳解
css3的transform中scale縮放詳解
瀏覽次數:245次  發布日期:2020-8-19 11:41:28


下面我們從3個方面開始介紹:


1、scale(x,y) 對元素進行縮放


X表示水平方向縮放的倍數 | Y表示垂直方向的縮放倍數

Y是一個可選參數,沒有設置的話,則表示X,Y兩個方向的縮放倍數是一樣的。并以X為準。

transform:scale(2,2.5);  


2、scaleX(<number>) 元素只在X軸(水平方向)縮放元素。


默認值是1,基點一樣在元素的中心位置。可以通過transform-origin來改變基點

transform:scaleX(2);  


3、scaleY(<number>) 元素只在Y軸(垂直方向)縮放元素。


基點一樣在元素的中心位置。可以通過transform-origin來改變基點。

transform:scaleY(2);


最后我們看看兼容性寫法:



代碼如下:

.test{

-moz-transform:scale(2,2);

-webkit-transform:scale(2,2);

-o-transform:scale(2,2);

background:url(img/i.png) no-repeat;

width:198px;

height:133px;

}



作者:邯鄲網站建設
來源:互聯網 下一條: 創建網站需要多少錢?以后每年續費是多少錢?
 
地址:邯鄲市中華南大街雨晶小區
電話:150-8175-4822 QQ:125856421
Copyright 2012-2022 345600.net Inc. All rights Reserved.
客戶服務
15081754822
mg娱乐登录