Trong loạt bài trước, chúng ta đã thiết lập Yahoo Mash với các thông tin cơ bản, gồm hình nền, màu module, màu đường viền, màu link và màu chữ. Hôm nay, chúng ta sẽ phục hồi lại nguyên vẹn các giá trị đó bằng cách can thiệp mã CSS.
 |
Trước tiên, bạn vào trang web http://tinyurl.com/2jo68w, ở mục “TOP or Main background and text properties”, dòng “TOP or MAIN background image URL”, bạn điền link của ảnh đã chọn làm hình nền cho blog của mình (ảnh phải có phần mở rộng là .bmp, .jpg, .gif, .png). Lựa chọn này tương tự lựa chọn “Background Image URL” ở giao diện cũ.
|
|
 |
Tiếp theo, để đặt vị trí cho tấm hình nền, dòng “Background position, bạn chọn một vị trí thích hợp (chẳng hạn là “top left”). Lựa chọn này tương việc chọn trong nhóm lựa chọn các vị trí đặt hình nền của giao diện cũ, gồm Bottom (nay chia thành bottom left và bottom right), Top (nay chia là top left và top right), Center (không có, nhưng bạn cứ chọn là top left, sau đó- trong mã CSS hiện ra, bạn thay top left thành center là được. )
 |
|
|
|
|
|
|
Tiếp tục, dòng “Repeat the background”, bạn chọn Yes- nếu muốn hình được tự động giữ nguyên kích thước (có nghĩa là nếu hình nhỏ thì hình nền sẽ gồm tập hợp nhiều hình), hoặc nếu bạn muốn Yahoo Mash tự động phóng to hình lên để hình nền chỉ có một tấm duy nhất- lúc đó, bạn chọn No.
Lựa chọn này tương tự lựa chọn “Tile” trong giao diện cũ.(Nếu chọn Yes trong dòng “Repeat the background” thì bạn không cần chọn gì trong dòng “Background position” cả).
 |
Trước kia, nếu bạn không muốn đặt hình cho nền, bạn có thể chọn màu cho nền với lựa chọn “Background Color”. Bây giờ, nếu muốn làm như vậy, trong trang tạo mã CSS, dòng “TOP or MAIN background image URL”, bạn để trống, còn dòng “Background color: ex: 00158C”, hãy điền mã màu vào trong đó (chẳng hạn ffff00). Để tạo màu cho font chữ, bạn điền mã màu vào dòng “General text color” (chẳng hạn ff0000).
|
|
Muốn biết mã màu, bạn hãy nhấn nút “Color”, sau đó, click chuột lên màu bạn thích rồi ghi mã màu hiện ra trong dòng “#”.
 |
Ngoài ra, để can thiệp sâu hơn vào các module, trong trang thiết kế mã CSS, bạn hãy chuyển qua thẻ “Module Properties”. Tại đây, để đặt màu cho module, bạn hãy điền mã màu vào ô trống cạnh dòng “Modules background color” (chẳng hạn ffff00), và mã màu cho đường viền các khung của blog tại “Modules border color” (chẳng hạn ff0000).
Để chọn màu cho chữ, bạn điền mã màu vào dòng “Modules text color” (chẳng hạn ff0000). Ngoài ra, ̣để chọn kiểu đường viền (liên tục, đứt đoạn, chạy, nháy,...), bạn chọn một cái tương ứng trong dòng “Modules border's style” (chẳng hạn outset). Trong “Modules transparency (in %)” bạn điền số 50 để nó hiển thị đúng giá trị của màu.
|
|
|
|
 |
|
|
Cuối cùng, bạn nhấn “Click here to View” để lấy mã CSS. Sau đó, bạn copy nó rồi đưa vào trong khung “Style your profile”.
Chẳng hạn, bạn có đoạn mã ví dụ như bên dưới. Chắc chắn là với trang web hỗ trợ này, bạn có thể thiết kế được cho mình những mã CSS thật đẹp mà không cần biết gì về chúng cả.
/* Tu dong tao CSS code tai http://mashbabe.com */
/* CSS Code Generator at http://mashbabe.com */
body {background-image: url('http://www.clintonio.com/profile/nguyentuvuong/Yahoo/sig.jpg');background-repeat:repeat;background-position: top left;font-size: px;font-family: arial;background-color:#ffff00;color:#ff0000;}
.mod {background-image:url('');border-color:#ff0000;border-width:px;border-style:double;}
.mod .x1 {background:#ffff00;opacity:1;filter:alpha(opacity=100);display: block;}
.mod-content {color:#ff0000;font-size: px;}
 |
Còn tiếp
