亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

請教一個web布局問題？

請教一個web布局問題？

慕容森 2018-11-21 16:14:26
描述一下，對于頁面，內容少得不足以產生滾動條的時候，footer落在最底部面， 當內容變多，頁面產生滾動條時，footer要處于內容的最后，即滾動到最底部才能看見我知道一種是使用 負值margin-top 和 正值padding-bottom 的方法，但是感覺不夠靈活..請問有沒有什么好的實現方法？這是我答案：純css因為我主要用在移動端 應該可以兼容吧....https://jsfiddle.net/BoomBang...
查看完整描述

1 回答

?
慕姐4208626

TA貢獻1852條經驗 獲得超7個贊

這種東西就在于思路：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>

    <title></title>

</head>


<body>

    <style>

    body{

        margin: 0;

    }

    html,

    body,

    .wrap {

        height: 100%;

    }

    

    .content {

        min-height: 100%;

    }

    

    footer {

        height:50px;

        background-color: #0cc;

        margin-top: -50px;

    }

    </style>

    <div class="wrap">

        <div class="content">

            <div>內容區域</div>

        </div>

        <footer>

            底部

        </footer>

    </div>

</body>


</html>

效果圖：

https://img1.sycdn.imooc.com//5c1365a400015c5203690657.jpghttps://img1.sycdn.imooc.com//5c1365ac000153b603720661.jpg

查看完整回答
反對 回復 2018-12-14
  • 1 回答
  • 0 關注
  • 418 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

 幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

 公眾號

掃描二維碼
關注慕課網微信公眾號