Trong làm web nhiều lúc khoảng không bỏ trống muốn đặt cái gì đó , với 1 đoạn code html và css sẽ giúp bạn Tạo banner trượt cho web wordpress theme flatsome rất đẹp , nhẹ và hữu dụng nhé !
Tạo banner trượt cho web wordpress theme flatsome
Xem demo sau khi đặt nhé
Các Tạo banner trượt cho web wordpress theme flatsome
bạn chèn vào
CÓ THỂ BẠN QUAN TÂM
Global Settings / FOOTER SCRIPTS
chèn code này vào
|
1 2 3 4 5 6 7 8 9 |
<div class="banner_fix banner_fix_left" style="top: 60px;"> <a href="http://tinvanphong.net/"><img alt="tinvaphong.net" src="https://binance24h.online/wp-content/uploads/2022/05/exel.jpg"></a> </div> <div class="banner_fix banner_fix_right" style="top: 60px;"> <a href="http://tinvanphong.net/"><img alt="tinvaphong.net" src="https://binance24h.online/wp-content/uploads/2022/05/exel.jpg"></a> </div> |
bạn có thể chèn trực tiếp vào theme ( file head hoặc file tương tự trong themes nhé )
sau ki đặt xong nhớ copy code css sau dán vào
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<style> .banner_fix_left { right: calc((1240px) + (100% - 1240px)/2); transition: all .3s; } .banner_fix { display: block; position: fixed; margin-top: 100px; } .banner_fix_right { left: calc((1240px) + (100% - 1240px)/2); transition: all .3s; } </style> |
Chú ý : nếu bỏ vào text box css thì đừng để thẻ <style></style> nhé
Với dòng css trên right: calc((1240px) + (100% – 1240px)/2); ( đang định nghĩa layout của bạn là 1240px ) nếu layout của bạn là số khác bạn có thể thay lại cho phù hợp nhé
với dòng code css này khi Zoom web bannner sẽ không chòng lên conten rất hợp lý
Nếu bạn làm không được hoặc thắc mắc gì có thể đặt câu hỏi để mình giúp nhé
Chúc bạn thành công
Pingback: Code thêm thời gian đọc bài cho wordpress - FLATSOME - FREE EVERY THING