svg loading加载动画代码集合
代码语言:html
所属分类:加载滚动
代码描述:svg loading加载动画代码集合
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html> <head> <meta charset="utf-8"/> <title></title> <style> html { height: 100%; background: #3023ae; background: -moz-linear-gradient(-45deg, #3023ae 0%, #c86dd7 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#3023ae), color-stop(100%,#c86dd7)); background: -webkit-linear-gradient(-45deg, #3023ae 0%,#c86dd7 100%); background: -o-linear-gradient(-45deg, #3023ae 0%,#c86dd7 100%); background: -ms-linear-gradient(-45deg, #3023ae 0%,#c86dd7 100%); background: linear-gradient(135deg, #3023ae 0%,#c86dd7 100%); background-attachment: fixed; } body { font-family: "Open Sans"; font-weight: 300; } a { color: #fff; } ul { background: #fff; width: 720px; margin: auto; margin-top: 60px; list-style: none; padding: 0; -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.37); box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.37); } ul li { width: 180px; height: 180px; line-height: 176px; text-align: center; float: left; background-repeat: no-repeat; background-position: center; } ul li img { vertical-align: middle; } li:nth-child(1) { background-color: #1ABC9C; } li:nth-child(2) { background-color: #34495E; } li:nth-child(3) { background-color: #F39C12; } li:nth-child(4) { background-color: #9B59B6; } li:nth-child(5) { background-color: #3498DB; } li:nth-child(6) { background-color: #E74C3C; } li:nth-child(7) { background-color: #2ECC71; } li:nth-child(8) { background-color: #2C3E50; } li:nth-child(9) { background-color: #F1C40F; } li:nth-child(10) { background-color: #8E44AD; } li:nth-child(11) { background-color: #2980B9; } li:nth-child(12) { background-color: #E74C3C; } .actions { margin: auto; margin-top: 45px; width: 325px; } .act.........完整代码请登录后点击上方下载按钮下载查看
网友评论0