How to scale down the entire web page? _html/css_WEB-ITnose

I have a web page, the content of which is a picture and a button. I hope to determine the height of the picture and the height of the mobile device screen, and then reduce the entire web page proportionally so that the picture can be fully displayed on the screen. , how to achieve it?
It’s okay to directly set the width and height of the image. I just want to take a screenshot. If I directly set the width and height of the image, the screenshot will not be the area I selected.

Reply to the discussion (solution)

Use js to calculate the height and width of the browser and then use js to set the width of the image. Try the button style

Size all Try setting it to 100%

Just set the image as a percentage. . .

Doesn’t css have a zoom function? zoom

Just use percentages

Relative layout, use percentages to set the width and height

You have See the function used in the screenshot? There are four parameters, namely the starting abscissa, the starting ordinate, width and height. If you want to display the picture completely on the screen, first determine whether it is a wide picture or a tall picture. Because there is a crop button below the image, if it is a wide image, use width=100% in the label; if it is a tall image, use width=90% in the label. Then just adjust the four parameters passed to the screenshot function.