一、固定底部導航欄并且實現自適應 <style> *{margin: 0px;padding: 0px}/*設置無邊距*/ img{width: 100%} .footer{ display: flex;/*設置成盒子模型*/ width:100%; height:70px; background: #eeeeee;/*設置背景色*/ /*固定到底部start*/ position:fixed;/*固定作用*/ bottom:0px; /*固定到底部end*/ /*ie6下樣式，加下劃線表示只針對ie6 的hack */ _position:absolute;/* 把導航欄位置定義為絕對位置 關鍵*/ _bottom:expression(documentElement.scrollTop + "px"); /* 把導航欄位置放在瀏覽器垂直滾動條的頂端 關鍵 */ z-index:9999; /* 讓導航欄浮在網頁的高層位置，遇到flash和圖片時候也能始終保持最外層 */ } .footer div{width: 33.3333%;text-align: center;margin-top: 8px;} .footer div p img{width: 30px;height: 30px;} </style> <div class="footer"> <div><p><img src="/static/wap/images/index/ft-1.png"></p><p>首頁</p></div> <div><p><img src="/static/wap/images/index/ft-2-2.png"></p><p>搜索</p></div> <div><p><img src="/static/wap/images/index/ft-3-3.png"></p><p>我的</p></div> </div>