<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>rotate旋转</title> | |
<style> | |
*{ | |
margin:0; | |
padding:0; | |
} | |
.box{ | |
width: 200px; | |
height: 150px; | |
background: orangered; | |
text-align:center; | |
line-height:150px; | |
margin:20px auto; | |
transition:all 2s; | |
} | |
.box1:hover{ | |
/* transform:rotateX(-180deg); */ | |
transform:rotate3d(1,0,0,-180deg); | |
HTML在网页中鼠标滑过旋转
最新推荐文章于 2023-02-22 09:51:22 发布
本文介绍如何使用HTML5和CSS技术,在网页上实现元素在鼠标悬停时进行旋转的动态效果。通过CSS3的transform属性,我们可以轻松创建平滑的旋转动画,提升用户体验。
摘要由CSDN通过智能技术生成