Cách sử dụng Sprite Image
- November 12, 2009
- 29 comments
Trong bài nút ba trạng thái tôi đã giới thiệu đến các bạn về Sprite Image và nó có thể tiết kiệm được tài nguyên máy chủ như thế nào. Trong bài này chúng ta sẽ tìm hiểu sâu hơn về Sprite Image và áp dụng nó ở phạm vi lớn hơn và không chỉ ở mức dạng nút. Về mặt lý thuyết, một trang web có thể chỉ cần duy nhất một tấm hình làm hình nền.
Thực vậy, nếu ai đó mẫn cán có thể gom tất cả các hình vào làm một và sử dụng background-position để cho hiển thị các thành phần mà không cần sử dụng nhiều hình. Tuy nhiên, nó cũng có một hạn chế là bạn không thể sử dụng sprite image để tạo hình nền. Uhhh, thực ra, cũng có thể nhưng rắc rối hơn nhiều khi bạn muốn repeat-x hoặc repeat-y với Sprite Image. Tuy nhiên trong bài này bạn cũng sẽ học được cách sử dụng Sprite Image và hy vọng sẽ tăng tính hiệu quả trang web của bạn.
Thời lượng:19:48
Link Download định dạng .avi chất lượng cao: MegaUpload, MediaFire
File Size: 55.8 MB
« Absolute Position trong thiết kế giao diện
10 lý do bạn nên sử dụng WordPress »
bai nay rat hay,neu de y se de hieu thoi.Cam on anh Demon warlock de demo cho a e xem.
a,ma anh co the cho e bit dia chi e-mail k,co gi de tieu de xin y kien cua a.e rat me viet web
không có file hình à bạn?
anh có thể chỉ em cách làm một trang php dùng để download một file nào đó không anh. Chỉ là một demo cơ bản cũng được, cám ơn anh trước nha.
Em thấy bài cơ bản thì cũng giống bài 3 trạng thái mà ,sao thấy a nói bài 3 trạng thái phải load 4 tấm hình . Em thấy 4 tấm đó giống nhau nên chỉ phải load 1 lần thôi , mấy cái top center , center center ,center bot thì cũng là background-position đúng k a ?
Nhưng mà làm theo cách này thì có thể làm được với nhiều tấm hình hơn .
Thank a đã chia sẻ .
Cái này hay. Mình mò mãi mà chẳng ra. Giờ mới phát hiện
Cảm ơn bạn nhé.
Bạn ơi nếu mình không dùng thể div mà chỉ dùng
Như thế có chạy dc không mong bạn dúp cảm ơn nhiều
Nếu được có thể gửi mail cho mình không.
Cái này sử dụng nhưng ko sử lý đc sự kiện Selected anh ơi
Nếu em muốn có trạng thái selected thì em phải làm dạng nút 3 trạng thái với link ở đầu bài này.
anh viet wed bang phan mem gi vay? em nhin thay anh viet phan mem do that la hay do!
Thanks anh về bài viết, đang lúc cần ^^
Hello warlock,có chơi dotA ko
) cũng có con warlock đó , nhưng cùi hơn,thôi vào vấn đề chính nào,anh cho em hỏi có tutorial nào nói về phối màu ko,như anh ấy bấm màu mà không cần nhớ màu…???
Hey^ anh đi mần wa lóc:D TUT của anh hay wa’ . Cảm ơn a rất nhiều
Bài nào cũng Chuẩn ko cần chỉnh
http://css.me.zdn.vn/images/zme_norepeat_1.04.png
Zing me , 1 file ảnh !
thấy anh nói tiếng Anh chuẩn quá. hay anh mở một website dạy phát âm tiếng Anh đi. Em ủng hộ cả hai tay
Anh DW có thể hướng dẫn cách chèn mấy cái menu loại này vào WP đc ko? Định làm mấy cái này mà vắt cả óc ko biết sao chèn
xin chào bác Demon Warlock em cũng rất thích học design web và cũng đã xem các tut của bác! Những bài viết của bác rất hay và hữu ích nữa! em định theo web nhưng học hành cũng không khá cho lắm, photoshop và flash cũng rất kém, nói chung là nhiều người như vậy! mong bác cho một lời khuyên nhé!
Cảm ơn bạn rất nhiều.
Dưới đây là một số địa chỉ (Tài liệu + Video) rất hay về PHP, học hết trong này là bạn có thể trở thành pro PHP Designer rồi.
http://tutorial.phpvn.org/
http://thuvienit.com/forum_posts.asp?TID=8452&title=video-hoc-php-mysql-tieng-viet-cua-dai-hoc-tu-nhien-dlink.html
Đâu phải cái gì cũng tìm được đúng với yêu câu đâu. Mình download nhiều rùi nhưng toàn là tài liệu không hay và khó học nữa. Mình mới học web nên không biết gì hết, lên lớp thầy dạy phần lớn là “Phát triển ứng dụng web” thôi. Nên khó lắm. Bạn có tài liệu gì hay gỡi cho minh với. Cám ơn trước nhé, không lần sau không có cơ hội.
Bạn không biết Google dùng để làm gì ah. Tài liệu PHP rất nhiều, chỉ sợ bạn không học được thôi. Cái phần quảng cáo (có beeline) học Javascript bạn sẽ làm được…
Bác DW có tài liệu học PHP không cho em một ít. Em đang học ASP.NET nhưng cũng muốn học PHP, nhưng tài liệu ít quá, và không hay nữa. Mong bác DW cho một ít
Bác DW ơi!!!! Em thấy ở trang nay: http://www17.nhac.vui.vn/Music/#Play,1574 phần quãng cáo ấy(có beeline). Làm thế nào ấy nhi???
Sao nó lại chạy theo màn hình được vậy nhỉ? Bác có thể giúp không??? em đang học web.
Giao diện lần này cũng là 2 cột thôi. Về cơ bản thì cũng giống như các tut trước nhưng có phần đơn giản hơn vì chủ yếu là tập trung vào WordPress và PHP chứ không phải là HTML và CSS nữa.
Về giao diện 3 cột anh đã có video hướng dẫn rồi mà? không lẽ em không làm được sao?
Cắt ra HTML & CSS
Em ko biết cái TUT này của bác có giống những cái TUT trước đây ko
nhưng em muốn bác xuất TUT này trước đi
nếu làm TUT này bác làm layout dạng 3 cột đi
VN hay làm web loại đó mà
Bác NickB nói khó hiểu quá
có thể nói rõ hơn ko nhỉ
hic
thấy Bác nói có ý định bàn với Bác DW làm TUT mà mãi chưa thấy
Lâu lắm mới thấy bác quay trở lại trang web. Mọi thứ vẫn ổn chứ bác? Tôi vẫn đang mong từng ngày tut của bác đấy
Ha ha, mới phát hiện ra là mình cũng làm tay = photoshop. Chắc từ h cứ làm theo cách củ rồi vào spiteme ghép lại cho tiện. Nhưng các bạn chú ý lúc spriteme đưa ra code CSS chỉ tiết kiệm dc dung lượng ảnh do gộp lại chứ request thì vẫn như bình thường. 1 cách để khắc phục là bạn tạo ra 1 class riêng set background cho nó. Với mỗi tag với id sử dụng chỉ set backround-position thôi. Trong code HTMl có thể khai cả class và id. Đó là cách kết hợp tốt nhất vừa thủ công vừa tự động
Dạo này khá bận ko vào dc Izweb ko ngờ DW vẫn hoạt động tốt quá !
Hay quá. Trang spriteme.org rất hữu ích. Trước em toàn phải làm thủ công. Bây giờ có cái này tiện quá