1.购物车效果展示
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/3b1efc3707f0769455d6730663b17ac1.png)
2.代码展示
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin:0px;
padding:0px;
}.shop{
width:900px;
height:300px;
border:1px solid red;
margin:0 auto;
}.shoping{
width:290px;
height:300px;
float:left;
border:1px solid pink;
margin-left:5px;
}.shoping>.imgs{
width:200px;
height:200px;
margin:0 auto;
border:1px solid gold;
margin-top:10px;
}.imgs>img{
width:200px;
height: 200px;
}.car{
width:900px;
height:auto;
margin:0 auto;
margin-top:10px;
}.shoping p{
text-align: center;
}.gocar{
width:100px;
height:40px;
background:red;
border:none;
color:#FFF;
}
#TB img{
width: 100px;
height: 100px;
}
</style