手机端电商购物车增减数量页面效果代码-html代码-BFW代码库

手机端电商购物车增减数量页面效果代码

代码语言：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:3rem;
			height: 3rem;
			border-radius: 15px;
			background: #000;
			margin-left: 0.8rem;
			margin-bottom: 0.5rem;
			margin-top: 1.25rem;
		}
		.one1 span{
			font-size: 0.7rem;
		}
		.one1 .icon-jinakangbaoicons12{
			font-size: 1rem;
			margin-left: 0.6rem;
			color:rgb(173,173,171);
			color: #fff;
		}
		.one2{
			width:53%;
			display: inline-block;
			vertical-align: top;
			margin-top: 1.1rem;
			margin-left: -0.7rem;
			font-size: 0.7rem;
			line-height: 1.3rem;
		}
		.one2 .icon-dianhua{
			font-size: 0.8rem;
			color:rgb(173,173,171);
			color: #fff;
		}
		.one2 .icon-weizhi{
			font-size: 0.8rem;
			color:rgb(173,173,171);
			color: #fff;
		}
		.one2 .p1{
			font-size: 1.1rem;
			margin-bottom: 0.2rem;
		}
		.one2 .s1{
			margin-left: 1rem;
			margin-right: 2rem;
		}
		.one3{
			width:18%;
			display: inline-block;
			vertical-align: top;
			text-align: center;
			margin-top: 2.2rem;
			margin-left: 0.5rem;
		}
		.one3 .i1{
			disp.........完整代码请登录后点击上方下载按钮下载查看