javascript - 如何保持内部正方形无限旋转
问题描述
我以这两个 div 为例,我想让内部的 div 保持无限旋转状态。我该怎么做?
<div class="parent">
<div class="child">
</div>
</div>
.parent{
width:100px;
height:100px;
margin:50px auto;
}
.child{
width:50px;
height:50px;
margin:25px auto;
transform:rotate(45deg)
}
解决方案
也许是关于无限旋转。如果是这样,也许这就是它的目的:)
.parent {
width: 100px;
height: 100px;
margin: 50px auto;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
margin: 25px auto;
animation: rotating 2s linear infinite;
border: 1px solid blue;
}
@keyframes rotating {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
<div class="parent">
<div class="child">
</div>
</div>
推荐阅读
- android - 使用 Gson 在 SharedPreferences 中保存动态 ListView
- jquery - How can I detect a nested object with jquery?
- powershell - Powershell 在开始和结束之间替换
- python - How to replace multiple words in .docx file and save the docx file using python-docx
- android - 如何在 Flutter 中设置 TextSpan 的圆角
- java - JAVA 中的 SOAP 请求。如何通过 HEADER
- html - 为什么我的 flexbox会长到全宽,而我的 flexbox 按钮却很小?
- java - 如何使用 TCP 连接到服务器
- python - datetime.now returns wrong time if timezone changed after running interpreter
- mysql - Compare MySQL Timestamp with NodeJS