Bà con qua lại thấy hay thì cho 1 like nhé
Tui sống bằng like đóa =))))))))))))))))))))))))))))))
Nơi tập hợp các tip với wordpress mà mình biết 👉 Tip wordpress
Dành cho những bạn đã có hiểu sơ sơ về việc viết code viền nhé,
đây coi như là nâng cao nghen
Kết quả sau khi code BUTTON
Code
Nội dung code copy
( copy vào file Txt để copy lại vào web không bị lỗi nha )
Cách 1: thêm style vào link <a>
<p> Nội dung trước nút </strong>: <a href=” Link_button ” style=”background: antiquewhite; padding: 10px 30px; border-radius: 50px; border: 2px solid #83172e; box-shadow: 4px 4px 6px rgba(192,185,185,0.53) ;”> Nội dung button </a></p>
Kết quả: Nội dung trước nút : Nội dung button
—————-
Cách 2: Tạo nút button và sửa style của nút
<p><span style=”font-family: inherit; font-size: inherit; font-weight: inherit;”> Nội dung trước button 👉 </span><a class=”wp-block-button__link” style=” font-family: inherit; font-size:16px; font-weight: inherit; background-color: #f57c7c; color: white; padding: 7px 25px; border-radius:50px; box-shadow : rgba(192,185,185,0.53) 4px 4px 7px; margin-right:10px; border: 2px solid #f6b8b8;” href=”LINK-BUTTON“>Pass</a></p>
Kết quả : Nội dung trước button 👉 Pass
Giải thích cơ bản
- Phần
<span style=”font-family: inherit; font-size: inherit; font-weight: inherit;”> Nội dung trước button 👉 </span>có thể bỏ - Các phần inherit : có thể sửa theo sở thích hoặc bỏ luôn không ảnh hưởng
- wp-block-button__link: bắt buộc phải có
- font-family: thích thêm thì thêm, không thì bỏ cũng được
- background-color: Màu nền nút
- color: Màu chữ trong nút
- padding: 7px 25px;
- 7px : Độ cao nút
- 25px: Độ dài nút
- border-radius: 50px – Độ cong của nút ( px càng nhỏ độ cong càng ít )
- border: điều chỉnh độ dày viền tùy ý theo px
- box-shadow: độ đổ bóng ( rgba là màu )