css实现小票结算支付动画效果代码
代码语言:html
所属分类:布局界面
代码描述:css实现小票结算支付动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body
{
margin:0 auto;
padding:0;
background-color:#EFE8E2;
font-family:tahoma;
}
.paid
{
display:none;
width:300px;
margin:0 auto;
background-color:#fff;
text-align:center;
padding-top:25px;
border-radius:0px 0px 10px 10px;
padding-bottom:25px;
color:#00773D;
line-height:30px;
}
.paid p
{
background-image:url("//repo.bfw.wiki/bfwrepo/image/60873fc9b340f.png");
background-repeat:no-repeat;
background-size: contain;
background-position:left center;
padding-left:30px;
width:190px;
margin:0 auto;
}
.container
{
width:350px;
margin:50px auto;
}
.tab
{
width:350px;
margin:0 auto;
height:10px;
background-color:#2B2929;
border-radius:50px
}
.receipt
{
background-color:#FAFAF9;
padding-top:20px;
width:300px;
height:300px;
margin:-5px auto;
border-radius:5px 5px 50px 50px;
-moz-box-shadow: 0 10px 30px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 10px 30px rgba(0,0,0,0.3);
box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.paper
{
border-top:1px dashed #ccc;
width:96%;
margin:0 auto;
}
.title
{
color:#00773D;
margin-top:20px;
margin-left:10px;
font-weight:bold;
float:left;
font-size:16px;
line-height:30px;
}
.date
{
color:#00773D;
margin-top:20px;
margin-right:10px;
font-weight:lighter;
float:right;
font-size:12px;
line-height:30px;
}
table
{
clear:both;
width:95%;
margin:0 auto;.........完整代码请登录后点击上方下载按钮下载查看
网友评论0