이미 개발이 끝난 다음에 view를 바꾼다는건..ㅜㅡㅜ 이래서 mvc패턴을 써야 하나보다
다른 분들은 첨부터 쓰면서 하시길..ㅜㅡㅜ
가장 크게 보면은 테이블 안에 테이블을 넣어서 안에 있는 테이블을 고정시키는 방법이다.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<style type="text/css">
#tablefixed {table-layout:fixed;}
</style>
<table border="0" cellspacing="0" cellpadding="0" width="300" id="tablefixed">
<tr valign="top">
<td >
<table border="1" style="margin-right:-1;">
<tr >
<td >고정셀1</td>
<td >고정셀2</td>
<td >고정셀3</td>
<td >고정셀4</td>
</tr>
</table>
</td>
<td >
<div style="width:200;overflow-x:auto;">
<table border="1">
<tr >
<%
int i=0;
for(i = 0; i<100; i++){
%>
<td>셀<%=i %></td>
<%}
%>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td><br></td>
</tr>
<tr>
<td>
<table border="1" style="margin-right:-1;">
<tr >
<td>고정셀1</td>
</tr>
<tr >
<td>고정셀2</td>
</tr>
<tr >
<td>고정셀3</td>
</tr>
<tr >
<td>고정셀4</td>
</tr>
</table>
<div style="height:200px;overflow-y:auto;">
<table border="1">
<%
i=0;
for(i = 0; i<100; i++){
%>
<tr><td>셀<%=i %></td></tr>
<%}
%>
</table>
</div>
</tr>
</table>
</body>
</html>
가장 크게 보면은 테이블 안에 테이블을 넣어서 안에 있는 테이블을 고정시키는 방법이다.
css로 가장 큰 테이블을 pix시킨다.
안에는 각각의 테이블의 크기를 지정해주면되는것. 당연히 틀고정은 크기에 맞게 되는것이고 움직이는 테이블은
자신이 가지고 있는 셀보다 크기를 작게해서 스크롤바만 생기게 하면 되는거.
x,y축은 단지 <tr> or <td> 차이일 뿐이다.
'web > HTML' 카테고리의 다른 글
HTML5 LocalStorage 웹클라이언트에서 데이터 저장은 LocalStorage사용! (0) | 2012.06.05 |
---|---|
동적 테이블 td 색상 칠하기(배경색) (0) | 2011.08.30 |
html5 크롬 / 사파리 video 띄우기. (0) | 2011.06.30 |
Double Margin Float Bug (IE6~7) (0) | 2011.04.17 |
HTML tab key 순서 정하기 (0) | 2011.03.09 |