dthnam90 Thành viên gắn bó lâu dài
Tổng số bài gửi : 137 Join date : 04/01/2011
| Tiêu đề: Kéo thanh trượt mà không di chuyển background của trang! Sat Jan 15, 2011 11:31 pm | |
| Mình lấy 1 ví dụ đơn giản chính là diễn đàn của chúng ta, khi các bạn kéo thanh trượt thì hình nền vẫn đứng yên, lúc trước khi mới học về web mình cũng từng đặt câu hỏi như vậy, giờ thì mình biết rùi (sau khi đọc các bài giảng của thầy cô trong khoa), mình thấy cũng hay hay nên post lên cho mấy you. Đây là 1 đoạn CSS định dạng background: các you xem code là biết liền hà: - Code:
-
<html> <head> <style> body { background-attachment:fixed; background-image:url("Đường dẫn đến file hình bạn muốn làm hình nền"); background-repeat:no-repeat; } </style> </head> <body> croll the page and see what happen <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br> croll the page and see what happen </body> </html> Cái quan trong là ở chỗ background-attachment, cái này theo mình biết thì có hai giá trị là "scrolled" và "fixed", nếu bạn chọn "scrolled" thì khi bạn kéo thanh trượt thì background sẽ di chuyển theo, còn nếu bạn chọn "fixed" thì ngược lại. Nếu you nào có cách khác thì post lên nha, vì đây chỉ là 1 cách trong nhiều cách mà thôi!! Hihihi!!!!!! | |
|
RikoSairenji Thành viên mới
Tổng số bài gửi : 5 Join date : 10/01/2011
| Tiêu đề: Re: Kéo thanh trượt mà không di chuyển background của trang! Wed Jan 19, 2011 4:04 pm | |
| Bạn có thể viết tắt lại đối với background như sau :
background:#FFFFFF url(Link) repeat fixed top center;
#FFFFFF : là mã màu của nền trang, thông thường khi hình nền chưa kịp load vì một lý do nào đó (mạng chậm, lag...) thì nền sẽ mang màu quy định này. Bạn có thể thay đổi mã màu này theo ý muốn, nhưng lời khuyên được đưa ra là nên lấy màu tương tự với màu của ảnh làm hình nền. Ngoài ra thay vì dùng mã màu chúng ta có thể sử dụng chữ transparent để thay thế cho #FFFFFF.
url(Link) : quy định link hình sẽ được làm hình nền. Có thể thay đổi Link bằng link hình mà bạn muốn.
repeat : quy định tính lặp hay không lặp của hình. Khi hình làm nền nhỏ hơn màn hình thì mặc định nó sẽ được lặp cả về chiều ngang và chiều dọc để tràn hết màn hình. Có thể thay thế repeat bằng các giá trị khác : no-repeat : không lặp lại repeat-x : lặp lại theo chiều ngang repeat-y : lặp lại theo chiều dọc
fixed : quy định tính cố định hình khi di chuột cuộn trang. Có thể thay fixed bằng scroll nhưng vì scroll là mặc định nên không cần ghi scroll mà chỉ cần đơn giản xóa đi fixed cũng được.
top center : quy định hình sẽ được chèn ở vị trí nào của blog. Thay đổi top center bằng một trong những kiểu sau cho đến khi bạn thấy đẹp và vừa ý : top left top center top right center left center center center right bottom left bottom center bottom right
| |
|