絕對定位中瀏覽器視窗變化導致的位移差異

2021-08-20 08:43:30 字數 590 閱讀 6840

今天發現使用position屬性的絕對定位時,如果使用了margin:auto的居中背景便會出現定位元素隨著瀏覽器視窗的大小不同而出現與背景的差異。

position:absolute
這裡先埋個坑,改天再來填。值描述

absolute

生成絕對定位的元素,相對於 static 定位以外的第乙個父元素進行定位。

元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。

fixed

生成絕對定位的元素,相對於瀏覽器視窗進行定位。

元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。

relative

生成相對定位的元素,相對於其正常位置進行定位。

因此,"left:20" 會向元素的 left 位置新增 20 畫素。

static

預設值。沒有定位,元素出現在正常的流中(忽略 top, bottom, left, right 或者 z-index 宣告)。

inherit

規定應該從父元素繼承 position 屬性的值。

Vue 如何檢測瀏覽器視窗的變化

起源 右側做了快速導航的功能,但是滑倒底部 導航會覆蓋footer,很醜,所以決定利用瀏覽器視窗發生改變來控制導航的高度。參考 實現過程 1 我們將document.body.clientwidth賦值給data中自定義的變數 data 2 在頁面mounted時,掛載window.onresize...

div絕對定位針對手機瀏覽器的區別

最近在對ipad和安卓平板做測試,發現我自己寫的乙個下拉控制項在安卓瀏覽器裡面被遮蓋了,但是pc或者ipad都沒有這個現象,一開始以為是z index 可是無論我調多少都沒有用,研究了好久,發現是 的位置問題 首先我們看下效果圖 在電腦上我用的是ie 在安卓瀏覽器我用的是qq瀏覽器 hd 可以發現,...

瀏覽器視窗的大小

var w window.innerwidth document.documentelement.clientwidth document.body.clientwidth var h window.innerheight document.documentelement.clientheight ...