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

 
작성일 : 16-07-01 14:30
하단고정레이아웃
 글쓴이 : MintState
조회 : 1,206  
하단고정레이아웃

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)
Rated 0/5 (0%) (0 Votes)

(\__/)
(='.'=)
(")_(")~
Search Infomation by MintState
MintState

 
 

Total 175
번호 제   목 글쓴이 날짜 조회
175 자바스크립트 한글 금액 찍기 MintState 11-02 65
174 video.js videojs-panorama HTML5 비디오 플레이어 MintState 10-27 70
173 GIF 플레이어(제어) MintState 09-26 148
172 youtube ID 값 추출 MintState 03-08 604
171 Javascript - 비밀번호 유효성 검사(password validation) MintState 11-14 1074
170 하단고정레이아웃 MintState 07-01 1207
169 highcharts MintState 03-05 2166
168 jQuery Masonry 갤러리 리스트 효과 MintState 11-19 3214
167 파이어폭스, IE에 모두 적용되는 iframe 태그 MintState 04-11 8508
166 롤링 위 아래 버튼 적용 MintState 04-06 6447
165 Select 객체 추가 삭제 MintState 07-23 7283
164 숫자에 컴마(,) 쓰고 한글로 숫자 표시 MintState 06-09 6923
163 object 속성보기 MintState 04-29 9100
162 비밀번호 보안등급 체크 (2) MintState 04-29 10158
161 기본 공통 스크립트 MintState 04-16 7607
160 textarea에 줄바꿈 금지와 글자수 제한 MintState 02-17 13535
159 JSON 객체를 String으로 변환하기 MintState 01-19 13963
158 Tooltip 풍선 도움말 MintState 10-27 9676
157 다중 셀렉트 기본 방법 MintState 10-23 7964
156 자바스크립트를 이용한 암호화 MintState 09-01 9672
 1  2  3  4  5  6  7  8  9  
모바일 버전으로 보기
CopyRight ©2004 - 2017, YesYo.com MintState. ™