但是在測試時我們發現,在ios中,當系統鍵盤彈出時,fixed會失效,加號按鈕會隨著鍵盤的彈出,而被頂到鍵盤的上方。後來在網上搜尋了一下,發現很多開發者都有遇到過這個問題,因為電商**會有很多這種需要用到固定定位的場景,於是去到**的移動端頁面,發現他們是通過使用絕對定位來實現固定定位的效果。方法如下:
頁面結構如圖
首先設定乙個box,大小等於頁面視窗的大小,設定屬性position:relative;盒子頂部與底部部分設定好高度,使用position:absolute,分別將top和bottom設為0,中間內容部分的高度通過js動態設定為頁面高度減掉頂部和底部欄的高度,並設定為positon:absolute,top等於頂部欄的高度,設定其屬性overflow:scroll,另外可再加上
css的固定定位
三 固定定位 fixed 表示固定定位,與 absolute 定位型別類似,但它的相對移動的座標是檢視 螢幕內的網頁視窗 本身。由於檢視本身是固定的,它不會隨瀏覽器視窗的滾動條滾動而變化,除非你在螢幕中移動瀏覽器視窗的螢幕位置,或改變瀏覽器視窗的顯示大小,因此 固定定位 的元素會始終位於瀏覽器視窗內...
在移動端如何使用固定定位
絕對定位在沒有找到開啟定位的最近祖先元素,包含塊就是初始包含塊,即乙個視口大小的矩形,只要將這個矩形固定住,就可以用絕對定位代替固定定位 doctype html en protice title viewport content width device width,initial scale 1...
用css實現的固定定位
href dq 電器a href 返回頂部a div color red 這裡是頂部font 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p 這是文字內容p name nz a color...