How would I make a image scale with the browser or screen resolution with css

问题

I am working on a page for my mybb forum and I added some images and I want them to scale with the screen resolution so if I have a 17" it looks the same as someone with a 19" screen. Because right now the images just look all messed up. Here is the page that I am working on. http://crescentgaming.com/forums/test.php

回答1:

In your CSS, use percents.

HTML

<img src="/folder/whatever.jpg">

CSS

img{
  width: 45%;
}

Of course, you could switch it to whatever percent you want. There is a more complicated way with JavaScript, but this usually works (for me).

回答2:

try the % instead of the px unit or use @media and specify dimensions for any resolution @media

CSS @media for standard devices

I hope that will help PS: under the @media you can specify changes only for certain elements, ID or classes so you don't have to redesign the hole page (as far as I know) so don't be shy to give it a try :)

来源：https://stackoverflow.com/questions/16369661/how-would-i-make-a-image-scale-with-the-browser-or-screen-resolution-with-css