\u003c?xml version="1.0" encoding="UTF-8"?\u003e \u003c!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"\u003e \u003chtml xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"\u003e \u003chead\u003e \u003ctitle\u003e用户查询界面\u003c/title\u003e \u003clink rel="stylesheet" type="text/css" href="styles.css" /\u003e \u003c/head\u003e \u003cbody\u003e \u003cdiv class="centered"\u003e \u003ca href="insert.jsp"\u003e新增\u003c/a\u003e \u003c/div\u003e \u003cc:if test="${not empty students}"\u003e \u003ctable border="1" width="450px" height="70px" align="center" style="text-align:center"\u003e \u003ctr\u003e \u003ctd\u003e用户编号:\u003c/td\u003e \u003ctd\u003e用户姓名:\u003c/td\u003e \u003ctd\u003e用户密码:\u003c/td\u003e \u003ctd\u003e用户性别:\u003c/td\u003e \u003ctd\u003e用户年龄:\u003c/td\u003e \u003ctd\u003e操作:\u003c/td\u003e \u003c/tr\u003e \u003cc:forEach items="${students}" var="student"\u003e \u003ctr\u003e \u003ctd\u003e${student.id}\u003c/td\u003e \u003ctd\u003e${student.name}\u003c/td\u003e \u003ctd\u003e${student.password}\u003c/td\u003e \u003ctd\u003e${student.sex}\u003c/td\u003e \u003ctd\u003e${student.age}\u003c/td\u003e \u003ctd\u003e \u003ca href="user.delete?id=${student.id}"\u003e删除\u003c/a\u003e \u003ca href="user.updateGive?id=${student.id}"\u003e修改\u003c/a\u003e \u003c/td\u003e \u003c/tr\u003e \u003c/c:forEach\u003e \u003c/table\u003e \u003cc:else\u003e \u003cp class="centered"\u003e暂无数据\u003c/p\u003e \u003c/c:if\u003e \u003c/body\u003e \u003c/html\u003e

/* styles.css */ table { border-collapse: collapse; width: 450px; margin: auto; }

th, td { border: 1px solid black; padding: 8px; text-align: center; }

th { background-color: #f2f2f2; }

tr:nth-child(even) { background-color: #f2f2f2; }

.centered { text-align: center; margin-bottom: 10px; }

通过以上优化,可以让页面更具有可读性、可维护性和精致度。

JSP页面优化技巧:提升可读性和精致度

原文地址: https://www.cveoy.top/t/topic/p7wf 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录