按钮悬浮固定在微信小程序底部
生活随笔
收集整理的這篇文章主要介紹了
按钮悬浮固定在微信小程序底部
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
http://mydown.yesky.com/news/87296687.html
本章節主要介紹了如何將操作按鈕懸浮固定在微信小程序底部?操作起來也比較簡單,還不會的朋友一起跟著小編學習一下吧,希望對你們有所幫助。
常見的有加入購物車按鈕、結算按鈕、收貨列表添加地址按鈕。
以收貨地址為例,將添加地址按鈕懸浮于最底部,這樣再多的地址,也不會被遮擋而看不見。
核心代碼如下:
添加
/*添加地址按鈕*/
.address-add {
position: fixed;
bottom: 0;
width: 100%;
}
改用position: fixed之后,其中width需要設置為100%,不然會是一個很窄的按鈕。
考慮到按鈕自身占據46px高度,因此地址列表還需要加上如下樣式
/
/*地址列表包裝容器*/
.address-list {
margin-bottom: 46px;
}
復制代碼
這樣一來最后一個地址點通網絡的設為默認,編輯,修改按鈕可以完整顯示出現了。
以上就是如何將操作按鈕懸浮固定在微信小程序底部的全部內容了,大家都學會了嗎?
總結
以上是生活随笔為你收集整理的按钮悬浮固定在微信小程序底部的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微信小程序页面间传递json数据
- 下一篇: 微信小程序中显示空格