HTML 푸터 고정
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 | <!DOCTYPE html> <html lang="ko"> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <style media="screen" type="text/css"> html, body {margin:0; padding:0; height:100%;} #wrap {min-height:100%; position:relative;} #header { background:#ff0; padding:10px; } #container {padding:10px; padding-bottom:60px;} /* contianer padding-bottom px*/ #footer { position:absolute; bottom:0; width:100%; height:60px; background:#6cf; }/* Height footer */ </style> <!--[if lt IE 7]> <style media="screen" type="text/css"> #container { height:100%; } </style> <![endif]--> </head> <body> <div id="wrap"> <!-- header--> <div id="header"> <h1>header</h1> </div> <!-- // header --> <!-- body --> <div id="container"> body 푸터 고정 </div> <!-- // body--> <!-- footer --> <div id="footer"> Footer </div> <!-- Footer end --> </div> </body> </html> |
WEB HTML 푸터 고정.
'개발연습막쓰기 > 개발연습 막쓰기' 카테고리의 다른 글
| VSCODE 단축키 (0) | 2017.03.01 |
|---|---|
| 퍼블리싱 워크리스트 (0) | 2017.02.06 |
| CSS animate 사이트 (0) | 2016.12.27 |
| jQuery 셀럭터, jQuery 선택자 (0) | 2016.12.08 |
| DOM Tree 란.. (0) | 2016.12.05 |