Tôi đang sử dụng css sau để hiển thị một hình ảnh 661px x 343px:Làm một hình ảnh lớn nhỏ sử dụng CSS (Downscaling) kết quả trong hình ảnh mờ trong IE9, FF, nhưng tốt trong Chrome
width: 95px; height:auto;
Tôi có thấy rằng việc sử dụng CSS sau đây sẽ cung cấp cho các vết mờ cùng trong Chrome:
image-rendering:-webkit-optimize-contrast;
vì vậy, xóa làm cho trên hình ảnh rõ ràng hơn nhiều trong chrome, bất kỳ ý tưởng làm thế nào để sửa chữa các vấn đề đối với các trình duyệt khác?
Các hình ảnh đã được hiển thị trong định dạng lớn hơn trên cùng một trang như hình thu nhỏ, vì vậy tôi nghĩ nó sẽ là tốt hơn để tránh hình ảnh thêm bằng cách sử dụng css. Nhưng tôi đoán đó là giải pháp duy nhất cho vấn đề để thêm các hình ảnh đã thay đổi kích thước. –
Đáng buồn là Lawrence, nhưng sẽ dễ dàng hơn để hiển thị hình thu nhỏ và tiết kiệm băng thông và làm cho trang web nhanh hơn hiển thị hình ảnh lớn, trang web nhanh hơn = xếp hạng công cụ tìm kiếm tốt hơn = hỗ trợ tốt hơn cho điện thoại di động = quản trị viên hệ thống hạnh phúc :) – Neo
Exept rằng có rất nhiều lần khi điều này là mong muốn (để downscale một hình ảnh vào một khu vực nhỏ hơn), và stil không trả lời câu hỏi: làm thế nào để có được hình ảnh downsampled để hiển thị anti-aliased một cách chính xác và không được jaggy hoặc mờ. Và vì anh ấy đã hiển thị hình ảnh lớn hơn trên trang, nên câu trả lời của bạn tệ hơn cho hiệu suất trang cũng phải có ngón tay cái d/l, vì số lượng yêu cầu http mà trình duyệt phải quản lý gấp đôi. – Steve