单表:查询全部-分页
1 package vo; 2 3 import java.util.List; 4 5 public class Page<T> { 6 /* 7 * 总页数 = Max.ceil(总条数 / 页大小) 8 * 所以:设置了总条数,则总页数应该更新。 9 * 10 * 修改页大小,则总页数应该更新。总页数修改了则起始页链接和终止页链接应该重新计算。 11 * 修改了页偏向,则起始页链接和终止页链接应该重新计算。 12 */ 13 // 当前页 14 private int currentPage; 15 // 页大小 16 private int pageSize; 17 // 总条数 18 private int totalCount; 19 // 总页数 20 private int totalPage; 21 // 数据 22 private List<T> dataList; 23 24 //起始 25 private int startLink; 26 //结束 27 private int endLink; 28 //页码个数 29 private int linkCount = 5; 30 //页码为偶数个时,当前页偏向左 31 private boolean inLeft = true; 32 //设置已经计算索引标记。 33 private boolean needCompute = true; 34 35 //空参构造 36 public Page() {} 37 38 // 真分页的构造器,只从数据库中查询指定页,并没有查询所有。 39 public Page(int currentPage, int pageSize) { 40 this(currentPage, pageSize, null); 41 } 42 43 // 假分页的构造器,已经查询出了所有,只是进行了分页 44 public Page(int currentPage, int pageSize, List<T> dataList) { 45 this.currentPage = currentPage; 46 this.pageSize = pageSize; 47 48 if (dataList != null && !dataList.isEmpty()) { 49 // this.totalCount = dataList.size(); 50 // this.totalPage = (int) Math.ceil(1.0 * this.totalCount / this.pageSize); 51 setTotalCount(dataList.size()); 52 53 //获取当前页数据 54 int fromIndex = (this.currentPage - 1) * this.pageSize; 55 int toIndex = fromIndex + this.pageSize < dataList.size() 56 ? fromIndex + this.pageSize 57 : dataList.size(); 58 59 this.dataList = dataList.subList(fromIndex, toIndex); 60 } 61 } 62 63 private void computeStartEnd() { 64 //如果已经计算了,则返回 65 if(needCompute == false) 66 return; 67 //如果页码个数大于总页数,起始页为1 68 if(linkCount >= totalPage) { 69 startLink = 1; 70 endLink = totalPage; 71 needCompute = false; 72 return; 73 } 74 //计算起始页链接 75 // if(linkCount % 2 == 0) { 76 // if(inLeft == true) { 77 // startLink = currentPage - linkCount / 2 + 1; 78 // }else { 79 // startLink = currentPage - linkCount / 2; 80 // } 81 // }else { 82 // startLink = currentPage - linkCount / 2; 83 // } 84 //代码优化 85 startLink = currentPage - linkCount / 2; 86 if(linkCount % 2 == 0 && inLeft == true) 87 startLink++; 88 if(startLink < 1) 89 startLink = 1; 90 //根据起始页链接计算结束页链接 91 endLink = startLink + linkCount - 1; 92 if(endLink > totalPage) { 93 endLink = totalPage; 94 startLink = totalPage - linkCount + 1; 95 } 96 needCompute = false; 97 } 98 99 public int getStartLink() { 100 // //计算起始索引 101 // if(linkCount / 2 == 0) { 102 // if(inLeft == true) { 103 // startLink = currentPage - linkCount / 2 + 1; 104 // }else { 105 // startLink = currentPage - linkCount / 2; 106 // } 107 // }else { 108 // startLink = currentPage - linkCount / 2; 109 // } 110 // if(startLink < 0) 111 // startLink = 1; 112 // return startLink; 113 114 computeStartEnd(); 115 return startLink; 116 } 117 118 public int getEndLink() { 119 //计算结束索引 120 // if(linkCount / 2 == 0) { 121 // if(inLeft == true) { 122 // endLink = currentPage + linkCount / 2; 123 // }else { 124 // endLink = currentPage + linkCount / 2 - 1; 125 // } 126 // }else { 127 // endLink = currentPage + linkCount / 2; 128 // } 129 // if(endLink > totalPage) 130 // endLink = totalPage; 131 // return endLink; 132 133 computeStartEnd(); 134 return endLink; 135 } 136 137 public void setLinkCount(int linkCount) { 138 needCompute = true; 139 this.linkCount = linkCount; 140 } 141 142 public void setInLeft(boolean inLeft) { 143 needCompute = true; 144 this.inLeft = inLeft; 145 } 146 147 public int getCurrentPage() { 148 return currentPage; 149 } 150 151 public void setCurrentPage(int currentPage) { 152 this.currentPage = currentPage; 153 } 154 155 public int getPageSize() { 156 return pageSize; 157 } 158 159 public void setPageSize(int pageSize) { 160 this.pageSize = pageSize; 161 } 162 163 public int getTotalCount() { 164 return totalCount; 165 } 166 167 public void setTotalCount(int totalCount) { 168 this.totalCount = totalCount; 169 this.totalPage = (int) Math.ceil(1.0 * this.totalCount / this.pageSize); 170 } 171 172 public int getTotalPage() { 173 return totalPage; 174 } 175 176 public void setTotalPage(int totalPage) { 177 this.totalPage = totalPage; 178 } 179 180 public List<T> getDataList() { 181 return dataList; 182 } 183 184 public void setDataList(List<T> dataList) { 185 this.dataList = dataList; 186 } 187 188 }
1 package web; 2 3 import java.io.IOException; 4 import java.sql.SQLException; 5 import java.util.List; 6 7 import javax.servlet.ServletException; 8 import javax.servlet.http.HttpServlet; 9 import javax.servlet.http.HttpServletRequest; 10 import javax.servlet.http.HttpServletResponse; 11 12 import domain.Product; 13 import service.ProductService; 14 import vo.Page; 15 16 public class ProductListServlet extends HttpServlet { 17 private static final long serialVersionUID = 1L; 18 19 protected void doGet(HttpServletRequest request, HttpServletResponse response) 20 throws ServletException, IOException { 21 //获取分页条参数 22 String currentPageStr = request.getParameter("currentPage"); 23 String pageSizeStr = request.getParameter("pageSize"); 24 25 //默认第1页 26 int currentPage = 1; 27 //默认页大小20 28 int pageSize = 5; 29 if(currentPageStr != null && !currentPageStr.trim().equals("")) 30 currentPage = Integer.parseInt(currentPageStr); 31 if(pageSizeStr != null && !pageSizeStr.trim().equals("")) 32 pageSize = Integer.parseInt(pageSizeStr); 33 34 //调业务,根据分页信息,查询页。 35 ProductService productService = new ProductService(); 36 Page<Product> productPage = null; 37 try { 38 productPage = productService.findProductPage(currentPage, pageSize); 39 } catch (SQLException e) { 40 e.printStackTrace(); 41 } 42 request.setAttribute("productPage", productPage); 43 44 //调业务,查询所有商品 45 // ProductService productService = new ProductService(); 46 // List<Product> productList = null; 47 // try { 48 // productList = productService.findAllProduct(); 49 // } catch (SQLException e) { 50 // e.printStackTrace(); 51 // } 52 // request.setAttribute("productList", productList); 53 54 //转发给product_list.jsp 55 request.getRequestDispatcher("/product_list.jsp").forward(request, response); 56 } 57 58 protected void doPost(HttpServletRequest request, HttpServletResponse response) 59 throws ServletException, IOException { 60 doGet(request, response); 61 } 62 }
1 package service; 2 3 import java.sql.SQLException; 4 import java.util.List; 5 6 import dao.ProductDao; 7 import domain.Product; 8 import vo.Page; 9 10 11 public class ProductService { 12 13 /** 14 * 查询全部商品<br/> 15 * 就是我写的 16 * 这是第3行 17 * @return 18 * @throws SQLException 19 */ 20 public List<Product> findAllProduct() throws SQLException { 21 ProductDao productDao = new ProductDao(); 22 return productDao.findAllProduct(); 23 } 24 25 /** 26 * 根据id查询商品 27 * @param pid 商品id 28 * @return 具有指定id的商品 29 * @throws SQLException 30 */ 31 public Product findProductById(String pid) throws SQLException { 32 ProductDao productDao = new ProductDao(); 33 return productDao.findProductById(pid); 34 } 35 36 public Page<Product> findProductPage(int currentPage, int pageSize) throws SQLException { 37 ProductDao productDao = new ProductDao(); 38 //查询总条数 39 int totalCount = productDao.getCount().intValue(); 40 41 //查询页数据 42 int offset = (currentPage - 1) * pageSize; 43 List<Product> productList = productDao.findProductPage(offset, pageSize); 44 45 //计算总页数 46 int totalPage = (int) Math.ceil(1.0 * totalCount / pageSize); 47 48 //创建页对象 49 Page<Product> productPage = new Page<Product>(currentPage, pageSize); 50 productPage.setTotalCount(totalCount); 51 productPage.setTotalPage(totalPage); 52 productPage.setDataList(productList); 53 54 productPage.setLinkCount(6); 55 productPage.setInLeft(false); 56 57 return productPage; 58 } 59 60 }
1 package dao; 2 3 import java.sql.SQLException; 4 import java.util.List; 5 6 import org.apache.commons.dbutils.QueryRunner; 7 import org.apache.commons.dbutils.handlers.BeanHandler; 8 import org.apache.commons.dbutils.handlers.BeanListHandler; 9 import org.apache.commons.dbutils.handlers.ScalarHandler; 10 11 import domain.Product; 12 import utils.DataSourceUtils; 13 14 public class ProductDao { 15 16 /** 17 * 查询全部商品 18 * @return List<Product> 全部商品列表 19 * @throws SQLException 20 */ 21 public List<Product> findAllProduct() throws SQLException { 22 QueryRunner runner = new QueryRunner(DataSourceUtils.getDataSource()); 23 String sql = "select * from product"; 24 return runner.query(sql, new BeanListHandler<Product>(Product.class)); 25 } 26 27 /** 28 * 根据id查询商品 29 * @param pid 商品id 30 * @return 具有指定id的商品 31 * @throws SQLException 32 */ 33 public Product findProductById(String pid) throws SQLException { 34 QueryRunner runner = new QueryRunner(DataSourceUtils.getDataSource()); 35 String sql = "select * from product where pid=?"; 36 return runner.query(sql, new BeanHandler<Product>(Product.class), pid); 37 } 38 39 /** 40 * 查询总条数 41 * @return 42 * @throws SQLException 43 */ 44 public Long getCount() throws SQLException { 45 QueryRunner runner = new QueryRunner(DataSourceUtils.getDataSource()); 46 String sql = "select count(*) from product"; 47 return runner.query(sql, new ScalarHandler<>()); 48 } 49 50 /** 51 * 查询页数据 52 * @param offset 起始行 53 * @param rowCount 行数 54 * @return 55 * @throws SQLException 56 */ 57 public List<Product> findProductPage(int offset, int rowCount) throws SQLException { 58 QueryRunner runner = new QueryRunner(DataSourceUtils.getDataSource()); 59 String sql = "select * from product limit ?, ?"; 60 return runner.query(sql, new BeanListHandler<Product>(Product.class), offset, rowCount); 61 } 62 63 }
1 package utils; 2 3 import java.sql.Connection; 4 import java.sql.SQLException; 5 6 import javax.sql.DataSource; 7 8 import com.mchange.v2.c3p0.ComboPooledDataSource; 9 10 /* 11 * 提供一个工具类来获取数据源 12 */ 13 public class DataSourceUtils { 14 private static final DataSource dataSource = new ComboPooledDataSource(); 15 private static final ThreadLocal<Connection> tl = new ThreadLocal<Connection>(); 16 17 // 获取线程相关连接,一个线程获取的始终是同一个连接。 18 public static Connection getCurrentConnection() throws SQLException { 19 // 从ThreadLocal中取 20 Connection conn = tl.get(); 21 if(conn == null) { 22 // 如果没有,则获取一个连接,放入ThreadLocal 23 conn = dataSource.getConnection(); 24 tl.set(conn); 25 } 26 return conn; 27 } 28 29 // 开启事务 30 public static void startTransaction() throws SQLException { 31 getCurrentConnection().setAutoCommit(false); 32 } 33 34 // 提交事务 35 public static void commit() throws SQLException{ 36 getCurrentConnection().commit(); 37 } 38 39 // 回滚事务 40 public static void rollback() throws SQLException{ 41 getCurrentConnection().rollback(); 42 } 43 44 // 获取数据源 45 public static DataSource getDataSource() { 46 return dataSource; 47 } 48 49 // 从连接池获取一个连接 50 public static Connection getConnection() throws SQLException { 51 return dataSource.getConnection(); 52 } 53 }
1 package domain; 2 3 import java.util.Date; 4 5 /* 6 CREATE TABLE `product` ( 7 `pid` varchar(32) NOT NULL, 8 `pname` varchar(50) DEFAULT NULL, 9 `market_price` double DEFAULT NULL, 10 `shop_price` double DEFAULT NULL, 11 `pimage` varchar(200) DEFAULT NULL, 12 `pdate` date DEFAULT NULL, 13 `is_hot` int(11) DEFAULT NULL, 14 `pdesc` varchar(255) DEFAULT NULL, 15 `pflag` int(11) DEFAULT NULL, 16 `cid` varchar(32) DEFAULT NULL, 17 PRIMARY KEY (`pid`), 18 KEY `sfk_0001` (`cid`), 19 CONSTRAINT `sfk_0001` FOREIGN KEY (`cid`) REFERENCES `category` (`cid`) 20 ) 21 */ 22 public class Product { 23 private String pid; 24 private String pname; 25 private Double market_price; 26 private Double shop_price; 27 private String pimage; 28 private Date pdate; 29 private Integer is_hot; 30 private String pdesc; 31 private Integer pflag; 32 private String cid; 33 34 public Product() { 35 } 36 37 public String getPid() { 38 return pid; 39 } 40 41 public void setPid(String pid) { 42 this.pid = pid; 43 } 44 45 public String getPname() { 46 return pname; 47 } 48 49 public void setPname(String pname) { 50 this.pname = pname; 51 } 52 53 public Double getMarket_price() { 54 return market_price; 55 } 56 57 public void setMarket_price(Double market_price) { 58 this.market_price = market_price; 59 } 60 61 public Double getShop_price() { 62 return shop_price; 63 } 64 65 public void setShop_price(Double shop_price) { 66 this.shop_price = shop_price; 67 } 68 69 public String getPimage() { 70 return pimage; 71 } 72 73 public void setPimage(String pimage) { 74 this.pimage = pimage; 75 } 76 77 public Date getPdate() { 78 return pdate; 79 } 80 81 public void setPdate(Date pdate) { 82 this.pdate = pdate; 83 } 84 85 public Integer getIs_hot() { 86 return is_hot; 87 } 88 89 public void setIs_hot(Integer is_hot) { 90 this.is_hot = is_hot; 91 } 92 93 public String getPdesc() { 94 return pdesc; 95 } 96 97 public void setPdesc(String pdesc) { 98 this.pdesc = pdesc; 99 } 100 101 public Integer getPflag() { 102 return pflag; 103 } 104 105 public void setPflag(Integer pflag) { 106 this.pflag = pflag; 107 } 108 109 public String getCid() { 110 return cid; 111 } 112 113 public void setCid(String cid) { 114 this.cid = cid; 115 } 116 }
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 4 <!DOCTYPE html> 5 <html> 6 <head> 7 <meta name="viewport" content="width=device-width, initial-scale=1"> 8 <title>会员登录</title> 9 <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" /> 10 <script src="js/jquery-1.11.3.min.js" type="text/javascript"></script> 11 <script src="js/bootstrap.min.js" type="text/javascript"></script> 12 <!-- 引入自定义css文件 style.css --> 13 <link rel="stylesheet" href="css/style.css" type="text/css" /> 14 <script> 15 window.onload = function(){ 16 //处理页大小pageSize的回显 17 var pageSizeOptions = document.getElementById("pageSizeElem").options; 18 for(var i = 0; i < pageSizeOptions.length; i++){ 19 if(pageSizeOptions[i].value == ${productPage.pageSize} ){ 20 pageSizeOptions[i].selected = true; 21 break; 22 } 23 } 24 } 25 /* 错误的写法 26 function changePageSize(this){ 27 location.href = "${pageContext.request.contextPath}/productList?currentPage=1&pageSize=" 28 + obj.selectedOptions[0].value; 29 console.log(this); 30 } 31 */ 32 function changePageSize(obj){ 33 location.href = "${pageContext.request.contextPath}/productList?currentPage=1&pageSize=" 34 + obj.selectedOptions[0].value; 35 /* 36 console.log(obj); 37 console.log(obj.selectedOptions.value);//错误,selectedOptions是一个数组 38 */ 39 } 40 </script> 41 <style> 42 body { 43 margin-top: 20px; 44 margin: 0 auto; 45 100%; 46 } 47 48 .carousel-inner .item img { 49 100%; 50 height: 300px; 51 } 52 </style> 53 </head> 54 55 <body> 56 57 58 <!-- 引入header.jsp --> 59 <jsp:include page="/header.jsp"></jsp:include> 60 61 62 <div class="row" style=" 1210px; margin: 0 auto;"> 63 <div class="col-md-12"> 64 <ol class="breadcrumb"> 65 <li><a href="#">首页</a></li> 66 </ol> 67 </div> 68 69 <c:forEach items="${productPage.dataList }" var="product"> 70 <div class="col-md-2" style="height:250px"> 71 <a href="${pageContext.request.contextPath }/productInfo?pid=${product.pid}"> <img src="${pageContext.request.contextPath }/${product.pimage }" 72 width="170" height="170" style="display: inline-block;"> 73 </a> 74 <p> 75 <a href="${pageContext.request.contextPath }/productInfo?pid=${product.pid}" style='color: green'>${product.pname }</a> 76 </p> 77 <p> 78 <font color="#FF0000">商城价:¥${product.shop_price }</font> 79 </p> 80 </div> 81 </c:forEach> 82 83 <%-- <c:forEach items="${productList }" var="product"> 84 <div class="col-md-2" style="height:250px"> 85 <a href="${pageContext.request.contextPath }/productInfo?pid=${product.pid}"> <img src="${pageContext.request.contextPath }/${product.pimage }" 86 width="170" height="170" style="display: inline-block;"> 87 </a> 88 <p> 89 <a href="${pageContext.request.contextPath }/productInfo?pid=${product.pid}" style='color: green'>${product.pname }</a> 90 </p> 91 <p> 92 <font color="#FF0000">商城价:¥${product.shop_price }</font> 93 </p> 94 </div> 95 </c:forEach> --%> 96 97 <!-- <div class="col-md-2"> 98 <a href="product_info.htm"> <img src="products/1/cs10001.jpg" 99 width="170" height="170" style="display: inline-block;"> 100 </a> 101 <p> 102 <a href="product_info.html" style='color: green'>冬瓜</a> 103 </p> 104 <p> 105 <font color="#FF0000">商城价:¥299.00</font> 106 </p> 107 </div> --> 108 109 </div> 110 111 <!--分页 --> 112 113 <div style=" 380px; margin: 0 auto; margin-top: 50px;"> 114 <ul class="pagination" style="text-align: center; margin-top: 10px;"> 115 <!-- 首页,判断当前页是不是首页,是就不显示首页 --> 116 <%-- <c:if test="${productPage.currentPage == 1 }"> 117 <li><a href="javascript:void(0);" aria-label="Previous"><span 118 aria-hidden="true">首页</span></a></li> 119 </c:if> --%> 120 <c:if test="${productPage.currentPage != 1 }"> 121 <li><a href="${pageContext.request.contextPath }/productList?currentPage=1&pageSize=${productPage.pageSize}" aria-label="Previous"><span 122 aria-hidden="true">首页</span></a></li> 123 </c:if> 124 125 <!-- 上一页,判断当前页是不是首页,是就不显示上一页 --> 126 <%-- <c:if test="${productPage.currentPage == 1 }"> 127 <li><a href="javascript:void(0);" aria-label="Previous"><span 128 aria-hidden="true">上一页</span></a></li> 129 </c:if> --%> 130 <c:if test="${productPage.currentPage != 1 }"> 131 <li><a href="${pageContext.request.contextPath }/productList?currentPage=${productPage.currentPage - 1 }&pageSize=${productPage.pageSize}" aria-label="Previous"><span 132 aria-hidden="true">上一页</span></a></li> 133 </c:if> 134 135 136 <c:forEach begin="${productPage.startLink }" end="${productPage.endLink }" var="i" step="1"> 137 <!-- 判断是否是当前页,是则选中 --> 138 <c:if test="${ productPage.currentPage == i }"> 139 <li class="active"><a href="${pageContext.request.contextPath }/productList?currentPage=${i}&pageSize=${productPage.pageSize}">${i }</a></li> 140 </c:if> 141 <c:if test="${ productPage.currentPage != i }"> 142 <li><a href="${pageContext.request.contextPath }/productList?currentPage=${i}&pageSize=${productPage.pageSize}">${i }</a></li> 143 </c:if> 144 </c:forEach> 145 146 <%-- <c:forEach begin="1" end="${productPage.totalPage }" var="i" step="1"> 147 <!-- 判断是否是当前页,是则选中 --> 148 <c:if test="${ productPage.currentPage == i }"> 149 <li class="active"><a href="${pageContext.request.contextPath }/productList?currentPage=${i}&pageSize=${productPage.pageSize}">${i }</a></li> 150 </c:if> 151 <c:if test="${ productPage.currentPage != i }"> 152 <li><a href="${pageContext.request.contextPath }/productList?currentPage=${i}&pageSize=${productPage.pageSize}">${i }</a></li> 153 </c:if> 154 </c:forEach> --%> 155 156 <!-- 下一页,判断当前页是不是末页,是末页就不显示下一页 --> 157 <%-- <c:if test="${productPage.currentPage == productPage.totalPage }"> 158 <li><a href="javascript:void(0);" aria-label="Next"> <span aria-hidden="true">下一页</span> 159 </c:if> --%> 160 <c:if test="${productPage.currentPage != productPage.totalPage }"> 161 <li><a href="${pageContext.request.contextPath }/productList?currentPage=${productPage.currentPage + 1 }&pageSize=${productPage.pageSize}" aria-label="Next"><span 162 aria-hidden="true">下一页</span></a></li> 163 </c:if> 164 165 <!-- 末页,判断当前页是不是末页,是最后一页就不显示末页 --> 166 <%-- <c:if test="${productPage.currentPage == productPage.totalPage }"> 167 <li><a href="javascript:void(0);" aria-label="Next"><span 168 aria-hidden="true">末页</span></a></li> 169 </c:if> --%> 170 <c:if test="${productPage.currentPage != productPage.totalPage }"> 171 <li><a href="${pageContext.request.contextPath }/productList?currentPage=${productPage.totalPage }&pageSize=${productPage.pageSize}" aria-label="Next"><span 172 aria-hidden="true">末页</span></a></li> 173 </c:if> 174 </ul> 175 <div> 176 每页条数<select id="pageSizeElem" onchange="changePageSize(this)"> 177 <option value="2">2</option> 178 <option value="5">5</option> 179 <option value="10">10</option> 180 <option value="20">20</option> 181 </select> 182 <!-- 怎么检查参数呢 --> 183 跳转<input id="targetPage" type="text" name="currentPage" form="pageForm"><br/> 184 共${productPage.totalPage }页 185 共${productPage.totalCount }条 186 <form id="pageForm" action="${pageContext.request.contextPath }/productList" method="post"> 187 <input type="hidden" name="pageSize" value="${productPage.pageSize }"> 188 </form> 189 </div> 190 </div> 191 192 193 <!-- <div style=" 380px; margin: 0 auto; margin-top: 50px;"> 194 <ul class="pagination" style="text-align: center; margin-top: 10px;"> 195 <li class="disabled"><a href="#" aria-label="Previous"><span 196 aria-hidden="true">«</span></a></li> 197 <li class="active"><a href="#">1</a></li> 198 <li><a href="#">2</a></li> 199 <li><a href="#">3</a></li> 200 <li><a href="#">4</a></li> 201 <li><a href="#">5</a></li> 202 <li><a href="#">6</a></li> 203 <li><a href="#">7</a></li> 204 <li><a href="#">8</a></li> 205 <li><a href="#">9</a></li> 206 <li><a href="#" aria-label="Next"> <span aria-hidden="true">»</span> 207 </a></li> 208 </ul> 209 </div> --> 210 <!-- 分页结束 --> 211 212 <!--商品浏览记录--> 213 <div 214 style=" 1210px; margin: 0 auto; padding: 0 9px; border: 1px solid #ddd; border-top: 2px solid #999; height: 246px;"> 215 216 <h4 style=" 50%; float: left; font: 14px/30px 微软雅黑">浏览记录</h4> 217 <div style=" 50%; float: right; text-align: right;"> 218 <a href="">more</a> 219 </div> 220 <div style="clear: both;"></div> 221 222 <div style="overflow: hidden;"> 223 224 <ul style="list-style: none;"> 225 <li 226 style=" 150px; height: 216; float: left; margin: 0 8px 0 0; padding: 0 18px 15px; text-align: center;"><img 227 src="products/1/cs10001.jpg" width="130px" height="130px" /></li> 228 </ul> 229 230 </div> 231 </div> 232 233 234 <!-- 引入footer.jsp --> 235 <jsp:include page="/footer.jsp"></jsp:include> 236 237 </body> 238 239 </html>