文章詳情頁(yè)
css - 關(guān)于移動(dòng)端定位position準(zhǔn)確的問(wèn)題？
瀏覽：105日期：2023-01-29 10:35:49
問(wèn)題描述
這樣的一張圖，需要放8個(gè)按鈕對(duì)應(yīng)八個(gè)地圖位置，在不同尺寸的移動(dòng)端設(shè)備上，圖的寬度可能會(huì)發(fā)生變化。
按鈕的position定位如何自適應(yīng)準(zhǔn)確？
按鈕的寬高如何定？
求教解決方案。
問(wèn)題解答
回答1：1.你的地圖是怎么繪制的？2.如果是普通的p，使用相對(duì)定位和絕對(duì)定位就ok3.如果是canvas繪制的，通過(guò)x,y坐標(biāo)繪制相應(yīng)的文案提示即可
回答2：嘗試使用百分比定位
回答3：建議用canvas坐標(biāo)定位，比較準(zhǔn)確
回答4：建議使用rem單位，margin百分比+position定位在移動(dòng)UC瀏覽器中有兼容問(wèn)題
回答5：1、用<meta name='viewport'>定義設(shè)備寬度2、使用position，然后計(jì)算百分比位置
回答6：你提的問(wèn)題，我理解的是移動(dòng)端適配。解決方案有很多，比較推薦淘寶使用的rem解決方案，具體實(shí)踐可以參考這篇文章的說(shuō)的多屏適配問(wèn)題。http://www.html-js.com/articl...
標(biāo)簽：
CSS
上一條：html - css div怎么和它的偽類(lèi)after共用一樣背景圖片？下一條：html5 - 用html+css開(kāi)發(fā)桌面軟件有什么好的解決方案（兼容XP系統(tǒng)）
相關(guān)文章：
1. angular.js - angular內(nèi)容過(guò)長(zhǎng)展開(kāi)收起效果2. angular.js - angularjs的自定義過(guò)濾器如何給文字加顏色？3. javascript - 如何讓移動(dòng)端網(wǎng)頁(yè)的輸入框固定在底部？4. docker鏡像push報(bào)錯(cuò)5. MySQL中無(wú)法修改字段名的疑問(wèn)6. javascript - 微信小程序封裝定位問(wèn)題（封裝異步并可能多次請(qǐng)求）7. python的前景到底有大？如果不考慮數(shù)據(jù)挖掘，機(jī)器學(xué)習(xí)這塊？8. 網(wǎng)頁(yè)爬蟲(chóng) - 用Python3的requests庫(kù)模擬登陸B(tài)ilibili總是提示驗(yàn)證碼錯(cuò)誤怎么辦?9. android - QQ物聯(lián)，視頻通話10. 請(qǐng)教各位大佬，瀏覽器點(diǎn) 提交實(shí)例為什么沒(méi)有反應(yīng)
排行榜
熱門(mén)標(biāo)簽
網(wǎng)公網(wǎng)安備