|
|
请马上登录,朋友们都在花潮里等着你哦:)
您需要 登录 才可以下载或查看,没有账号?立即注册
x
本帖最后由 马黑黑 于 2022-4-24 23:28 编辑
假设我们有一个div盒子,
<div class="mybox"></div>
它的CSS是这样(CSS代码要放在HTML代码的前面去),
<style>
.mybox {
width: 100px;
height: 80px;
border: 1px solid;
}
</style>
那么,如何让它转起来呢?当然要先设计一个关键帧动画 @keyframes + 名称,用 transform 属性的 rotate 方法,代码放在CSS里。并在 .mybox 部分的代码里加入 animation 属性(下面代码红色部分):
<style>
.mybox {
width: 100px;
height: 80px;
border: 1px solid;
animation: rot 2s linear infinite;
/* rot 是动画名称,2s 是2秒一个周期,linear是平滑运行,infinite是循环运行 */
}
@keyframes rot {
to { transform: rotate(360deg); }
}
</style>
就酱,东东就能转起来了
|
评分
-
| 参与人数 3 | 威望 +130 |
金钱 +260 |
经验 +130 |
收起
理由
|
加林森
| + 30 |
+ 60 |
+ 30 |
很给力! |
樵歌
| + 50 |
+ 100 |
+ 50 |
赞一个! |
红影
| + 50 |
+ 100 |
+ 50 |
赞一个! |
查看全部评分
|