使图像调整大小像背景图像

Question

I been looking everywhere, and I can recall I seen a solution to this before, but no luck in finding it back. Is it possible to make images without a div around it, or being used as background, nevertheless scale like those?

Example:

<div class="container">
    <img src="example-1.jpg" class="50-100">
    <img src="example-1.jpg" class="50-100">
    <img src="example-1.jpg" class="25-50">
    <img src="example-1.jpg" class="75-50">
</div>

How would I have to style the above images, to make them blocks of 50% width and 100% height(of width container, like one would do with padding-bottom for an image with backgound) for the first two and width: 25%, height 50% for the third and 75%/50% for the last? This in such way the images are blocks, with the image itself cropped to fill the size.

Hope this makes sense...

Answer 1

İ'm not sure, but you could use:

width: 50%;
height: 100%;