khi không sử dụng CSS sprites?

Question

Tôi muốn biết khi nào không sử dụng CSS sprites. CSS sprites hoạt động tốt, nhưng có bất kỳ dịp nào khi chúng tạo ra rất nhiều đau đầu không?

Answer 1

Tính bảo trì của trang web của bạn sẽ bị sử dụng chúng. Chỉ kết hợp các hình ảnh thuộc cùng một đơn vị lôgic và không được cập nhật riêng biệt. Giữ hình ảnh có khả năng thay đổi riêng biệt để bắt đầu.

Answer 2

Chúng tôi đã có một thời gian khó khăn khi chúng tôi muốn định vị hình ảnh động.

background-image: url(../images/a.gif); 
background-repeat: no-repeat; 
background-position: left bottom; 

Điều này là khó khăn (nếu không thể) để thực hiện bằng cách sử dụng sprite.

Answer 3

Các tiện ích CSS hoạt động không tốt cho <input type="text"> nơi người dùng có thể nhập nhiều hơn so với hộp phù hợp, khi nền sau đó cuộn trong một số phiên bản của IE.

Chúng cũng hoạt động không tốt nếu bạn muốn lặp lại mẫu.

Answer 4

Giống như mọi thứ, có những lúc nó hữu ích và có những lúc nó có hại.

Nhiều nhà phát triển muốn sử dụng CSS sprites vì ​​nó tiết kiệm thời gian yêu cầu - trình duyệt đưa ra một yêu cầu, tải hình ảnh và tất cả các sprites khác nhau được lưu trữ tự động và nhanh chóng.

Vậy làm thế nào nó có thể bị tổn thương?

Vì kích thước tải xuống! = Kích thước bộ nhớ.

PNG hoặc GIF đó chỉ có 10kb thực sự có thể lớn hơn nhiều, kích thước lớn hơn một khi trình duyệt tải nó trong bộ nhớ. Vấn đề là trong khi một cái gì đó như GIF sẽ nén các vùng màu sắc rắn, trình duyệt mở rộng nó ra một bitmap, nơi tất cả các hình ảnh có kích thước bằng nhau sử dụng bộ nhớ bằng nhau.

Và nó tải một bitmap mới mỗi khi bạn sử dụng hình ảnh đó ở đâu đó.

Vì vậy, mọi thứ đều ở mức vừa phải.

Xem: http://blog.mozilla.com/webdev/2009/06/22/use-sprites-wisely/ để biết thêm thông tin.

Answer 5

Chúng có thể gây đau đầu cho người dùng của bạn nếu họ muốn tải xuống một hình ảnh cụ thể. Trước tiên, họ sẽ không nhận được tùy chọn "Lưu hình ảnh dưới dạng". Nếu họ tìm ra để sử dụng "Xem hình nền", họ sẽ nhận được một hình ảnh lớn với nhiều hình ảnh khác trên đó.

Đây là lý do tại sao sprites được lưu tốt nhất cho "tiện ích" (tức là nút) hoặc hình ảnh thiết kế.

Answer 6

Sử dụng ảnh lớn hơn có thể là nhức đầu ... Khi ảnh được kết hợp với kích thước nhỏ hơn và các bức ảnh lân cận chỉ cách nhau 1 hoặc 2 px thì CSS sprites có thể là một giải pháp tốt. Trong trường hợp của chúng tôi, http://www.nbhuntop.com, chúng tôi chỉ sử dụng nó cho các thành phần menu bao gồm: Trang chủ, Giới thiệu, Sản phẩm. Và tất cả các bức ảnh ở định dạng gif, và không ai sẽ tải các bức ảnh này cả.

Answer 7

Sprites không bao giờ được sử dụng khi kích thước của hình ảnh rất khác nhau.
Bởi vì trong trường hợp đó kích thước của sprite là khá lớn.
Gần đây tôi đã chuyển đổi hình ảnh 3,5MB thành một ảnh và kích thước chụp lên tới 17MB!