잡다한 일상사 WebJoy.kr :: 테두리가 둥근 테이블 생성

테두리가 둥근 테이블 생성

WEB/HTML/Css/Script 2007/06/29 16:01 by 아쿠아바다

본문 예제 스크립트는 오류나네요.

제 블러그의 상단/좌/우측 흰색 박스 상자는 아래 스크립트로 생성되었습니다.
배경이 비치게 하는 부분은 투명한 아이프레임 만들기를 참조하세요

소스

<script>
function top_round(w,c) {
var top_html;
top_html="<table cellpadding=0 cellspacing=0 border=0 width="+w+">";
top_html+="<tr height=1><td rowspan=4 width=1></td><td rowspan=3 width=1></td>";
top_html+="<td rowspan=2 width=1></td><td width=2></td><td bgcolor="+c+"></td>";
top_html+="<td width=2></td><td rowspan=2 width=1></td><td rowspan=3 width=1></td>";
top_html+="<td rowspan=4 width=1></td></tr><tr height=1><td bgcolor="+c+"></td>";
top_html+="<td bgcolor="+c+"></td><td bgcolor="+c+"></td></tr>";
top_html+="<tr height=1><td bgcolor="+c+"></td><td colspan=3 bgcolor="+c+"></td>";
top_html+="<td bgcolor="+c+"></td></tr><tr height=2><td bgcolor="+c+"></td>";
top_html+="<td colspan=5 bgcolor="+c+"></td><td bgcolor="+c+"></td></tr></table>";
document.write(top_html);
}

function bottom_round(w,c) {
var bottom_html;
bottom_html="<table cellpadding=0 cellspacing=0 border=0 width="+w+">";
bottom_html+="<tr height=2><td rowspan=4 width=1></td><td width=1 bgcolor="+c+"></td><td width=1 bgcolor="+c+"></td>";
bottom_html+="<td width=2 bgcolor="+c+"></td><td bgcolor="+c+"></td><td width=2 bgcolor="+c+"></td>";
bottom_html+="<td width=1 bgcolor="+c+"></td><td width=1 bgcolor="+c+"></td><td rowspan=4 width=1></td></tr>";
bottom_html+="<tr height=1><td rowspan=3></td><td bgcolor="+c+"></td><td colspan=3 bgcolor="+c+"></td>";
bottom_html+="<td bgcolor="+c+"></td><td rowspan=3></td> </tr><tr height=1><td rowspan=2></td>";
bottom_html+="<td bgcolor="+c+"></td><td bgcolor="+c+"></td><td bgcolor="+c+"></td><td rowspan=2></td></tr>";
bottom_html+="<tr height=1><td></td><td bgcolor="+c+"></td><td></td></tr></table>";
document.write(bottom_html);
}
</script>

<script>top_round("500","#FFCC66");</script>
<table border=0 width=500 bgcolor=#FFCC66 cellpadding=0 cellspacing=0>
<tr><td align=center height=50><FONT SIZE="2" >테두리가 둥글둥글 하죠~</FONT></td></tr>
</table>
<script>bottom_round("500","#FFCC66");</script>

'WEB > HTML/Css/Script' 카테고리의 다른 글

단위 변환 프로그램 (0)	2007/07/22
나는 블로그/사이트의 실시간 접속자를 알고싶다. (0)	2007/06/30
테두리가 둥근 테이블 생성 (0)	2007/06/29
투명한 아이프레임 만들기 (0)	2007/06/29
빙글빙글 회전하는 링크(메뉴) (0)	2007/06/29
Infinite Menu 다이나믹 팝업 메뉴 (0)	2007/06/29