jsp中图片列表

最新推荐文章于 2021-02-26 23:15:02 发布

听音乐就好

最新推荐文章于 2021-02-26 23:15:02 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/gengkunpeng/article/details/6060028

本文介绍了一种使用HTML和JSP实现的图片展示列表布局方法，该方法通过循环遍历图片集合，并利用条件判断来实现每四张图片换行的布局效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

主要代码：

<table width='100%' border='0' cellspacing='0' cellpadding='5'> <tr align='center'> <c:forEach var="photo" items="${selAllList}" varStatus="status"> <c:choose> <c:when test="${status.count % 4 == 0}"> <td width='25%'> <table border=1 align=center cellpadding=3 cellspacing=1 bordercolor="#666666" bgcolor='#ffffff' class='bk1'> <tr> <td align="center"> <a href="photo?path=selOne&id=${photo.id}&str=aa" mce_href="photo?path=selOne&id=${photo.id}&str=aa" target='_blank'> <img src="uploadimg/${photo.path}" alt="${photo.shuoming }" width=150 height=113 border='0' align="middle" class='bk1'> </a> </td> </tr> </table> <br> <a href="photo?path=selOne&id=${photo.id}&str=aa" mce_href="photo?path=selOne&id=${photo.id}&str=aa">${photo.name}</a> | 点击：${photo.dianji} </td> <c:out value="</tr>" escapeXml="false" /> <c:out value="<tr align='center'>" escapeXml="false" /> </c:when> <c:otherwise> <td width='25%'> <table border=1 align=center cellpadding=3 cellspacing=1 bordercolor="#666666" bgcolor='#ffffff' class='bk1'> <tr> <td align="center"> <a href="photo?path=selOne&id=${photo.id}&str=aa" mce_href="photo?path=selOne&id=${photo.id}&str=aa" target='_blank'> <img src="uploadimg/${photo.path}" alt="${photo.shuoming }" width=150 height=113 border='0' align="middle"> </a> </td> </tr> </table> <br> <a href="photo?path=selOne&id=${photo.id}&str=aa" mce_href="photo?path=selOne&id=${photo.id}&str=aa">${photo.name}</a> | 点击：${photo.dianji} </td> </c:otherwise> </c:choose> </c:forEach> </tr> </table>

显示效果图：