在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5  網(wǎng)絡(luò)安全  HTML/ 設(shè)置了transform: scale(-1.2);為什么字會(huì) 旋轉(zhuǎn)180度?如

設(shè)置了transform: scale(-1.2);為什么字會(huì) 旋轉(zhuǎn)180度?如何讓顯示成正常的

clipboard.png

設(shè)置了transform: scale(-1.2);為什么字會(huì) 旋轉(zhuǎn)180度?如何讓顯示成正常的transform: scale不是縮放嗎? transform:rotate不是旋轉(zhuǎn)嗎?transform: scale為什么會(huì)旋轉(zhuǎn)呢?
<!DOCTYPE html>
<html>
<head lang="en">

<meta charset="UTF-8">
<style type="text/css">

.myButton {

background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;

}
.myButton:hover {

background-color:#5cbf2a;

}
.myButton:active {

-webkit-transform: scale(-1.2);
transform: scale(-1.2);

}
</style>
</head>

<body>
<div width="150" height="30" class="myButton">123</div>
</body>
</html>

回答
編輯回答
臭榴蓮

-webkit-transform: scale(-1.2) rotate(180deg);
transform: scale(-1.2) rotate(180deg);

2018年1月27日 06:15
編輯回答
生性

你如果只想要背景旋轉(zhuǎn)的話,那背景用:before或者:after元素分離寫出來,然后對(duì):before或者:after旋轉(zhuǎn)

2018年9月6日 14:56
編輯回答
厭遇

把負(fù)號(hào)去掉:

-webkit-transform: scale(1.2);
transform: scale(1.2);

scale的變換矩陣是

scaleX 0      0
0      scaleY 0
0      0      1

所以坐標(biāo)(x, y)旋轉(zhuǎn)之后的坐標(biāo)是

           scaleX 0      0
(x, y) * ( 0      scaleY 0 ) = (scaleX * x, scaleY * y)
           0      0      1

你使用scale(-1.2),則變換后的坐標(biāo)是(-1.2 * x, -1.2 * y),所以看上去除了放大的效果外,還旋轉(zhuǎn)了180度。

2017年12月9日 08:23
編輯回答
有你在

直接transform: scale(1.2);就好了,會(huì)旋轉(zhuǎn)180度是因?yàn)?code>transform: scale(-1.2);是以中心為原點(diǎn),所有的坐標(biāo)移動(dòng)到原來-1.2倍的位置,就等于上下左右都翻轉(zhuǎn)了,看起來的效果就是旋轉(zhuǎn)了。

2017年8月15日 11:45