本章節(jié)主要介紹了如何將操作按鈕懸浮固定在微信小程序底部?操作起來(lái)也比較簡(jiǎn)單,還不會(huì)的朋友一起跟著小編學(xué)習(xí)一下吧,希望對(duì)你們有所幫助。
創(chuàng)新互聯(lián)是由多位在大型網(wǎng)絡(luò)公司、廣告設(shè)計(jì)公司的優(yōu)秀設(shè)計(jì)人員和策劃人員組成的一個(gè)具有豐富經(jīng)驗(yàn)的團(tuán)隊(duì),其中包括網(wǎng)站策劃、網(wǎng)頁(yè)美工、網(wǎng)站程序員、網(wǎng)頁(yè)設(shè)計(jì)師、平面廣告設(shè)計(jì)師、網(wǎng)絡(luò)營(yíng)銷人員及形象策劃。承接:做網(wǎng)站、網(wǎng)站設(shè)計(jì)、網(wǎng)站改版、網(wǎng)頁(yè)設(shè)計(jì)制作、網(wǎng)站建設(shè)與維護(hù)、網(wǎng)絡(luò)推廣、數(shù)據(jù)庫(kù)開發(fā),以高性價(jià)比制作企業(yè)網(wǎng)站、行業(yè)門戶平臺(tái)等全方位的服務(wù)。
常見的有加入購(gòu)物車按鈕、結(jié)算按鈕、收貨列表添加地址按鈕。
以收貨地址為例,將添加地址按鈕懸浮于最底部,這樣再多的地址,也不會(huì)被遮擋而看不見。
核心代碼如下:
添加
/*添加地址按鈕*/ .address-add { position: fixed; bottom: 0; width: 100%; }
改用position: fixed之后,其中width需要設(shè)置為100%,不然會(huì)是一個(gè)很窄的按鈕。
考慮到按鈕自身占據(jù)46px高度,因此地址列表還需要加上如下樣式
/ /*地址列表包裝容器*/ .address-list { margin-bottom: 46px; }
這樣一來(lái)最后一個(gè)地址點(diǎn)通網(wǎng)絡(luò)的設(shè)為默認(rèn),編輯,修改按鈕可以完整顯示出現(xiàn)了。
總結(jié)
以上所述是小編給大家介紹的操作按鈕懸浮固定在微信小程序底部的實(shí)現(xiàn)代碼,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)創(chuàng)新互聯(lián)網(wǎng)站的支持!
如果你覺(jué)得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!