Ở các báo điện tử lớn như Tuổi trẻ, Dân trí, bạn thường thấy bài viết được trình bày rất rõ ràng và đẹp mắt. Thường thì sẽ có một đoạn văn bản riêng biệt được làm nổi bật lên trên bài viết. Trên blog của tôi cũng đã sử dụng cách trình bày này cho một số bài viết, xem hình minh họa dưới đây:
Cách thực hiện rất đơn giản, bạn chỉ cần sử dụng đoạn code sau đây:
<div style="border: #ccc 1px solid ; margin: 10px; padding: 5px; background: #CFE6F9; width: 150px; float: right; text-align: justify;"> {Đoạn văn bản} </div>
Trong đó:
+ border: màu đường viền+ background: màu nền
+ width: độ rộng (chiều cao thì sẽ tự thay đổi tùy theo độ dài của đoạn văn bản của bạn)
+ float: vị trí trong bài viết, có thể thay đổi trái(left) hoặc phải(right) tùy bạn.
+ text-align: căn đều cho văn bản.
+ margin, padding: căn lề, bạn có thể chỉnh sửa, tốt nhất là cứ để nguyên.
Chúc bạn thành công!
0 nhận xét:
Đăng nhận xét