YesYo.com MintState Forums
뒤로    YesYo.com MintState BBS > Tech > Javascript
검색
멤버이름    오토
비밀번호 
 

하단고정레이아웃

페이지 정보

작성자 MintState 댓글 0건 조회 7,415회 작성일 16-07-01 14:30

본문

하단고정레이아웃

CSS 이용하여 하단고정레이아웃을 만들어 보자.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head>
<title>하단고정레이아웃</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
html { overflow: hidden; }
html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
#wrapper{ width: 100%; height: 100%; position: absolute; overflow-y:scroll; }
#content { width: 100%; padding-bottom:50px; }
#footer 
{ 
 background-color:#eeeeee;
 overflow: hidden;
 position: absolute;
 bottom: 0; 
 height: 50px; width:100%; text-align: center;
 margin-left:0px; margin-bottom:-1px;
}
</style>
</head>
<body>
<div id="wrapper">
 <div id="content">
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용... <BR>
  본문내용END<BR>
 </div>
</div>
<div id="footer">
 풋터내용
</div>
    
</body>
</html>
첨부 파일
파일 종류: html 하단고정레이아웃.html (4.5K, 55 views)

댓글목록

등록된 댓글이 없습니다.

Total 178건 1 페이지
Javascript 목록
번호 제목 글쓴이 조회 날짜
178 MintState 4165 03-22
177 MintState 4447 04-19
176 MintState 5742 07-24
175 MintState 6914 10-27
열람중 MintState 7416 07-01
173 MintState 7473 09-26
172 MintState 7665 11-02
171 MintState 7924 03-08
170 MintState 8697 03-05
169 MintState 8988 10-31
168 MintState 9165 10-31
167 MintState 9200 11-14
166 MintState 9232 11-17
165 MintState 9346 11-17
164 MintState 9589 11-17
163 MintState 9611 11-19
162 MintState 9719 11-17
161 MintState 9757 11-17
160 MintState 9804 11-17
159 MintState 9842 11-10
게시물 검색
모바일 버전으로 보기
CopyRight ©2004 - 2024, YesYo.com MintState. ™