没去 - QQMCC论坛 - Powered by Discuz! Archiver

论坛 › 社区闲聊 › 没去

没去发表于 2017-2-9 09:56:31

没去

<meta charset="UTF-8">
<style type="text/css">
#all_a{
width: 900px;
height: 500px;
margin: auto;
background: url("http://www.qqmcc.net/data/attachment/album/201702/09/094409huuh6um8eu5usurh.jpg");
background-size:100% 100% ;
font-family: "微软雅黑";
padding-top:50px ;
padding-bottom: 70px;
margin-top:50px;
margin-bottom:50px;
}
#body_z{
width:450px;
height: 210px;
margin: auto;
padding-top: 20px;
padding-bottom: 20px;
background: rgba(5,5,5,0.4);
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
-webkit-animation-duration: 6s;
}
.body_aa,.body_bb{
float: left;
}
.body_aa{
width: 110px;
height: 110px;
padding-left: 20px;
}
.body_aa img{
width: 100px;
height: 100px;
border-radius:50%;
border: solid 3px white;
}
.body_bb{
width: 310px;
height: 70px;
text-align: left;
text-indent:1.2em;
font-size: 1.5em;
color: white;
padding-top: 40px;
}
.body_bb p{
font-size: 0.6em;
color: rgb(22,139,220);
}
.clear{clear: both;}
.body_cc,.body_dd,.body_ee{float: left;width: 150px;text-align: center;height: 70px;color: whitesmoke;font-size:20px;
}
.foot_z{
width:450px;
height: 210px;
margin: auto;
margin-top: 20px;
padding-top: 20px;
padding-bottom: 20px;
background: rgba(5,5,5,0.4);
color: whitesmoke;
text-align: left;
text-indent:1.4em;
font-size:20px;
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
-webkit-animation-duration: 6s;
}
@-webkit-keyframes bounceInUp {
from, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}

60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}

75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}

90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}

to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}

@keyframes bounceInUp {
from, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}

60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}

75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}

90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}

to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes bounceInDown {
from, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}

60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}

75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}

90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}

to {
-webkit-transform: none;
transform: none;
}
}

@keyframes bounceInDown {
from, 60%, 75%, 90%, to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}

60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}

75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}

90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}

to {
-webkit-transform: none;
transform: none;
}
}
</style>

<div id="all_a">
<div id="body_z">
<div class="body_aa">
<img src="http://www.qqmcc.net/data/attachment/album/201702/09/094735ehbjt7u7uzzep7x4.jpg" border="0" alt="" style="max-width:400px">
</div>
<div class="body_bb">
如若不然我情愿
<p>时也不时适也不适</p>
</div>
<div class="clear"></div>
<hr style="width: 400px;margin: auto;margin-top: 15px;margin-bottom: 15px;">
<div class="body_cc">
1
<p>Focus on</p>
</div>
<div class="body_dd">
22
<p>fans</p>
</div>
<div class="body_ee">
157
<p>post</p>
</div>
</div>
<div class="foot_z">
<p>故事的开头总是这样</p>
<p>适逢其会，猝不及防 </p>
<p>故事的结局总是这样 </p>
<p>花开两朵</p>
<p>天各一方</p>
</div>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width="1" height="1" src="//music.163.com/outchain/player?type=2&id=26402069&auto=1&height=66"></iframe>
</div>

沈风发表于 2017-2-9 09:58:38

故事的结局总是这样

沈风发表于 2017-2-9 09:58:47

大神你好大神再见

私藏发表于 2017-2-9 10:00:45

cool

动荡不安 发表于 2017-2-9 11:39:21

你蛋疼不疼...

走光发表于 2017-2-9 11:49:09

如若不然我情愿

雨果发表于 2017-2-9 12:50:19

故事的结局总是这样

雨果发表于 2017-2-9 12:50:27

花开两朵
天各一方

Purity 发表于 2017-2-9 13:17:31

大神大神~

Purity 发表于 2017-2-9 13:17:34

再见再见

页: [1] 2

查看完整版本: 没去