묻고답하기
XHTML 기준으로 레이아웃 잡는거 질문좀 드릴께요~
2009.02.19 20:02
웹표준에 의거해서 홈페이지 만들려고 하는데요..
여태껏 테이블로만 레이아웃을 잡아오던 저로선 잘 적응이 안되네요...
DIV 이용해서 틀을 잡고 있는데요.
아래 와 같은 레이아웃을 잡으려고 하거든요..
#header는 대충 잡았는데 #middle 부분을 어떻게 해야하나요...
그리고 아래 소스에서 스타일시트부분에서 가독성을 더 높이는 방법 있으면 좀 알려주세요~
예를 들어 상위 레이어하고 하위 레이어 스타일을 따로 묶는다던지..
이런방법 있으면 알려주세요.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="메인" />
<title>테스트</title>
<style type="text/css">
body {
color:white;
background:#666666;
margin:0;
text-align:center;
}
#bodyWrap {
padding:0;
margin:0 auto;
width:981px;
height:auto;
}
#header {
padding:0;
width:100%;
height:auto;
}
#logo {
padding:0;
width:100%;
height:190px;
background:url(home_image/toplogo.jpg) no-repeat;
}
#bar_bg {
background:#333333;
padding:0;
width:100%;
height:22px;
}
#bar_bg .bar_bg2 {
margin:0 auto;
width:977px;
height:100%;
border:solid white;
border-width:0 1px;
background:url(home_image/top_bg.gif) repeat-x;
}
#middle {
background:#F5F5F5;
width:979px;
height:500px;
border:solid #333333;
border-width:0 1px 1px 1px;
}
</style>
</head>
<body>
<!--전체 틀(bodyWrap)-->
<div id="bodyWrap">
<!-- 상단 -->
<div id="header">
<!-- 로고 -->
<div id="logo">
</div>
<!-- 로고 밑 바 이미지-->
<div id="bar_bg">
<div class="bar_bg2">
</div>
</div>
</div>
<!-- 상단 끝 -->
<!-- 컨텐츠 & 메뉴 -->
<div id="middle">
</div>
<!-- 컨텐츠 & 메뉴 끝 -->
</div>
</body>
</html>
댓글 2
글쓴이 | 제목 | 최종 글 |
---|---|---|
XE | 공지 글 쓰기,삭제 운영방식 변경 공지 [16] | 2019.03.05 by 남기남 |
고건영898 |
zbxe 최근문서, 이렇게 추출할 수 있을까요?
[2]
![]() | 2007.12.11 by 고건영898 |
푸른솔아 | 프로필사진이 나오게 하려면 어떻게 하는지요 [1] | 2007.12.11 by 이하늘936 |
질문 | 업데이트는 어떻게 하나요? [1] | 2007.12.11 by 이하늘936 |
덴마쿠3 | 0.2.3에서 0.2.7로 업데이트 시 모듈업데이트 부분 궁금합니다 [3] | 2007.12.11 by 이하늘936 |
MC 바리반디 | 이 게시물을... [1] | 2007.12.11 by 백성찬 |
박양식 | 요청하신 모듈을 찾을 수 없습니다. 설치화면 반복현상 | |
아름이 | 최근이미지가 도저히 안 나오네요. [3] | 2007.12.11 by 마알지기 |
765 | 페이지 수정시의 문제점 | |
부우우 | 최근게시물 [2] | 2007.12.11 by 부우우 |
이창훈785 | 웹브라우져 종류가 어떤것이 있나요? [2] | 2007.12.11 by 이창훈785 |
이용일802 | 질문입니다.. | |
RainSky |
페이지 수정 그림 클릭이 안되네요. ^^
[4]
![]() | 2007.12.12 by RainSky |
쎌 | 혹시 XE에 게시판 내에서 레벨에 따라 게시물을 보여주고 안 보여 줄 수 있는 기능이 있나요? | |
진한모카향기 | 제홈페이지좀 봐주세요 [1] | 2007.12.12 by 쎌 |
이하늘936 | 제로보드 메인페이지에 달그림 관련어떻게 넣어여..? [2] | 2007.12.12 by 555 |
지갱 | 페이지수정에서 최신글,댓글,이미지 추가가 안되요 | |
neifirst | 유령 카테고리? | |
winni80 | 작고 예쁜 숫자 쓰기. [1] | 2007.12.12 by ganji |
pug |
게시물의 한글 텍스트가 갑자기 보이지 않습니다...
![]() | |
비밀얌 | 권한이 없습니다 페이지 관련 [2] | 2007.12.12 by 비밀얌 |
이건 제가 직접만든 웹표준 레이아웃 샘플들이니 한번 보시고 참고해보세요. ( 링크1 참고 )
http://www.slamworld.co.kr/grboard/board.php?id=util
( 하단에 압축파일이 첨부되있으니 다운받아 쓰시고 공부용이나 참고용으로만 사용해주세요. )