본문 바로가기
웹 프로그래밍/HTML

[HTML] 링크 기능이 있는 게시판 만들어보기(table, a 태그)

산을넘는다 2020. 6. 12. 09:27

 

게시판 목록

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1 align = "center">게시판 목록</h1>
	<hr> <!--> 선 그리는 태그 <-->
	<table border = "1" style = "width : 100%">
		
		<thead>
			<tr>
				<th style="width: 10%">번호</th>
				<th style="width: 60%">제목</th>
				<th style="width: 10%">글쓴이</th>
				<th style="width: 20%">등록일</th>
			</tr>
		</thead>
		<tbody align = "center">
			<tr>
				<td>46</td>
				<td align = "left"><a href ="http://localhost:9999/Lecture-WEB/html/detailBoard.html">동적인 글</a></td>
				<td>테스터</td>
				<td>2012-11-07</td>
			</tr>
			<tr>
				<td>45</td>
				<td align = "left"><a href ="http://localhost:9999/Lecture-WEB/html/detailBoard.html">자바제목</a></td>
				<td>JDBC</td>
				<td>2012-11-07</td>
			</tr>
			<tr>
				<td>44</td>
				<td align = "left"><a href ="http://localhost:9999/Lecture-WEB/html/detailBoard.html">자바제목</a></td>
				<td>JDBC</td>
				<td>2012-11-07</td>
			</tr>
			<tr>
				<td>43</td>
				<td align = "left"><a href ="http://localhost:9999/Lecture-WEB/html/detailBoard.html">자바제목</a></td>
				<td>JDBC</td>
				<td>2012-11-07</td>
			</tr>
		</tbody>

	</table>
</body>
</html>

 

게시글 상세

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1 align = "center">게시물 상세</h1>
	<hr>
	<table border="1" style="width: 100%">
	
		<col style ="font-weight: bold">


		<tbody>
			<tr>
				<td style="width: 10%" align ="right"><b>번호</b></td>
				<td>46</td>
			</tr>
			<tr>
				<td align ="right"><b>제목</b></td>
				<td>동적인 글</td>
			</tr>
			<tr>
				<td align ="right"><b>글쓴이</b></td>
				<td>테스터</td>
			</tr>
			<tr>
				<td align ="right"><b>내용</b></td>
				<td>잘되겠지</td>
			</tr>
			<tr>
				<td align ="right"><b>등록일시</b></td>
				<td>2012-11-07</td>
			</tr>

		</tbody>
	</table>
	<div align = "center"><a href = "http://localhost:9999/Lecture-WEB/html/listBoard.html">목록</a></div>
	
</body>
</html>

'웹 프로그래밍 > HTML' 카테고리의 다른 글

[HTML] form 태그 실습  (0) 2020.06.12
[HTML] 클라이언트의 정보를 서버로 보내기 (form 태그, input 태그)  (0) 2020.06.12
[HTML] 계산기 모양 구현하기 <input type = "button"/>  (0) 2020.06.12
[HTML] 한 번에 여러 줄의 코드를 수정하기 (alt + shift + a)  (0) 2020.06.11
[HTML] 테이블 만들기 & 테이블 합치기 <table> 태그  (0) 2020.06.11

'웹 프로그래밍/HTML' Related Articles

티스토리툴바