美滋滋

算命发表于 2017-4-26 12:30:27

本帖最后由算命于 2017-4-26 12:30 编辑 <br /><br /><meta charset="utf-8">
<style type="text/css">
#mq{width: 550px;height: 450px;margin: 50px auto;font-family: "Poiret One","微软雅黑 Light";font-width:300;font-size: 14px;overflow: hidden;}
#mq_a{float: left; width: 450px;height: 350px;background:url("http://www.qqmcc.net/data/attachment/album/201704/25/180329vve9ckchvy0a04co.jpg") center;background-size:cover;margin: 20px 0 0 20px;-webkit-animation-name: bounceInRight;animation-name: bounceInRight;-webkit-animation-duration: 1s;}
#mq_b{width: 450px;height: 350px;position: absolute;margin: 80px 0 0 80px;background: rgba(0,0,0,0.3);-webkit-animation-name: bounceInLeft; animation-name: bounceInLeft;-webkit-animation-duration: 2s;}
#mq_b ul{width: 300px;margin: 50px 0 0 65px;}
#mq_b ul li{list-style: none;color: #ffffff;margin-bottom: 8px;text-space: 2px;}
@-webkit-keyframes bounceInLeft {
   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(-3000px, 0, 0);
         transform: translate3d(-3000px, 0, 0);
   }

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

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

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

   to {
         -webkit-transform: none;
         transform: none;
   }
}
@keyframes bounceInLeft {
   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(-3000px, 0, 0);
         transform: translate3d(-3000px, 0, 0);
   }

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

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

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

   to {
         -webkit-transform: none;
         transform: none;
   }
}
@-webkit-keyframes bounceInRight {
   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(3000px, 0, 0);
         transform: translate3d(3000px, 0, 0);
   }

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

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

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

   to {
         -webkit-transform: none;
         transform: none;
   }
}
@keyframes bounceInRight {
   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(3000px, 0, 0);
         transform: translate3d(3000px, 0, 0);
   }

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

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

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

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

<div id="mq">
<div id="mq_a">

</div>
<div id="mq_b">
   <span style="display: block; color: #ffffff;margin: 20px;font-size: 18px;">Heart</span>
   <ul>
         <li>
            后来如果就成了假设，不确定这条街走到末尾向左向右，人流往复，我走在前面跌跌撞撞。
         </li>
         <li>
            慢慢怀疑自己的肯定，自我决绝演变成了手段极其残忍，你来我往，我站在原地默不作声。
         </li>
         <li>
            山高路远，唯有眼前季节不可辜负。
         </li>
         <li>
            /装逼结束，鼓掌撒花。
         </li>
   </ul>
</div>
</div>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=1 height=1 src="//music.163.com/outchain/player?type=2&id=468176711&auto=1&height=66"></iframe>

QQmcc-玫瑰 发表于 2017-4-26 12:59:58

鼓掌撒花

QQmcc-玫瑰 发表于 2017-4-26 13:00:13

美滋滋

QQmcc-如初 发表于 2017-4-26 13:15:04

H 很喜欢

沈风发表于 2017-4-26 14:11:04

这个逼装的漂亮

阿水怪噢 发表于 2017-4-26 14:53:00

宝贝儿这张图美呆了

QQmcc-千惠 发表于 2017-4-26 18:00:26

太喜欢你帖子了

南音¨ 发表于 2017-4-26 21:28:35

帖子不错哈哈

算卦发表于 2017-4-27 18:22:33

你开心就好

算卦发表于 2017-4-27 18:28:17

http://www.qqmcc.net//mobcent//app/data/phiz/default/10.png

页: [1] 2

QQMCC论坛's Archiver

美滋滋