微信小程式 頭部適配 膠囊

2022-08-21 14:54:07 字數 373 閱讀 9260

樣式如上圖所示它的要求:乙個頭部樣式自定義,它在膠囊左邊的內容又分為左右兩部分,如何讓它螢幕寬自適應?只需要用到wx.getmenubuttonboundingclientrect()獲取膠囊資訊就可以寫出來

例子如下

1 let menubutton=wx.getmenubuttonboundingclientrect()

2this

.setdata()

然後在頁面中的樣式就可以寫了,紅色區域的寬就是膠囊距離左邊的距離}px,距離上面的距離用padding-top寫},高也就是膠囊的高}

uniapp發布微信小程式適應頭部

uni.getsysteminfo safeareainsets screenheight 667 螢幕高度 screenwidth 375 螢幕寬度 statusbarheight 20 狀態列高度 system ios 10.0.1 作業系統版本 version 7.0.4 版本號 window...

微信小程式頁面引入公用頭部底部

最近比較浮躁各種事情各種煩惱,現在開始靜下心來寫部落格。學技術就不能浮躁時時刻刻要記在心裡,激勵自己希望也可以激勵大家。最近一段時間在開發小程式,沒有系統的學習過拿起來就做的那種寫的不好各位多多指教。第一步 新建乙個目錄 pages templates foot 自動為我們生成 這個目錄我們用來存放...

(微信小程式)一 初識微信小程式

需要看的 先是檔案目錄 一 pages 他存放於多個頁面 如 index log頁面。可以把他裡面的每個資料夾看成乙個整體。這個整體存放著 html css 和 資料 1 index資料夾 存放的index頁面的目錄。2 index.js 他可以處理得到 ajax 或自定義定義的資料。把得到的值封裝...