728x90
반응형
SMALL
📌 imageList.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<style>
.lst_type{overflow:hidden;width:80%;padding:0 10px 10px; margin:0 auto}
.lst_type li{overflow:hidden;clear:both;margin:10px 0 0;color:#2d2c2d;
font-family:'돋움',Dotum;font-size:12px;line-height:100px;
list-style:none ; border-bottom: 2px solid lightgray;position:relative; }
.lst_type li img{display:inline;float:left;position:absolute; }
.lst_type li a{color:#2d2c2d;text-decoration:none; margin-left:340px}
.lst_type li a:hover{text-decoration:underline}
.lst_type li span{color:blue; margin-left:330px;font-family:'돋움',Dotum;font-size:14px; }
</style>
<meta charset="UTF-8">
<title>이미지리스트창</title>
</head>
<body>
<ul class="lst_type">
<li>
<span style='margin-left:50px' >이미지 </span>
<span >이미지 이름</span>
<span >선택하기</span>
</li>
<%
for(int i=0 ; i<10; i++){
%>
<li>
<a href='#' style='margin-left:50px' >
<img src='image/duke.png' width='90' height='90' alt='' /></a>
<a href='#' ><strong>이미지 이름: 모니카<%=i %> </strong></a>
<a href='#' > <input name='chk<%=i %>' type='checkbox' /></a>
</li>
<%
}
%>
</ul>
</body>
</html>
📌 image폴더에 이미지 파일 넣어주기
📌 결과값
728x90
반응형
LIST
'Servlet & JSP > Servlet & JSP 공부' 카테고리의 다른 글
| [자바웹을다루는기술] 스크립트 요소 이용해 회원 정보 조회하기 (0) | 2022.02.17 |
|---|---|
| [자바웹을다루는기술] 내장 객체 기능 (0) | 2022.02.17 |
| [자바웹을다루는기술]JSP 스크립트 요소 (0) | 2022.02.17 |
| [자바웹을다루는기술]Filter API (0) | 2022.02.17 |
| [자바웹을다루는기술] 서블릿 속성과 스코프 (0) | 2022.02.17 |