手机端电商购物车增减数量页面效果代码
代码语言:html
所属分类:电商
代码描述:手机端电商购物车页面效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<script>
function setRem(){
var html=document.querySelector("html");
var width=html.getBoundingClientRect().width;
html.style.fontSize=width/20+"px";
}
setRem();
window.addEventListener("orientationchange",setRem);
window.addEventListener("resize",setRem);
</script>
<style>
*{margin: 0;padding: 0;}
body{color: #444;background:white;}
.header{
position: relative;
width:100%;
height: 2.25rem;
font-size: 1rem;
line-height: 2.25rem;
color:#333;
text-align: center;
}
.icon-zuojiantou{
position: absolute;
left: 0.7rem;
font-size: 1.5rem;
}
.icon-fenxiang{
position: absolute;
right: 0.7rem;
font-size: 1.5rem;
}
.one{
width: 100%;
height:8.8rem;
border-bottom:1px solid #000;
position:relative;
color: #fff;
padding: 0.3rem;
}
.one .beijing img{
width:100%;
height:8.8rem;
}
.one .login{
position: absolute;
top:0;
left:0;
width:100%;
height: 100%;
background:rgba(0,0,0,0.5);
}
.one1{
width:25%;
display: inline-block;
vertical-align: top;
}
p{margin: 0;padding: 0;}
.one1 img{
width:.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0