css3 oading动画提交效果

css3 oading动画提交效果

body{ text-align: center}

.grebtn{

display: inline-block;

padding: 0.5em 1.25em;

border: 1px solid;

border-radius: 2px;

vertical-align: bottom;

font-weight: inherit;

border-color: #208000 #1F7F00;

background-color: #289600;

box-shadow: inset 0 0 1px rgba(255,255,255,.6), 0 1px #8DBF62;

color: #fff;

text-shadow: 0 -1px #137900;

margin: 100px auto;

}

dot {

display: inline-block;

height: 1em; line-height: 1;

text-align: left;

vertical-align: -.25em;

overflow: hidden;

}

dot::before {

display: block;

content: '...\A..\A.';

white-space: pre-wrap;

animation: dot 3s infinite step-start both;

}

@keyframes dot {

33% { transform: translateY(-2em); }

66% { transform: translateY(-1em); }

}

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！