百度首頁示例：

我給二維碼，和下面文本固定位置

這時html代碼

<div id="bar_code"><div class="img_put"></div><p>百度</p></div><div id="footer"><p id="row_1"><a href="#">百度設為主頁</a><a href="#">關于百度</a><a href="#">About Baidu</a><a href="#">百度推廣</a></p><p id="row_2"><s>?2018 Baidu</s> <a href="#">使用百度前必讀 </a><a href="#"> 意見反饋</a><s>京ICP證030173號</s><i class="icon1"></i><a href="#" class="j_g">京公網安備11000002000001號</a><i class="icon2"></i></p></div>

css（分別給他們設置了position:absolute）但是沒有給他們的父級設置相對定位，這時他們以body為相對定位，沒有改變窗口的時候一切都好好的

#bar_code{position: absolute;text-align: center;bottom: 140px;width: 100%;height: 60px; }.img_put{display: inline-block;width: 60px;height: 60px;background: url(../image/barCode.png) no-repeat;background-size: 60px 60px;}#bar_code p{color: #666;font-weight: 600;line-height: 23px;padding: auto auto; }#footer{position: absolute;bottom: 47px;width: 100%;line-height: 22px;font-size: 12px;text-align: center;overflow: hidden; }#footer a{display: inline-block;color: #999;text-decoration: underline; } #row_1 a{margin-left: 25px; }#footer s{color: #999; } .j_g{margin-left: 25px; } #footer i{display: inline-block;width: 14px;height: 17px;margin: 0 3px -3px 0; } .icon1{background: url(../image/icons.png) -600px -96px; } .icon2{background: url(../image/icons.png) -623px -96px; }

全部都皺成一團，那我們這時也可以給body設置一個最小高度和最小寬度避免出現這種情況，但是給body設置會造成很多不便的情況，比如我們又要往里面添東西，這時整個頁面顯得非常的限制

所以我們就給它的父級添上相對定位，和最小寬度，最小高度避免這種情況的出現

#content{position: relative;width: 100%;text-align: center;min-width: 810px;height: 100%;min-height: 600px;}

頁面就會出現滾動軸，避免父級高度不夠出現剛才皺成一團的情況

?

?

?

轉載于:https://www.cnblogs.com/masanhe/p/8995259.html

總結

以上是生活随笔為你收集整理的固定div的位置——不随窗口大小改变为改变位置的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。