1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > html支付宝注册网页 用html设置支付宝页面

html支付宝注册网页 用html设置支付宝页面

时间:2020-04-29 19:37:52

相关推荐

html支付宝注册网页 用html设置支付宝页面

支付宝

*{

padding: 0;

margin: 0;

}

/*给body html元素继承可视化窗口的宽高*/

body,html{

width: 100%;

height: 100%;

}

/*给li标签自带的点去除*/

li{

list-style: none;

}

/*a的样式,去除a的下划线*/

a{

text-decoration: none;

font-size: 12px;

}

/*浮动*/

.clearfloat:after{

content: "";

display: block;

clear: both;

}

/*-----------背景图样式-----------*/

.bg{

width: 100%;

height: 90%;

background-image: url(imgs/banner.jpg);

/*设置背景图放大到背景容器的尺寸*/

background-size: cover;

background-position: center;

}

/*-------头部-------*/

.head{

width: 100%;

height: 30px;

position: absolute;

top: 20px;

}

/*hc这个div*/

.hc{

width: 80%;

margin: 0 auto;

}

/*hc下的左右div分别左右浮动*/

.hc-left{

float: left;

}

.hc-right{

float: right;

}

/*hc下的左侧两个图片样式*/

.hc-left img:first-child{

width: 70px;

height: 25px;

}

.hc-left img:last-child{

width: 31px;

height: 25px;

margin-left: 20px;

}

/*hc下的右侧两个元素样式*/

.hc-right span{

color: #BFBFBF;

font-size: 12px;

}

.hc-right a{

color: #FFF;

}

/*中间部分*/

.content{

width: 100%;

position: absolute;

top: 20%;

left: 0;

}

/*你是中心图片样式*/

.center{

width: 600px;

height: 200px;

margin: 0 auto;

}

.center img{

width: 100%;

}

/*btn的div样式*/

.btn{

width: 780px;

height: 50px;

margin: 0 auto;

margin-top: 15px;

}

/*设置a元素的样式*/

.btn a{

display: inline-block;

width:170px;

height:50px;

background-color: #12A4E9;

border-radius: 9px;

color: #FFF;

font-size: 14px;

text-align: center;

line-height: 50px;

margin-left: 18px;

float: left;

}

.icon{

display: inline-block;

width: 24px;

height: 24px;

background-image: url(imgs/aa.png);

background-size: 24px 24px;

position: relative;

top: 8px;

left:-10px;

}

.btn a:hover{

background-color: rgb(3,152,225,0.8);

}

/*设置第三个a元素的hover效果*/

.none{

display: none;

}

.slipper:hover{

height: 100px;

position: relative;

top: -25px;

}

/*鼠标滑过隐藏原来的内容*/

.slipper:hover i,.slipper:hover span{

display: none;

}

.slipper:hover .none{

display: block;

}

hr{

width: 130px;

margin: 0 auto;

border: 1px solid rgba(255,255,255,0.2);

}

.footer{

position: absolute;

bottom: 0px;

left: 0px;

width: 100%;

height: 65px;

background-color: white;

overflow: hidden;

}

.wz{

width: 99%;

height: 20px;

margin: 0 auto;

text-align: center;

}

li{

display: inline-block;

}

.footer2{

text-align: center;

}

.footer3{

width: 250px;

height: 30px;

margin: 0 auto;

text-align: center;

}

.footer3 a{

float: left;

background: url(imgs/footer.png) no-repeat 0 0;

/*设置背景图放大到背景容器的尺寸*/

margin-right: 5px;

height: 28px;

}

a.pic1 {

background-position: 0px -5px;

width: 18px;

}

a.pic1:hover{

background-position: 1px -28px;

width: 18px;

}

a.pic2 {

background-position: -33px -5px;

width: 40px;

}

a.pic2:hover {

background-position: -32px -28px;

width: 40px;

}

a.pic3 {

background-position: -74px -5px;

width: 33px;

}

a.pic3:hover {

background-position: -73px -28px;

width: 33px;

}

a.pic4 {

background-position: -115px -5px;

width: 18px;

}

a.pic4:hover {

background-position: -114px -28px;

width: 18px;

}

a.pic5 {

background-position: -157px -5px;

width: 18px;

}

a.pic5:hover {

background-position: -156px -28px;

width: 18px;

}

a.pic7 {

background-position: -200px -5px;

width: 20px;

}

a.pic7:hover {

background-position: -200px -26px;

width: 20px;

}

//body部分

我已有支付宝账户

快速登陆

我是服务商

我是开发者

我是商家用户

我是支付宝商家

我是口碑商家

我是个人用户

蚂蚁集团

|

服务商平台

|

支付宝

|

余额宝

|蚂蚁商家中心|花呗|

经营许可证编号:合字B2-0046

网站备案:沪ICP备15027489号

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。