Shulou(Shulou.com)06/01 Report--

The purpose of this article is to share with you how to customize the pointing style of Mini Program swiper rotated map panel. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

WeChat Mini Programs's swiper component is a slider view container, that is to say, usually we can use it to do the broadcast pictures, but this component has a lot of fixed styles, but sometimes the panel indication points of our design drafts need to be personalized, so how to modify the style of the panel indication points of swiper components? Recently, I was thinking about this when I was using swiper, and finally I found that I could see his selector when debugging.

The specific code is as follows:

.swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal {margin-bottom: 2rpx;} .swiper-box .wx-swiper-dot {width:40rpx; display: inline-flex; height: 10rpx; margin-left: 20rpx; justify-content:space-between;} .swiper-box .wx-swiper-dot::before {content:''; flex-grow: 1; background: rgba (255flex-grow: 0.8) Border-radius: 8rpx}. Swiper-box .wx-swiper-dot-active::before {background:rgba;} Thank you for reading! This is the end of the article on "how to customize the indicating point style of Mini Program swiper rotation panel". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.