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

하단고정레이아웃

페이지 정보

작성자 MintState 댓글 0건 조회 1,532회 작성일 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, 1 views)

댓글목록

등록된 댓글이 없습니다.

Total 176건 1 페이지
Javascript 목록
번호 제목 글쓴이 조회 날짜
176 MintState 16 04-19
175 MintState 343 11-02
174 MintState 321 10-27
173 MintState 397 09-26
172 MintState 929 03-08
171 MintState 1405 11-14
열람중 MintState 1533 07-01
169 MintState 2457 03-05
168 MintState 3482 11-19
167 MintState 8804 04-11
166 MintState 6856 04-06
165 MintState 7571 07-23
164 MintState 7375 06-09
163 MintState 9369 04-29
162 MintState 10490 04-29
161 MintState 7910 04-16
160 MintState 13848 02-17
159 MintState 14237 01-19
158 MintState 9979 10-27
157 MintState 8339 10-23
게시물 검색
모바일 버전으로 보기
CopyRight ©2004 - 2018, YesYo.com MintState. ™