问题
I am a new developer and trying to make a website for a client using HTML & CSS. The webpages have many images and i have defined all the image widths in percentage to make them responsive. The web page looks great on both laptop and mobile.
However, when i browser zoom the webpage on browsers (including chrome (in windows7) or mobile) then the text and other areas are getting zoomed, but the images continue to retain their sizes. This remains true for images inside as well as outside the container. All widths are in percentages, including that of the container.
If i change the widths to pixels then they are getting zoomed but then they lose their responsinveness. I am badly stuck with this seemingly trivial problem. The images in question have finer details and the user might like to zoom the images on their phones for better appreciation of details.
To sum up, browser zoom is rendered ineffective if the image width is defined in percentage. For example, if the image has the width of 50%, then it continues to occupy half of the screen irrespective of the amount of browser zoom.
来源:https://stackoverflow.com/questions/51455182/image-size-not-increasing-on-browser-zoom