Trang trí các Khung kiểu liệt kê: Khung Thống kê (#statistic), Bài viết mới (#article_new), Lời bình mới (#comment_new), Thư mục (#folder)...

Ở các khung này ngoài lớp để đặt ảnh của nền ra (.bd), chúng ta còn 2 lớp để đặt ảnh nữa là (ul -lớp bao gồm 1 khối liệt kê) và (li - lớp bao gồm từng dòng liệt kê). Lớp (li) thường đã được dùng để tạo 1 icon đầu dòng cho mỗi liệt kê.

(Ví dụ lệnh: #article_new .bd ul li {background:transparent url(http://i241.photobucket.com/albums/ff182/hienhoang_2007/images03/orange_book_open.gif) no-repeat center left;} dùng để tạo 1 hình quyển sách nhỏ trước mỗi tiêu đề bài viết mới)

Ở các khung Bài viết mới, Thư mục, Bạn bè chỉ có 1 lớp (ul), riêng ở khung Lời bình mới có thể có nhiều hơn 1 lớp (bằng số bài có lời bình mới được hiện ra).

Ảnh đặt tại lớp (ul) sẽ ở trên ảnh đặt tại  lớp (.bd) do vậy nếu muốn nhìn thấy ảnh của lớp (.bd) thì không được tô màu lớp (ul). Ở đây, lệnh HEIGHT được sử dụng để tăng chiều cao của khung cho thích hợp với ảnh đặt thêm vào. Ví dụ code CSS trang trí khung Thống Kê của tôi:

#statistic .rc_bd .rc_bc .bd
{background:#ffffee url(http://i241.photobucket.com/albums/ff182/hienhoang_2007/Background/05bgc.gif);}

Lệnh trên là chọn màu nền và ảnh nền của lớp .bd (trong ví dụ này ảnh nền đã che hết màu nền, đưa vào chi để minh họa)

#statistic .rc_bd .rc_bc .bd ul
{height:400px;background:url(http://i241.photobucket.com/albums/ff182/hienhoang_2007/5.gif) no-repeat bottom left;}

Lệnh tiếp theo này là để thay đổi chiều cao của phần liệt kê (cũng là của khung) và chọn 1 ảnh để ở phần phía dưới của khung.

Trang trí cho khung Giới thiệu bản thân (#profile_highlight)

Các bạn đã từng trang trí 360 plus bằng CSS hẳn biết rằng 360 plus bổ ra hẳn 6 lớp ảnh để trang trí đường viền cho mỗi khung lần lượt là:

 .rc, .rc div : dùng để tạo đường viền trên đỉnh; 
.rc_bd, .rc_bd .rc_bc : dùng để tạo đường viền 2 bên trái phải;
.rc_ft, .rc_ft div : dùng để tạo đường viền dưới đáy;

Nếu bạn không dùng viền cho các khung, hoặc có thể trang trí đường viền  bằng lệnh BORDER thì bạn sẽ có 6 lớp thêm để đặt ảnh cho khung của mình. (quá nhiều, ai mà dùng hết được cơ chứ!)

Nếu bạn dùng viền cho khung Giới thiệu bản thân rồi, bạn vẫn có thể đặt thêm một hình vào để trang trí Khung này đẹp thêm bằng cách sử dụng  #profile_highlight_module đặt trùng và ở dưới #profile_highlight. Lúc này, bạn phải nhiều lần sử dụng lệnh HEIGHT. Tham khảo ví dụ dưới đây:

#profile_highlight .hd, #profile_highlight .ft
{height:0px;}

Lệnh trên để đảm bảo rằng tiêu đề và phần đáy của khung Tự giới thiệu có chiều cao bằng 0

#profile_highlight .bd {font-family:PAPYRUS;font-size:21px;font-weight:bold;color:#000000;height:400px;background:url(http://i266.photobucket.com/albums/ii277/babybao_iloveu/flower/695072k2m8tfrqy2.gif) no-repeat bottom center;}

Lệnh trên chọn hình đặt ở phía dưới của khung và chỉnh chiều cao khung cho hợp lý với ảnh đặt vào;

#profile_highlight_module {height:400px;background:#FFFFFF url(http://i266.photobucket.com/albums/ii277/babybao_iloveu/background%201/070307hnc204_m_cola71a.gif);}

Lệnh trên là để chọn màu nền, hình nền và chỉnh chiều cao nền của khung để nó không vượt quá đường viền.

theo hienhoang74 Blog 

.col-150 Chỉ 2 modun nhỏ tự tạo, nằm ở 2 bên blog.
.col-600 Chỉ modun lớn nằm giữa blog.
.row-920 Chỉ modun dài nhất, nằm ở trên cùng và dưới cùng blog

Danh sách các trang có thể đặt hình nền:

body.blog_my
body.profile_view
body.comment_list
body.blog_my_default
body.comment_listing
body.trackback_listing
body.blog_archives_folder
body.blog_archives_date
body.blog_archives_all
body.post_rte
body.post_doodle
body.guestbook
body.subscribe_list
body.post_gb
body.gallery
body.photo_big
body.slideshow
body.photo_upload_pc
body.photo_upload_gallery

hoặc

HTML {background:url(Link Ảnh Nền Toàn Bộ Blog) center fixed;}

Màu link và màu khi di chuột đến link:

a{color:#6F5F06;}
a:hover{color:#FF0000;}

 .rc, .rc div : dùng để tạo đường viền trên đỉnh
.rc_bd, .rc_bd .rc_bc : dùng để tạo đường viền 2 bên trái phải
.rc_ft, .rc_ft div : dùng để tạo đường viền dưới đáy

font-family:PAPYRUS  -Phông chữ

font-size:21px  -Cỡ chữ

font-weight:bold   -Chữ in đậm

font-style:italic   -Chữ nghiêng

color:#FFHDFS   -mã màu

height:400px  -Chiều cao của modun

height:auto  -Chiều dài tự động

border  -Đường viền, đường biên

border-left:5px dotted #fff  -Đường viền trái 5px dotted, màu #fff

text-align:right  -Căn chữ sang phải

no-repeat center top  -Có nghĩa là ảnh được hiện thị 1 lần (no-reapeat), ko lặp lại, ảnh được ở giữa (center) tiêu đề hay nền modun, ảnh được hiện thị từ trên xuống dưới (top)

bottom -Ảnh được hiện thị từ dưới lên

right  -Căn phải

left  -Căn trái

repeat  -Lặp từ trái qua phải, từ trên xuống dưới

no-repeat  -Không lặp

repeat-x  -Lặp theo chiều ngang

repeat-y  -Lặp theo chiều học

background:transparent  -Dùng làm trong suốt hoàn toàn

background:#FHJDFH  -Chèn màu vào

background:URL(Link ảnh)   -Chèn ảnh vào

background:transparent url(link ảnh) viết giản lược thành background:URL(Link ảnh)  

!important  -Khi qui định thuộc tính nào !important, thuộc tính đó sẽ không bị khi đè.