文章詳情頁

javascript - 使用css如何將一個小盒子始終固定在大盒子的底部，大盒子高度為100%，請教。

瀏覽：150日期：2022-11-20 18:32:55

問題描述

![圖片上傳中...]

問題解答

回答1：

.box { position: absolute; top: 0; left: 0;}/* 或者 */.wrapper { display: flex; align-items: flex-end;}回答2：

看下我有沒有猜錯你的意思；

//大容器100% //內(nèi)容區(qū)域 //小盒子顯示的上拉狀態(tài) //滾動區(qū)域 //我是滾動條<style>.container{ position:relative; height:100%; overflow:hidden; /*.....*/}.wrapper{ position:relative; height:auto; /*.....*/}.content{ position:relative; height:auto; /*....*/}.refresh{ position:relative; float : left; width:100%; height:40px; /*......*/}.scrollBox{ position:absolute; height:100%; right:0px; top:0px; /*因為scrollBox的父元素是container，而且改變的是content，所以這里不會發(fā)生改變*/}.bar{ position:relative; height : /*通過js計算并更新*/;}</style>

這里你可以讓wrapper和content的高度一樣，也就是position都為relative，refresh這里使用float，然后設(shè)定好寬高。因為refresh這里已經(jīng)脫離了文檔流，所以不會影響wrapper的高度，container設(shè)定為overflow：hidden。當(dāng)你往上拉過頭的時候，refresh會自然而然的上來。不知道這樣行不行。

回答3：

最無腦的是用position:absolute實現(xiàn)：

javascript - 使用css如何將一個小盒子始終固定在大盒子的底部，大盒子高度為100%，請教。

*要注意的是，大盒子也要設(shè)置position，小盒子的position才知道是和誰去對比，如果父級節(jié)點找不到position它會繼續(xù)向上找直到找到有position的DOM節(jié)點

回答4：

固定高度+margin負(fù)值

回答5：

大的p絕對定位小的p 相對定位 bottom 為0 不就可以了嗎

JavaScript

上一條：javascript - css輪播圖適應(yīng)布局問題下一條：javascript - js用面向?qū)ο缶幊毯推胀ê瘮?shù)編寫插件有什么區(qū)別

排行榜

					
					關(guān)于docker下的nginx壓力測試
					1. nignx - docker內(nèi)nginx 80端口被占用
					2. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””
					3. docker容器呢SSH為什么連不通呢？
					4. docker - 各位電腦上有多少個容器??？容器一多，自己都搞混了，咋辦呢？
					5. mac里的docker如何命令行開啟呢？
					6. dockerfile - 我用docker build的時候出現(xiàn)下邊問題  麻煩幫我看一下
					7. macos - mac下docker如何設(shè)置代理
					8. angular.js使用$resource服務(wù)把數(shù)據(jù)存入mongodb的問題。
					9. docker鏡像push報錯
					10. 
			熱門標(biāo)簽

					
					PHP

					JavaScript

					HTML

					CSS

					java

					vue

					數(shù)據(jù)庫

					微信

					百度

					

日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区

日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区

javascript - 使用css如何將一個小盒子始終固定在大盒子的底部，大盒子高度為100%，請教。

javascript - 使用css如何將一個小盒子始終固定在大盒子的底部，大盒子高度為100%，請教。