位置:首頁(yè) > 軟件操作教程 > 編程開(kāi)發(fā) > CSS > 問(wèn)題詳情

CSS3 3D轉(zhuǎn)換 1.rotateXO方法

提問(wèn)人:劉團(tuán)圓發(fā)布時(shí)間:2020-11-19

rotateX()方法,圍繞其在一個(gè)給定度數(shù)X軸旋轉(zhuǎn)的元素。

這個(gè)方法與2D轉(zhuǎn)換方法rotateO不同的是,rotate()方法是讓元素在平面內(nèi)旋轉(zhuǎn),而rotateX()方法是讓元素在X軸上進(jìn)行旋轉(zhuǎn)。

【例題】使用rotateXO方法

代碼如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

div{

width: 200px;

height: 200px;

background: red;

margin:20px;

color:#fff;

font-size: 50px;

line-height: 200px;

text-align: center;

transform-origin: 0 0 ;

float: left;

}

.d1{

transform: rotateX(40deg);

}

</style>

</head>

<body>

<div>3D旋轉(zhuǎn)</div>

<div>3D旋轉(zhuǎn)</div>

</body>

</html>

image.png

繼續(xù)查找其他問(wèn)題的答案?

相關(guān)視頻回答
回復(fù)(0)
返回頂部