一个纯Spring项目中在JSP页面上用JSTL标签实现10X10图片矩阵

疯飞 2010-03-01 11:57:12

<c:forEach items="${list}" var="list">
<tr>
<td><img src="http:<c:out value="${list.url}"/>/<c:out value="${list.name}"/>" height="100px" width="100px"/><br></td>
<td><c:out value="${photoType}"/></td>
<td><c:out value="${list.username}"/></td>
<td>暂无</td>
<td><a href="<c:url value="photo.man"><c:param name="method" value="deletePhoto" /><c:param name="url" value="${url}" /><c:param name="uid" value="${list.uid}" /><c:param name="name" value="${list.name}" /><c:param name="pageNo" value="${pageNo}" /><c:param name="type" value="${type}" /></c:url>">删除</a></td>
</tr>
</c:forEach>
</c:if>

<c:if test="${type ne '1'}">
<c:forEach items="${list}" var="list">
<tr>
<td><img src="http:<c:out value="${list.url}"/>/<c:out value="${list.name}"/>" height="100px" width="100px"/><br></td>
<td><c:out value="${photoType}"/></td>
<td><c:out value="${list.username}"/></td>
<td> <c:out value="${list.dateline}"/></td>
<td><a href="<c:url value="photo.man"><c:param name="method" value="deletePhoto" /><c:param name="url" value="${url}" /><c:param name="uid" value="${list.uid}" /><c:param name="name" value="${list.name}" /><c:param name="username" value="${username}" /><c:param name="pageNo" value="${pageNo}" /><c:param name="type" value="${type}" /></c:url>">删除</a></td>
</tr>
</c:forEach>

需要修改输出成一个10 X　10的图片矩阵显示，大家能给点意见吗谢谢了。

...全文

89 1 打赏收藏转发到动态举报

写回复

用AI写文章

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

火龙果被占用了 2010-03-02

打赏
举报

如果使用 UL LI 的话，只要放入 100 个就能显示出 10 行 10 列。

下面这个例子用 UL LI 排出 5 * 5 的图片。

<!DOCTYPE html 

     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

  <meta http-equiv="Content-Type" content="text/html; charset=gbk" />

  <title> new document </title>

</head>



<style type="text/css">

#photos { width:500px; margin:0; padding:0; }

#photos li { float:left; width:20%; list-style-type:none; margin:5px 0; }

#photos img { border:1px solid gray; width:80%; height:80%; }

</style>



</script>



<body>

<ul id="photos">

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

  <li><img src="https://mail.google.com/mail/help/images/logo2.gif"></li>

</ul>

</body>

</html>