HomeBLOG

Tổng hợp 9 code khung viền trang trí cho blog WordPress

Tổng hợp 9 code khung viền trang trí cho blog WordPress
Like Tweet Pin it Share Share Email

Tạo khung viền trong wordpress

 

  • Tất cả code đều viết dưới dạng HTML.
  • Mở chế độ HTML : chọn “Text”, ở góc trên bên phải của thanh công cụ.

Xin nói trước với các bạn là mình hoàn toàn không phải là dân chuyên về công nghệ thông tin hay viết code gì cả. Dưới đây mình tổng hợp 9 code khung viền trang trí cho blog WordPress, những bạn không biết kỹ thuật vẫn làm dễ dàng.

Dạng nét liền (solid)

<div style=”padding: 8px; border: 2px solid #FF1493; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng dấu chấm (dotted)

<div style=”padding: 8px; border: 2px dotted #FF69B4; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng nét đứt (dashed)

<div style=”padding: 8px; border: 2px dashed #FF4500; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng nét đôi (double)

<div style=”padding: 8px; border: 6px double #8A2BE2; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng đường rãnh (groove)

<div style=”padding: 8px; border: 10px groove salmon; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng chóp (ridge)

<div style=”padding: 8px; border: 10px ridge salmon; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng đổ bóng bên trong (inset)

<div style=”padding: 8px; border: 10px inset #8FBC8F; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Dạng đổ bóng bên ngoài (outset)

<div style=”padding: 8px; border: 10px outset #8FBC8F; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Hoặc có thể thêm thuộc tính border-radius để bo tròn 4 góc, ví dụ như thế này:

<div style=”border-radius: 25px; padding: 8px; border: 2px solid #FF1493; word-wrap: break-word;”>CHÈN NỘI DUNG VÀO ĐÂY</div>

 

Lưu ý:

Phần chữ màu đỏ là độ dày của đường viền

Phần chữ màu xanh lá cây là loại đường viền (solid, dotted, dashed,…)

Phần chữ màu hồng là màu đường viền, có thể sử dụng tên gọi của màu (red, black,…), mã màu hex (#ffffff, #ff0000,…) hoặc các loại mã màu khác để thay màu cho đường viền.

Người viết: Sera

Tổng hợp 9 code khung viền trang trí cho blog WordPress 1Tổng hợp 9 code khung viền trang trí cho blog WordPress 2

Bình luận

avatar
  Subscribe  
Notify of