뒤끝 (Back-End)

[JSP] 하이퍼 링크 & 테이블 태그

z_zen 2024. 10. 14. 00:35
728x90

하이퍼 링크 기본

<a href=“경로” target=“_blank”> 설정할 텍스트 </a>
// 특정 사이트의 URL 주소를 선언할 때 target=“_blank” 속성을 선언하게 되면 새로운 웹 브라우저 창(탭)을 열어 실행 결과를 보여줌

 

이미지에 하이퍼 링크 설정

<a href="연결 링크" target="_blank">
<img src="이미지이름.jpg">
</a>

테이블 태그 : 데이터를 행과 열의 형태를 갖춰 테이블로 구성함

th (table head) : 볼드체, 가운데 정렬

td (table data) : 기본체, 왼쪽 정렬

<table border="1">
	<tr>
		<th> 제목 </th> <th> 굵은 글씨 </th>
	</tr>
	<tr>
		<td> 내용 </td> <td> 기본 글씨 </td>
	</tr>
</table>

<table bgcolor=“색상이름” border=n width=n/n% height=n/n%>…</table>
<td bgcolor=“” width=n/n% height=n/n% align=“” valign=“”>…</td>
// align(수평 정렬) : left, center, right
// valign(수직 정렬) : top, middle, bottom
<table border="5" width="50%" bgcolor="gray">
	<tr>
		<th width="50%"> 제목 </th> <th> 굵은 글씨 </th>
	</tr>
	<tr>
		<td height="100" align="center" valign="top"> 내용 </td> <td align="right" valign="bottom"> 기본 글씨 </td>
	</tr>
</table>


셀 합치기

<table border="1" width="300" height="100">
	<tr align="center">
		<td> 1 </td> <td> 2 </td>
	</tr>
	<tr align="center">
		<td> 3 </td> <td> 4 </td>
	</tr>
</table>

<table border="1" width="300" height="100">
	<tr align="center">
		<td colspan=2 bgcolor=gray> 1 </td>
	</tr>
	<tr align="center">
		<td> 3 </td> <td> 4 </td>
	</tr>
</table>

<table border="1" width="300" height="100">
	<tr align="center">
		<td rowspan=2 bgcolor=gray> 1 </td> <td> 2 </td>
	</tr>
	<tr align="center">
		<td> 4 </td>
	</tr>
</table>

728x90