有時候我們的頁面會希望底部有一個固定的欄，不管頁面的其他內(nèi)容有多少，這個欄總是固定在頁面的底部。這時候我們可以使用CSS來設(shè)置底部固定，接下來我會介紹一下具體步驟：
/* 首先我們要設(shè)置body和html的高度為100% */
html,body{
height:100%;
margin:0;
padding:0;
}
/* 這里我們要創(chuàng)建一個類名為wrapper的div，用來包含頁面的主要內(nèi)容 */
.wrapper{
min-height:100%;
/* 接下來我們需要讓.wrapper的padding-bottom等于我們需要固定在底部的欄的高度 */
padding-bottom:50px;
}
/* 這里我們需要創(chuàng)建一個類名為footer的div，來設(shè)置我們需要固定的欄的樣式 */
.footer{
position:fixed;
left:0;
bottom:0;
width:100%;
height:50px;
background-color:#333;
color:#fff;
text-align:center;
line-height:50px;
}接下來我們在HTML中就可以使用以上的class名來設(shè)置頁面的樣式，具體方法為：
<body> <div class="wrapper"> 主要內(nèi)容 </div> <div class="footer"> 底部欄 </div> </body>
這樣就可以實(shí)現(xiàn)一個固定在底部的欄了，希望本篇文章對您有所幫助！
上一篇css樣式邊距順序
下一篇css樣式里字體顏色