css实现8中loadding加载动画效果代码
代码语言:html
所属分类:加载滚动
代码描述:css实现8中loadding加载动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<title></title>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
<style>
body {
background: #000 !important;
color: #FFF;
}
p {
font-family: 'Montserrat Alternates', sans-serif;
font-size: 18px;
font-weight: 700;
padding-bottom: 20px;
color: #FFF;
}
.loader {
width: 50px;
height: 50px;
display: inline-block;
padding: 0px;
opacity: 0.5;
border: 3px solid #09acfd;
-webkit-animation: loader 1s ease-in-out infinite alternate;
animation: loader 1s ease-in-out infinite alternate;
}
.loader:before {
content: " ";
position: absolute;
z-index: -1;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border: 3px solid #09acfd;
}
.loader:after {
content: " ";
position: absolute;
z-index: -1;
top: 15px;
left: 15px;
right: 15px;
bottom: 15px;
border: 3px solid #09acfd;
}
@keyframes loader {
from {
transform: rotate(0deg) scale(1,1);
border-radius: 0px;.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0