css的position-relative兼容問題與解決辦法

開發(fā)中遇到了使用相對(duì)定位,發(fā)現(xiàn)谷歌瀏覽器和QQ瀏覽器渲染的方式不一樣,對(duì)應(yīng)父級(jí)定位不同
解決辦法
把需要定位的元素放在父級(jí)中的第一個(gè)子元素的位置


在實(shí)際使用中發(fā)現(xiàn)一個(gè)兼容性的問題,position:relative是指針對(duì)上級(jí)目錄的相對(duì)決定定位,他是浮動(dòng)在頁面上的,但是相對(duì)父級(jí)是占有空間的,實(shí)驗(yàn)證明他們的top屬性針對(duì)的對(duì)象不一致:firefox chome IE7、8等不會(huì)出問題,就是針對(duì)他的直接parent y坐標(biāo)定位,但是遨游、騰訊等ie內(nèi)核的包裝瀏覽器就會(huì)不一樣,他們針對(duì)的是書寫位置的上一個(gè)直接對(duì)象,這樣做出來的浮動(dòng)層在瀏覽器下就不兼容了,y坐標(biāo)不統(tǒng)一

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,207評(píng)論 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)。 注意:講述HT...
    kismetajun閱讀 28,892評(píng)論 1 45
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表,主要用...
    寥寥十一閱讀 2,084評(píng)論 0 6
  • 概述 在網(wǎng)易云課堂學(xué)習(xí)李南江老師的《從零玩轉(zhuǎn)HTML5前端+跨平臺(tái)開發(fā)》時(shí),所整理的筆記。筆記內(nèi)容為根據(jù)個(gè)人需求所...
    墨荀閱讀 2,478評(píng)論 0 7
  • 飛船緩緩啟動(dòng),他深情的看著窗外,留戀著這片土地,默默地落下幾滴熱淚。 移民計(jì)劃啟動(dòng)于10年前,那時(shí)他94歲...
    麻花騰閱讀 238評(píng)論 1 1

友情鏈接更多精彩內(nèi)容