테이블에 스크롤박스 & 스크롤바 만들기




DIV를 사용하여 테이블에 스크롤박스 & 스크롤바 만드는 방법을 소개하고자 합니다. iframe을 사용하지 않고 테이블을 사용한 상태에서 스크롤바를 만드는것입니다.



소스 설명

　





아래 코드를 문서내 적당한 위치에 삽입 해 놓으시면 됩니다.





<style>
/* 스크롤박스 & 스크롤바 */
.TDscrollbar {
SCROLLBAR-FACE-COLOR: #ededed;
FONT-SIZE: 9pt;
SCROLLBAR-HIGHLIGHT-COLOR: #fafafa;
SCROLLBAR-SHADOW-COLOR: #bdbdbd; COLOR: black;
SCROLLBAR-3DLIGHT-COLOR: #ffffff;
SCROLLBAR-ARROW-COLOR: #89a0bc;
SCROLLBAR-TRACK-COLOR: #F7FFFF;
FONT-FAMILY: 굴림;
SCROLLBAR-DARKSHADOW-COLOR: #ffffff;
}
#scrollbox {width:480; height:120; overflow:auto; padding:10px; border:0; border-style:solid; border-color:black;}
</style>
</HEAD>


<table border=0 width=460 cellspacing=0 cellpadding=0 align=center>
<tr>
<td height=25 align=center>+ XGI 카페를 방문해 주셔서 감사합니다 +</td>
</tr>
<tr>
<td height=25>
<DIV id="scrollbox" class=TDscrollbar>

<p>XGI 툴로 멋진 기능성 홈페이지 제작을 위해&nbsp; 샘플
홈페이지 소스를 제공하고, 강좌를 통한 교육과 정보를
제공하고 있습니다.</p>

<p>막강한 기능을 제공하는 홈페이지 개발툴 XGI 와 내용만
채우면&nbsp;되는 완벽한 샘플&nbsp;홈페이지를 무료로
제공하고 있습니다.</p>

<p>통합 관리자모드 및 회원관리까지 지원되는
샘플홈페이지는 사용자 웹 인터페이스와 프로그램 <font color="red">소스까지
수정 가능하게 공개</font>가 되고&nbsp; 카페를 통해 사용자가
직접 바꾸며 배워가는 <font color="#006699">차별화된 서비스</font>
를 제공합니다.</p>

<p>소스변경에 대한 정보를 카페를 통해 해결할 수 있어
독립된 차별화된 나만의 홈페이지 제작을 지원합니다.</p>
</DIV>
</td>
</tr>
</table>