代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>商品详情</title>
<link rel="stylesheet" type="text/css" href="css/animate.css"/>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/css.css"/>
<link rel="stylesheet" type="text/css" href="css/details&personnal.css"/>
<link rel="stylesheet" type="text/css" href="css/browse.css"/>
<link rel="shortcut icon" href="favicon.ico"/>
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#"><img src="img/book.png" alt=""></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto bt">
<li>图书商城管理系统</li>
</ul>
<ul class="navbar-nav navbar-light">
<li class="nav-item"><button class="btn btn-info" type="button" style="margin-left: 5px" data-toggle="modal" data-target="#login"><a href="personnal.html">个人中心</a></button>
</li>
<li class="nav-item">
<button class="btn btn-info" type="button" style="margin-left: 5px" data-toggle="modal" data-target="#login">登录</button>
</li>
<li class="nav-item">
<button class="btn btn-success" type="button" style="margin-left: 5px" data-toggle="modal" data-target="#register">注册</button>
</li>
</ul>
</div>
</nav>
<header class="userList">
</header>
<nav>
<div class="innerBox">
<ul id="nav-ul">
<li class="active"><a href="index.html">首页</a></li>
<li><a href="cates.html">名人励志</a></li>
<li><a href="dianqi.html">经典名著</a></li>
<li><a href="wenju.html">儿童绘本</a></li>
<li><a href="pulish.html">发布物品</a></li>
<li><a href="valuation.html">估价咨询</a></li>
</li>
</ul>
</div>
</nav>
<div class="container">
<div class="innerBox">
<div class="detialHead">
<p>书籍 > </p><p>经典名著 > </p><p>童年</p>
</div>
<div class="detailBody">
<div class="detailBodyleft">
<div class="chanegecolor" name="0"></div>
<div class="bigPic">
<div class="info">
<table>
<tbody>
<tr>
<td>
<div><img src="img/童年.jpg"></div>
</td>
<td>
<div><img src="img/人间值得.jpg"></div>
</td>
<td>
<div><img src="img/人生.jpg"></div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="sPic">
<a class="btnleft" href="javascript:;"></a>
<a class="btnright" href="javascript:;"></a>
<div class="info">
<table>
<tbody>
<tr>
<td class="current">
<div>
<a href="javascript:"><img src="img/童年.jpg"></a>
</div>
</td>
<td>
<div>
<a href="javascript:"><img src="img/人间值得.jpg"></a>
</div>
</td>
<td>
<div>
<a href="javascript:"><img src="img/人生.jpg"></a>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="detailBodyright">
<div class="commodityTitle">童年</div>
<div class="commodityauthor"><p>作者：严体华 严体华</p><p>出版社：清华大学出版社</p><p>出版时间：2014年8月</p></div>
<div class="commodityprice"><span>￥30</span><p>原价：￥50</p></div>
<div class="commoditydetails">
<div class="commoditydetailsBox"><div class="left">物品分类：书籍</div><div class="right"><a href="#"><img src="img/icons/share.png"/>分享</a></div></div>
<div class="commoditydetailsBox"><div class="left">物品类型：经典名著</div><div class="right"><a href="#"><img src="img/icons/save.png"/>收藏商品</a></div></div>
<div class="commoditydetailsBox"><div class="left">新旧程度：八成新</div><div class="right"><a href="#"><img src="img/icons/connect.png"/>联系客服</a></div></div>
</div>
<div class="buyBtnbox">
<div class="btn-group choosenumberBtn">
<div class="btn-group">
<button type="button" class="btn btn-danger addbtn"><i class="glyphicon glyphicon-minus"></i></button>
<input type="text" name="" id="numberbox" value="" placeholder="1"/>
<button type="button" class="btn btn-danger lessbtn"><i class="glyphicon glyphicon-plus"></i></i></button>
</div>
</div>
<p class="invertory">(剩余库存：2)</p>
<a href="#" class="buyRightnow btn btn-danger center-block" data-index="2">立即购买</a>
<a href="#" class="addShop btn btn-danger center-block" data-index="2"><img src="img/icons/shopcar.png"/>加入购物车</a>
</div>
</div>
</div>
<div class="detialFootter">
<div class="tabbable tablediv">
<ul class="nav nav-tabs tebleul">
<li class="active tableli">
<a href="#introduction" data-toggle="tab">物品描述</a>
</li>
<li class=" tableli">
<a href="#comment" data-toggle="tab"> 买家评论(6)</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="introduction">
<div class="introductionBoxleft">
<p>书是正版图书，质量不错，八成新。</p>
<p>书是正版图书，是小孩的必备书之一！</p>
<p>希望这本书能帮到你，快来找我下单吧！祝您生活愉快！</p>
</div>
<div class="introductionBoxright">
<img src="img/cartoon.png"/>
</div>
</div>
<div class="tab-pane" id="comment">
<div class="commentBox">
<div class="eachComment">
<div class="commentBoxleft"><img src="img/头像.png"/></div>
<div class="commentBoxright">
<div class="commentBoxname"><a href="#">落枫</a></div>
<div class="commentBoxmain">书很新，对于小孩的我来说帮助很大。店主人也很好有问必答，耐心解答了我所有问题。</div>
</div>
</div>
<div class="eachComment">
<div class="commentBoxleft"><img src="img/头像.png"/></div>
<div class="commentBoxright">
<div class="commentBoxname"><a href="#">落枫</a></div>
<div class="commentBoxmain">书很新，对于小孩的我来说帮助很大。店主人也很好有问必答，耐心解答了我所有问题。</div>
</div>
</div>
<div class="eachComment">
<div class="commentBoxleft"><img src="img/头像.png"/></div>
<div class="commentBoxright">
<div class="commentBoxname"><a href="#">落枫</a></div>
<div class="commentBoxmain">书很新，对于小孩的我来说帮助很大。店主人也很好有问必答，耐心解答了我所有问题。</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row div_row_yxy" style="background:#d6d8d9;padding-top: 40px;padding-bottom: 40px;">
<div class="col-12 text-center">
<h3 class="display-8" style="color:red">图书商城管理系统</h3>
<div class="a" style="color: #6c757d;">
<span>关于我们</span><span class="copyright_split">|</span>
<span>联系我们</span><span class="copyright_split">|</span>
<span>联系客服</span><span class="copyright_split">|</span>
<span>合作招商</span><span class="copyright_split">|</span>
<span>商家帮助</span><span class="copyright_split">|</span>
<span>营销中心</span>
<p class="" style="margin-top: 15px">前置审批备案号: 川教GX-20120046</p>
<p class="">Copyright © 2022 yxy All rights reserved</p>
</div>
</div>
</div>
</body><script type=text/javascript>$(document).ready(function() {
var curid = 0;
$(".sPic .info td").click(function() {
var n = $(".chanegecolor").attr('name');
$(".sPic .info tr").eq(n).find("td").removeClass("current");
$(this).addClass("current");
curid = $(this).index();
$(".bigPic .info").animate({
"scrollLeft": curid * 226
})
})
$(".bigPic a.btnright").click(function() {
var n = $(".chanegecolor").attr('name');
curid++;
if (curid > $(".sPic .info tr").eq(n).find("td").size() - 1) {
alert("已经是最后一张了！");
curid = $(".sPic .info tr").eq(n).find("td").size() - 1;
} else {
$(".bigPic .info").animate({
"scrollLeft": curid * 226
})
}
$(".sPic .info tr").eq(n).find("td").removeClass("current");
$(".sPic .info tr").eq(n).find("td").eq(curid).addClass("current");
});
$(".sPic a.btnleft").click(function() {
$(".sPic .info").animate({
"scrollLeft": "-=80"
})
});
$(".sPic a.btnright").click(function() {
$(".sPic .info").animate({
"scrollLeft": "+=80"
})
});
});</script>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
