Tạo Ghi Chú, Khuyến Cáo, Cảnh Báo Đẹp Cho Blogger · DienDan.Edu.Vn

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 :

Truy cập Blogger > Mẫu > Chỉnh sửa HTML
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;
}

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

Rate this post

DienDan.Edu.Vn Cám ơn bạn đã quan tâm và rất vui vì bài viết đã đem lại thông tin hữu ích cho bạn.
DienDan.Edu.Vn! là một website với tiêu chí chia sẻ thông tin,... Bạn có thể nhận xét, bổ sung hay yêu cầu hướng dẫn liên quan đến bài viết. Vậy nên đề nghị các bạn cũng không quảng cáo trong comment này ngoại trừ trong chính phần tên của bạn.
Cám ơn.