JAVA를 JAVA라

[HTML] jsp의 리스트(list) 본문

HTML/맛보기

[HTML] jsp의 리스트(list)

샛별KIM 2021. 6. 15. 17:04

1. 테이블 형 리스트

list.jsp -> 마우스가 6번글에 올라가 있을 때

<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>자유게시판</title>
<style type="text/css">

#border{
	border-bottom: 1px solid black;
	/* 밑에 한 줄만 넣기 */
}

table{
	border-collapse: collapse; /* 두줄짜리 한줄로 만들기 */
	width: 500px;
}

table tr{
	height: 25px;
}

table tr:hover{ /*마우스가 tr에 올라갔을 때*/
	background-color: pink;
}

table tr td{
	border-bottom: 1px solid red
}

</style>
</head>
<body>
	<h1>리스트</h1>
	<table>
		<tr style="border-bottom: 1px black solid;">
			<th>번호</th>
			<th>제목</th>
			<th>글쓴이</th>
			<th>조회수</th>
			<th>날짜</th>
		</tr>
		
		<tr>
			<td id="border">10</td>
			<td id="border">10번 글입니다.</td>
			<td id="border">user</td>
			<td id="border">5</td>
			<td id="border">2021-05-07</td>
		</tr>
		<tr>
			<td>9</td>
			<td>9번 글입니다.</td>
			<td>user</td>
			<td>6</td>
			<td>2021-05-07</td>
		</tr>
		<tr>
			<td>8</td>
			<td>8번 글입니다.</td>
			<td>user</td>
			<td>5</td>
			<td>2021-05-07</td>
		</tr>
		<tr>
			<td>7</td>
			<td>7번 글입니다.</td>
			<td>user</td>
			<td>5</td>
			<td>2021-05-07</td>
		</tr>
		<tr>
			<td>6</td>
			<td>6번 글입니다.</td>
			<td>user</td>
			<td>5</td>
			<td>2021-05-07</td>
		</tr>
	</table>
</body>
</html>

2. 열거형 리스트

아래 태그 실행 시 보이는 리스트

<body>
	<h1>list</h1>
	<ul type="circle">
		<li>소나무</li>
		<li>대나무</li>
		<li>사철나무</li>
	</ul>
	
	<ol type="1" start="9" reversed="reversed">
		<li>퇴근하기</li>
		<li>장보기</li>
		<li>요리하기</li>
		<li>청소하기</li>
		<li>잠자기</li>
	</ol>
	
	<ul>
		혼합목록
		<ol>
			<li>1</li>
			<li>2</li>
			<li>3</li>
		</ol>
		<li>41</li>
		<li>42</li>
		<li>43</li>
		<li>44</li>
	</ul>
</body>

 

'HTML > 맛보기' 카테고리의 다른 글

[HTML] input type, select  (0) 2021.06.15
[HTML] jsp와 css  (0) 2021.06.15
[HTML] 표 만들기, table  (0) 2021.06.07
[HTML] 기타 태그  (0) 2021.06.07
[HTML] Atom 기본 예시  (0) 2021.06.01
'HTML/맛보기' Related Articles more
Comments