html - Downscaling page for retina without loss of quality (blurry on Chrome) -


i noticed when using css resize lossless png file (for normal/retina purposes), on latest chrome, (54.x @ time of writing), result blurry. blurry

when adding following rule img tags

img {    image-rendering: -webkit-optimize-contrast; } 

then result better:

crispier

the problem : safari's engine renders quite differently (much worse)

safari

my questions

  1. how can resize lossless png without having quality problems?
  2. if resizing causes issues, what's alternative handle higher-dpi monitors? (support https://www.sitepoint.com/how-to-build-responsive-images-with-srcset/ ?)

you use @media css change url of image. using image editing software change size of images browser doesn't have handle scaling.


Comments

Popular posts from this blog

asynchronous - C# WinSCP .NET assembly: How to upload multiple files asynchronously -

aws api gateway - SerializationException in posting new Records via Dynamodb Proxy Service in API -

asp.net - Problems sending emails from forum -