Tạo hiệu ứng chữ drop cap cho tất cả các bài viết

Drop cap là làm cho chữ cái đầu tiên trong bài viết to hơn những chữ cái khác, cái này bạn có thể dễ dàng thấy trên các bài báo hay trong Microsoft Word. Hôm nay mình sẽ hướng dẫn các bạn làm điều này trên Blog với CSS.

Demo ngay trên bài viết này

#Thêm CSS

1. Đăng nhập Blogger

2. Mẫu > Chỉnh sửa HTML

3. Tìm thẻ ]]></b:skin>

4. Dán code dưới vào trên(trước) thẻ mà bạn vừa tìm

.post-body:first-letter, .post-body .dropcap:first-letter
{
font-weight:bold;
font-size:65px;
font-family: Times, serif, Georgia;
color: #F35F5E;
float:left;
padding:0;
margin:-4px 5px 0px 0px;
position: relative;
background-color:none;
line-height:0.9;
}

Lưu ý:
font-size : Kích thước tính bằng Px
font-family : Font chữ
color : Màu chữ, sử dụng mã Hex
5. Lưu mẫu lại.
Như vậy là đã hoàn thành, tất cả các bài viết trên blog của bạn đã được thêm hiệu ứng drop cap.