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

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

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 173
번호 제   목 글쓴이 날짜 조회
173 GIF 플레이어(제어) MintState 09-26 78
172 youtube ID 값 추출 MintState 03-08 512
171 Javascript - 비밀번호 유효성 검사(password validation) MintState 11-14 936
170 하단고정레이아웃 MintState 07-01 1065
169 highcharts MintState 03-05 2100
168 jQuery Masonry 갤러리 리스트 효과 MintState 11-19 3148
167 파이어폭스, IE에 모두 적용되는 iframe 태그 MintState 04-11 8392
166 롤링 위 아래 버튼 적용 MintState 04-06 6291
165 Select 객체 추가 삭제 MintState 07-23 7206
164 숫자에 컴마(,) 쓰고 한글로 숫자 표시 MintState 06-09 6775
163 object 속성보기 MintState 04-29 9026
162 비밀번호 보안등급 체크 (2) MintState 04-29 10039
161 기본 공통 스크립트 MintState 04-16 7511
160 textarea에 줄바꿈 금지와 글자수 제한 MintState 02-17 13458
159 JSON 객체를 String으로 변환하기 MintState 01-19 13872
158 Tooltip 풍선 도움말 MintState 10-27 9590
157 다중 셀렉트 기본 방법 MintState 10-23 7876
156 자바스크립트를 이용한 암호화 MintState 09-01 9040
155 모든 자바스크립트 에러 잠재우기 (에러 디버그) MintState 05-13 8327
154 레이어 팝업 (2) MintState 04-24 8053
 1  2  3  4  5  6  7  8  9  
모바일 버전으로 보기
CopyRight ©2004 - 2017, YesYo.com MintState. ™