制作一张图片以符合它的父级尺寸 [英] Make an image to fit it's parent dimensions

问题描述

我有一些尺寸很大的照片，我想将它们设置为父级的尺寸。如果有一次父级维度为1200x800，所以我想将照片尺寸设置为1200x800，但我也希望看到整个图像。如果我的父级维度是500x300，那么我希望图片为500x300等等。

这甚至有可能吗？我想缩小图像或根据其父母的维度展开图像。

谢谢！

解决方案

你想要的css属性是 max-width ：

Css

  img {
最大宽度：100％; 
} 
  

您可以在图片中添加一个容器并将 overflow：hidden 以防止图像变得比定义的宽度/高度大。

I have some photos which are big sized, and I would like to set them to the Parent's dimension size. if one time the parent dimension is 1200x800 so I would like to set the photo dimensions to 1200x800, but also I would like to see the whole image. If my parent dimension is 500x300 so I would like the image to be 500x300 and so on.

Is this even possible? I want to shrink the image or expand it according to it's parent's dimension.

Thanks!

解决方案

The css property that you want is max-width :

Css

img {
    max-width:100%;
}

You could add a container around your image and set overflow:hidden to prevent images to get bigger than the defined width/height.

这篇关于制作一张图片以符合它的父级尺寸的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！