Tạo gợn sóng phân cách bằng SVG trên Flatsome

Để tạo gợn sóng phân cách giữa các block trong Flatsome ta làm như sau:

B1: Trong ux builder tạo 2 section như sau

Tạo gợn sóng phân cách bằng SVG trên Flatsome

Trong đó Section bên trên trong UX chỉnh “margin = -15%” hoặc tùy ý bạn, mục đích để các layer trùng lên nhau

Tạo gợn sóng phân cách bằng SVG trên Flatsome

B1: vào trang getwaves.io tạo gợn sóng như ý muốn và tải file về

Trước khi tải về nhớ chỉnh lại màu nền của đường gợn sóng lại nhé, trong hình ví dụ bên dưới là màu xanh.

Tạo gợn sóng phân cách bằng SVG trên Flatsome

B3. Trong banner của section bên dưới ta thao tác như sau

Ta chọn background là file svg vừa mới tải về như hình bên dưới

Tạo gợn sóng phân cách bằng SVG trên Flatsome

Kết quả sau khi chèn file svg chúng ta có thể xem trong trang ví dụ về dùng svg làm phân cách nhé

Code block mình làm cho các bạn tham khảo:

	
<h6>Ví dụ về</h6>
<h1>SVG wave</h1>
<h6><a href="https://codfe.com/tao-gon-song-phan-cach-bang-svg-tren-flatsome/">Tạo gợn sóng phân cách bằng SVG trên flatsome</a></h6>

File svg dùng trong ví dụ svg wave (87 downloads)

Chúc các bạn thành công nhé

Nguồn : https://codfe.com

Đánh giá post

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Hotline: 0974.0707.83(Zalo/Viber)