JSP頁面設計是非常重要的，而如何在頁面上美觀地展示圖片是其中不可忽視的一部分。
<%@page contentType="text/html;charset=utf-8" language="java"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<title>JSP頁面展示圖片</title>
<style>
.img-block {
display: block;
width: 300px;
height: 200px;
margin: 10px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
border: 1px solid #ccc;
}
</style>
</head>
<body>
<div>
<c:forEach items="${imgs}" var="img">
<div class="img-block" style="background-image: url('${pageContext.request.contextPath}/${img}')"></div>
</c:forEach>
</div>
</body>
</html>以上是一個簡單的JSP頁面樣例，其中使用了CSS對圖片進行樣式修飾，使圖片排版更美觀。可以通過${imgs}取得圖片路徑，利用JSTL的forEach循環加上樣式呈現到頁面中。
上一篇jsp css居中
下一篇js+css3雪花效果