Một số code khung viền trang trí cho WordPress
Chú ý 1: Các bạn là phải dán code vào chế độ Văn bản (hay có mấy tên khác là chế độ Text hoặc chế độ HTML) của khung soạn thảo nhé. Cho những bạn chưa biết thì nếu các bạn muốn dán code vào thanh bên thì widget cần sử dụng ở đây là widget Văn bản nhé !
Chú ý 2: Coppy qua notepad Thay dấu ” bằng dấu “ (dấu nháy kép thẳng đứng)
Các code đường viền cơ bản
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>
Ngoài ra các bạn 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>
Nếu nội dung trong khung quá dài, các bạn có thể dùng thuộc tính overflow kết hợp với max-height (hoặc height) để thu gọn lại (và sẽ xuất hiện thanh cuộn), ví dụ:
Code:
<div style=”max-height: 150px; overflow: auto; padding: 8px; border: 2px solid #00FF00; word-wrap: break-word;”>WordPress là một phần mềm nguồn mở (Open Source Software ) được viết bằng ngôn ngữ lập trình website PHP và sử dụng hệ quản trị cơ sở dữ liệu MySQL; cũng là bộ đôi ngôn ngữ lập trình website thông dụng nhất hiện tại. WordPress được ra mắt lần đầu tiên vào ngày 27/5/2003 bởi tác giả Matt Mullenweg và Mike Little. Hiện nay WordPress được sở hữu và phát triển bởi công ty Automattic có trụ sở tại San Francisco, California thuộc hợp chủng quốc Hoa Kỳ.</div>
Kết quả:
WordPress là một phần mềm nguồn mở (Open Source Software ) được viết bằng ngôn ngữ lập trình website PHP và sử dụng hệ quản trị cơ sở dữ liệu MySQL; cũng là bộ đôi ngôn ngữ lập trình website thông dụng nhất hiện tại. WordPress được ra mắt lần đầu tiên vào ngày 27/5/2003 bởi tác giả Matt Mullenweg và Mike Little. Hiện nay WordPress được sở hữu và phát triển bởi công ty Automattic có trụ sở tại San Francisco, California thuộc hợp chủng quốc Hoa Kỳ.
Chú ý chung:
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.
