Tạo ghi chú, khuyến cáo, cảnh báo đẹp cho Blogger

Trong khi viết bài trên blog chúng ta chắc chắc sẽ cần ghi chú hoặc thêm vào những lưu ý nhỏ cho người đọc, vậy thì tại sao không làm nó độc đáo và đẹp mắt hơn là những đoạn in đậm, in nghiêng thông thường? Mình xin chia sẻ với các bạn cách tạo thêm CSS ghi chú hiệu ứng đẹp cho Blogspot, chỉ cần vài thao tác đơn giản là bạn có thể hoàn thành Tips này.

Cách Thực Hiện :

1. Truy cập Blogger > Mẫu > Chỉnh sửa HTML
2. Sau đó thêm đoạn code sau trước thẻ  ]]></b:skin> hoặc </style>
Copy All Code


.info, .tips, .warning {
line-height: 22px;
min-height: 38px;
padding-left: 10px;
padding: 10px 12px 12px 68px;
margin: 5px 0;
}
.info {
background: #e0e5eb url('https://i.imgur.com/3EbxygA.png') no-repeat 12px 8px;
color: #222
}
.tips {
background: #7CADDE url('https://i.imgur.com/n1KiHNH.png') no-repeat 12px 8px;
color: #fff;
}
.warning {
background: #db6161 url('https://i.imgur.com/SGyqoI4.png') no-repeat 12px 8px;
color: #fff;
}

3. Sau đó lưu lại và bạn đã hoàn tất cách Tạo Ghi Chú, Khuyến Cáo, Cảnh Báo Đẹp Cho Blogger – Blogspot bằng CSS

Hướng dẫn cách sử dụng:

 Hướng dẫn

Copy đoạn code sau dán vào trang hoặc bài viết bạn muốn hiển thị.

Copy All Code

<div class='info'>
Nội dung cần ghi chú
</div>

Copy All Code

<div class='tips'>
Nội dung cần ghi chú
</div>

Copy All Code

<div class='warning'>
Nội dung cần ghi chú
</div>

Sưu Tầm