홈페이지 - 사각 글상자 만들기 (table)

홈페이지(html)나 여기 티스토리 스킨을 수정시 table을 이용하여 사각 상자를 만들 수 있습니다.

 

table의 기본 구조는

<table>

<tr><td>쓸 내용</td></tr>

</table>

입니다.

 

<tr>은 세로 칸 <td>는 가로칸 입니다.

 

예전에는 홈페이지 구조를 전부 table로 만들었지만, 요즘은 그냥 간단히 꾸미는 용도로 많이 쓰이는 것 같습니다.

 

사각 글상자 만들기

 

<table border="1" width="400" bgcolor="#aaccee" align="center" height="100">
<tr><td align="middle">쓸 내용</td></tr>

</table>

 

쓸 내용 또는 그림

<-----   결과물   ----->

 

네모 안에 구글 애드센스 같은 광고를 넣을 수도 있고, 쓴 내용을 강조 하는 용도등으로 사용할수 있습니다.

저는 여기 티스토리 스킨에 자주 적용 하고 있습니다.

 

아래 처럼 좀더 복잡하게 여러 상자를 만들 수도 있지만, 쓰기에 불편합니다.

예로 3 X 2 네모는 아래와 같이 만들 수 있습니다.

 

<table>

<tr><td>내용 1</td><td>내용 2</td><td>내용3</td></tr>

<tr><td>내용 4</td><td>내용 5</td><td>내용6</td></tr>

</table>

내용 1	내용 2	내용3
내용 4	내용 5	내용 6

<----- 결과물 ----->