Blog Thiết Kế

Hướng dẫn và giải đáp cho bạn những kĩ thuật trong việc sử dụng Yahoo! Blog, nơi bạn tìm thấy những theme đẹp, giúp bạn làm quen và tìm hiểu về cách tuỳ chỉnh Blog và học hỏi kinh nghiệm thiết kế Blog.

Post sort order : index

86/117 POSTS
preview
85-87/117 POSTS

close

Cách tùy chỉnh tiêu đề Module

Jul 3, 2012 5:43 PMPublicPageviews 2240 9

1. Đặt ảnh nền cho phần tiêu đề từng trang .

Demo:

Code:

<style>

#widget-tag .hd,

#widget-follwingList .hd,

#widget-calendar .hd,

#widget-recentVisitor .hd,

#widget-externalSource .hd,

#widget-statistic .hd,

#widget-category .hd,

#widget-recentPost .hd,

#widget-recentComment .hd,

#widget-photoSlide .hd{height:Xpx;background:url ( Ảnh nền );}
</style>



Trong đó: X là chiều cao của ảnh 

( * ) Với những blog xài theme mặc định thì chiều rộng (width:Ypx ) của hình nên là 192px thôi nhé .


+Nếu bạn nào muốn đặt ảnh nền bằng mã màu thì dùng code này :

Code:

<style>

#widget-tag .hd,

#widget-follwingList .hd,

#widget-calendar .hd,

#widget-recentVisitor .hd,

#widget-externalSource .hd,

#widget-statistic .hd,

#widget-category .hd,

#widget-recentPost .hd,

#widget-recentComment .hd,

#widget-photoSlide .hd{height:Xpx;background-color: Mã màu ;}

</style>

+ Bạn nào chưa biết về mã màu có thể tham khảo bài này nhé : Bảng mã màu cho blog ! 

 2. Tùy chỉnh tiêu đề từng trang .

Demo:

 
Code:

<style>

#widget-tag .hd,

#widget-follwingList .hd,

#widget-calendar .hd,

#widget-recentVisitor .hd,

#widget-externalSource .hd,

#widget-statistic .hd,

#widget-category .hd,

#widget-recentPost .hd,

#widget-recentComment .hd,

#widget-photoSlide .hd{text-align:center;color:#fff;font-size:0px;font-family:Times New Roman;text-shadow:2px 2px 2px #000 !important;text-decoration:blink;}

</style>


Trong đó center là đưa phần chữ ra giữa . Nếu không muốn chữ text sang bên phải các bạn có thể thay bằng Right
                   #fff 
 là mã màu của phần chữ tiêu đề.
                   0  là kích thước của chữ  .
                   Times New Roman  là fone chữ
                    #000   làm cho chữ đổ bóng  mờ. Phần này  các bạn có thể thay đổi thông số đổ bóng chử tùy thích 
                   text-decoration:blink;  là hiệu ứng chữ nhấp nháy .

Bạn nào không thích hiện lên phần chữ text tiêu đề của trang thì có thể xóa nó đi:

Code:

<style>

#widget-tag .hd,

#widget-follwingList .hd,

#widget-calendar .hd,

#widget-recentVisitor .hd,

#widget-externalSource .hd,

#widget-statistic .hd,

#widget-category .hd,

#widget-recentPost .hd,

#widget-recentComment .hd,

#widget-photoSlide .hd{font-size:0px;}

</style>


Bạn nào chưa biết về mã màu có thể tham khảo bài này nhé!

Have fun ^^

Nguồn: Hoàng Hùng

Report abuse for this article

Copyright © 2013 Yahoo!, Inc. All rights reserved