img { max-width: 100%; }
It tells the browser to automatically resize images to fit inside their container elements (should the container be narrower than the image).
Since it is a CSS rule it should be put somewhere in your CSS file (or inside a style element in your HTML document).
Responsive (or adaptive) images is only one part of the responsive web design puzzle. But it is an important part and one that at the moment lacks a standardized solution. For some time now there has been a lot of discussions going on about finding ways to deliver differently sized images to different devices using different screen sizes and connection speeds.
A few proposals has been put forward on how responsive images could be added to the HTML5 specification. For instance adding a <picture> element similar to the already existing <video> element. Another idea is to add a set attribute to the <img> element. There are also those taking the pragmatic approach and use a combination of client and server side trickery in order to achieve the desired outcome with what is available today.
But until a simple solution supported by all major browsers is in place, maybe the easiest thing to do is to select “progressive” when saving your images, in high resolution, and then use img { max-width: 100%; } in your CSS?