前端在切圖過程中，肯定遇見過這種情況。
頁面結構由三個部分組成，頭部、內容、底部。
當乙個頁面的內容沒撐滿螢幕時，底部是跟著內容而並列存在的。
這個時候如果是大屏的話，底部下面會有多餘的空白區域，而網頁設計需求必須要底部貼近瀏覽器底部。
固定定位，絕度定位都不好使。
廢話不多說，直接上**實現：
doctype html
>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>1
title
>
<
style
>
*html
body
body
.footer
.box
.box p
style
>
head
>
<
body
>
<
div
class
="box"
>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
<
p>離離原上草
p>
div>
<
div
class
="footer"
>
div>
body
>
html
>
posted @
2017-03-28 10:32
<_/> 閱讀(
...)
編輯收藏
footer固定底部 HTMLCSS方法
charset utf 8 footer始終居於底部title type text css body 核心 html,body,wrap高度100 html,body,wrapage 外框高度自動，最小高度100 ie下高度100 wrapage 內容主體下padding 防止底部疊加 mainw ...
CSS 底部固定
底部固定的兩種理解 1 無視content多高，footer始終固定在底部，隨著瀏覽器視窗高度的減小會覆蓋content內容 2 在意content高度，當瀏覽器視窗高度小於或等於content高度時，footer不去覆蓋content。相應解決方案 1 footer固定定位 footer 2 fo...
HTML CSS底部footer兩種固定方式
網頁常見的底部欄 footer 目前有兩種 一 永久固定，不管頁面的內容有多高，footer一直位於瀏覽器最底部，適合做移動端底部選單，這個比較好實現 向立凱 二 相對固定，當頁面內容高度不沾滿瀏覽器高度，footer顯示在瀏覽器底部，且不會出現滾動條，如果頁面內容高度超出瀏覽器高度，footer則...