제홈페이지에 게시판을 삽입해보니.
일단 노프레임 방식입니다.
홈페이지에 게시판을 삽입해보니
게시판이 늘어남에 따라 테이블 마저 늘어버리고 전체적인 디자인이 흐트러지더라구요.
이럴때는 어떻게 해야하나요?
코딩을 다시 해야하나요?ㅠ
http://leinhosa.com 홈페이지 입니다.. 휴 어떻게해야할지 알려주세요..
상하 보폭이 커지면 커질수록 테이블 전체가 흐트러 집니다...
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
댓글 15개
align="top"
ex)
<table>
<tr>
<td align="top"><table><tr><td>왼쪽메뉴</td></tr></table></td>
<td align="top"><table><tr><td>게시판</td></tr></table></td>
</tr>
</table>
<html>
<head>
<title>profile</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('http://leinhosa.com/images/roll_4.jpg','http://leinhosa.com/images/roll_5.jpg','http://leinhosa.com/images/roll_6.jpg')">
<!-- ImageReady Slices (profile.psd - Slices: 01, 04, 06, 07, 08, 09, 10, 12, 15, 18, 21, 23, 26, 29, 31, 33, 35) -->
<table width="100%" height="100%" border="0">
<tr>
<th align="center" valign="middle" scope="col"><table id="Table_01" width="850" height="696" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="26"> <img src="http://leinhosa.com/images/talk_01.jpg" width="141" height="696" alt=""></td>
<td width="708" height="19" colspan="10"> </td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="19" alt=""></td>
</tr>
<tr>
<td width="5" height="677" rowspan="25"> <img src="http://leinhosa.com/images/spacer.gif" width="5" height="677" alt=""></td>
<td colspan="5" rowspan="2"> <a href="http://leinhosa.com/index.html"><img src="http://leinhosa.com/images/talk_04.jpg" alt="" width="217" height="74" border="0"></a></td>
<td width="5" height="677" rowspan="25"> <img src="http://leinhosa.com/images/spacer.gif" width="5" height="677" alt=""></td>
<td width="10" height="637" rowspan="22" bgcolor="16b711"> </td>
<td> <img src="http://leinhosa.com/images/talk_07.jpg" width="461" height="10" alt=""></td>
<td width="10" height="637" rowspan="22" bgcolor="16b711"> </td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td rowspan="4"> <img src="http://leinhosa.com/images/talk_09.jpg" width="461" height="112" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="64" alt=""></td>
</tr>
<tr>
<td colspan="5"> <a href="http://leinhosa.com/profile.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image58','','http://leinhosa.com/images/roll_4.jpg',1)"><img src="http://leinhosa.com/images/roll_1.jpg" name="Image58" width="217" height="31" border="0"></a></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="31" alt=""></td>
</tr>
<tr>
<td width="217" height="1" colspan="5"> <img src="http://leinhosa.com/images/spacer.gif" width="217" height="1" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="5" rowspan="2"> <a href="http://leinhosa.com/portfolio.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image59','','http://leinhosa.com/images/roll_5.jpg',1)"><img src="http://leinhosa.com/images/roll_2.jpg" name="Image59" width="217" height="31" border="0"></a></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td width="461" height="505" rowspan="16"> <div align="center"></div></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="15" alt=""></td>
</tr>
<tr>
<td width="217" height="1" colspan="5"> <img src="http://leinhosa.com/images/spacer.gif" width="217" height="1" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="5"> <a href="http://leinhosa.com/talk.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image60','','http://leinhosa.com/images/roll_6.jpg',1)"><img src="http://leinhosa.com/images/roll_3.jpg" name="Image60" width="217" height="31" border="0"></a></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="31" alt=""></td>
</tr>
<tr>
<td width="217" height="10" colspan="5"> <img src="http://leinhosa.com/images/spacer.gif" width="217" height="10" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td width="15" height="274" rowspan="8"> <img src="http://leinhosa.com/images/spacer.gif" width="15" height="274" alt=""></td>
<td colspan="3"> <img src="http://leinhosa.com/images/talk_18.jpg" width="188" height="21" alt=""></td>
<td width="14" height="274" rowspan="8"> <img src="http://leinhosa.com/images/spacer.gif" width="14" height="274" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td width="188" height="2" colspan="3"> <img src="http://leinhosa.com/images/spacer.gif" width="188" height="2" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td colspan="3"> <img src="http://leinhosa.com/images/talk_21.jpg" width="188" height="21" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td width="188" height="2" colspan="3"> <img src="http://leinhosa.com/images/spacer.gif" width="188" height="2" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="2" alt=""></td>
</tr>
<tr>
<td colspan="3"> <img src="http://leinhosa.com/images/talk_23.jpg" width="188" height="21" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td width="188" height="7" colspan="3"> <img src="http://leinhosa.com/images/spacer.gif" width="188" height="7" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="7" alt=""></td>
</tr>
<tr>
<td width="18" height="200" rowspan="2"> <img src="http://leinhosa.com/images/spacer.gif" width="18" height="200" alt=""></td>
<td> <img src="http://leinhosa.com/images/talk_26.jpg" width="153" height="192" alt=""></td>
<td width="17" height="200" rowspan="2"> <img src="http://leinhosa.com/images/spacer.gif" width="17" height="200" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="192" alt=""></td>
</tr>
<tr>
<td width="153" height="8"> <img src="http://leinhosa.com/images/spacer.gif" width="153" height="8" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="8" alt=""></td>
</tr>
<tr>
<td colspan="5"> <img src="http://leinhosa.com/images/talk_29.jpg" width="217" height="21" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td width="217" height="1" colspan="5"> <img src="http://leinhosa.com/images/spacer.gif" width="217" height="1" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="5"> <img src="http://leinhosa.com/images/talk_31.jpg" width="217" height="127" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="127" alt=""></td>
</tr>
<tr>
<td width="217" height="75" colspan="5" rowspan="5"> </td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="25" alt=""></td>
</tr>
<tr>
<td> <img src="http://leinhosa.com/images/talk_33.jpg" width="461" height="10" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td width="481" height="1" colspan="3"> <img src="http://leinhosa.com/images/spacer.gif" width="481" height="1" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="3"> <img src="http://leinhosa.com/images/talk_35.jpg" width="481" height="20" alt=""></td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="20" alt=""></td>
</tr>
<tr>
<td width="481" height="19" colspan="3"> </td>
<td> <img src="http://leinhosa.com/images/spacer.gif" width="1" height="19" alt=""></td>
</tr>
</table></th>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
게시판 내용이 많으면 테이블이 늘어나는 걸 감안하시고 하셨어야 했는데...
두가지가 있겠죠..
일반 홈페이지처럼, 게시판 내용이 길어지면 테이블이 밑으로 길어지는 경우,
싸이 미니홈피처럼, 디자인이 고정되어있고, 게시판 내용이 길어지면 스크롤바가 생기도록 하는 방법이요..
아이프레임 같은걸 넣은다고해도, 중요한건 최근게시물을 클릭하면 게시판만 들어가질텐데요..
지금은 들어가지도 않습니다. 챙피해서 누구 보여주지도 않는건데.. 한번 들어가서 보세요..
싸이미니같이 만든답시고 만든겁니다. 음악을 모든 페이지에 나오게하기위해 아이프레임을 썼습니다....
www.szam.net 으로 들어가신후 맨우측 꼭대기에 MINI 라는 아이콘을 눌러보세요...
들어가보시고 답변주세요.. 원래 비공개인데 잠시 공개로 바꿔놓았습니다. 답변주시면 바로 원래대로 비공개로 할꺼거든요^^;;
흠 이런 형식이라면 아이프레임을 써먹을수있지만,
제 홈페이지 같은경우에는 어떤 메뉴는 노프레임이고 어떤메뉴는 아이프레임을 써먹어야할때가 있습니다. 그런데 노프레임이 최근게시물을 올리고 메뉴에 아이프레임을 적용시킨다면 노프레임페이지에서 최근게시물을 클릭하면 게시물만 뜬다 이거죠..
리플 감사합니다..ㅠ
최근게시물스킨의 게시물 링크부분, (a 태그가 있겠죠..) 그 부분에 타겟을 아이프레임의 아이디로 주었습니다...
그럼, 저의 허접한 미니홈피는 다시 비공개로 돌리겠습니다..ㅠㅠ;;
스크롤바 디자인 바꾸는건 네이버 지식인 같은데 찾아보면 많이 나올겁니다..
그냥 스크롤바는 디자인이 영~ 별로라서 색을 어울리도록 바꿔주면 좋겠죠...
http://www.morssola.com/test.html
해당 페이지에서 소스보기 하시면 코드는 보실 수 있습니다.
어떻게 코딩하셨고 어떤 방식으로 수정하셨는지 정말 궁금하는군요...;;
한수 배우고싶은데 ㅠㅠ 어떻게 안됩니까?
정말 감사하다는 말박에..
드림위버나 나모로 제작해도 되지만, 저의 경우 구조를 판단 후 메모장으로 직접 다다닥 칩니다.
고전적인 방법이긴 하나, 나름대로 매력 있습니다. ^^;;
테이블 태그, 혹은 테이블에 대해서 검색. 혹은 에디터 프로그램으로 테이블을 나누면서 코드를 보세요~
저도 공부를 많이 해야 겠더군요.
코딩소스를 알기쉽게 나열한 자료라도 있으세요? 혼자 분석해서
배우고 싶은 마음이 있는데.. 앗참 에디터 프로그램 뭐쓰세요?
p.s 정말 감사합니다.. 정말.. 답변 채택시켜드리지 못한게 아쉽군요.
저에게 있어서는 당신은 정말 구원의 손길이군요.. 역시
노력하면 구원의 손길이 나타난다는 말이 사실이었군요..