1 số anh em nghi vấn về mẫu button slider tạo điểm đặc sắc xíu cho slider trong theme flatsome nhàm chán trước giờ , ok hôm nay tớ chia sẽ cách khiến cho nhé
Tạo button slider flatsome đẹp
Để dễ mường tưởng bạn xem qua hình mình đã làm Công trình
Tạo button slider flatsome đẹp
1 điểm nhấn khác thường so có Slider của Flatsome đúng không nào , nếu như bạn muốn xem thực tiễn bạn mang thể xem qua demo tại đây https://farm.chowebs.com
cách thức khiến button slider flatsome đẹp
bạn chỉ cần đặt css nào vào css custom là xong nhé
một
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
.flickity-prev-next-button.previous
left: 90%;
.flickity-prev-next-button
opacity: 1;
.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button
margin-top: -43%;
.slider-nav-circle .flickity-prev-next-button svg
border: 0;
border-radius: 100%;
background-color: #9a1b1f;
border-radius: 0;
color: white;
|
Bạn sở hữu thể chỉnh các thông số left: 90% và margin-top: -43% cho phù hợp mang width của slider của bạn
Bạn cũng với thể đặt slider của bạn trong 1 table nhớ đặt class cho table nhé ( thí dụ tớ đặt class cho table là .sanpham là ta với thể code css dạng sau )
1
hai
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
.sanpham .flickity-prev-next-button.previous
left: 90%;
.sanpham .flickity-prev-next-button
opacity: 1;
.sanpham .slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button
margin-top: -43%;
.sanpham .slider-nav-circle .flickity-prev-next-button svg
border: 0;
border-radius: 100%;
background-color: #9a1b1f;
border-radius: 0;
color: white;
|
Bạn chỉ cần lưu lại là xong
Chúc bạn thành công
