div+css实现小球环内滚动摇摆动画效果代码
代码语言:html
所属分类:动画
代码描述:div+css实现小球环内滚动摇摆动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
* {
/* 初始化 取消页面的内外边距 */
padding: 0;
margin: 0;
/* 盒子模型 */
box-sizing: border-box;
}
body {
/* 弹性布局 让页面元素垂直+水平居中 */
display: flex;
justify-content: center;
align-items: center;
/* 让页面始终占浏览器总高 */
height: 100vh;
background-color: #1c1f2f;
}
/* 先让它为空,待会定义下边倒影 */
.container {
/* 现在把倒影给加上 */
-webkit-box-reflect: below 5px -webkit-linear-gradient(transparent 10%, rgba(0, 0, 0, 0.5));
}
.loader {
position: relative;
width: 200px;
height: 200px;
border-radius:.........完整代码请登录后点击上方下载按钮下载查看
网友评论0