CSS3教程-3D 轉換

Hello！前一篇文章給大家介紹了CSS3教程-2D 轉換，不知道大家學的怎麼樣呢？接下來給大家介紹CSS3教程-3D 轉換。

3D 轉換：

CSS3 允許您使用 3D 轉換來對元素進行格式化。

在本文中，您將學到兩種 3D 轉換方法：

rotateX()；

rotateY()。

它如何工作？

轉換是使元素改變形狀、尺寸和位置的一種效果。

您可以使用 2D 或 3D 轉換來轉換您的元素。

瀏覽器支援：

Internet Explorer 10 和 Firefox 支援 3D 轉換。

Chrome 和 Safari 需要首碼 -webkit-。

Opera 仍然不支援 3D 轉換（它只支援 2D 轉換）。

rotateX() 方法:

通過 rotateX() 方法，元素圍繞其 X 軸以給定的度數進行旋轉。

執行個體:

div{transform: rotateX(120deg);-webkit-transform: rotateX(120deg); /* Safari and Chrome */}

rotateY() 方法:

rotateY()方法，圍繞其在一個給定度數Y軸旋轉的元素。

執行個體:

div{transform: rotateY(130deg);-webkit-transform: rotateY(130deg); /* Safari and Chrome */}

轉換屬性:

下面的表格列出了所有的轉換屬性：

3D 轉換方法：

以上就是CSS3教程-3D 轉換的內容，更多相關內容請關注topic.alibabacloud.com（www.php.cn）！

