<分区>
<分区>
我正在尝试显示图像,但遇到了一些问题。
我的图片尺寸不同,我希望了解避免分辨率问题和布局空间问题的最佳方法。
你看我有更大/更小的图片,我需要 400 x 360 像素的图片...有些会被拉长,有些会变得怪异。(尝试将一张大图片缩小成一张小图片)
如果您获得不同尺寸但在网站布局上有固定空间的图像,那么处理图像的最佳方式是什么?
我尝试了可能的解决方案,但它仍然延伸......
#divDisplayingImg img{
width:500px;
height:360px;
border:solid medium white;
border-radius:5px;
border-width:8px;
background-size: cover;
overflow:hidden;
}
最佳答案
我不太确定您所说的“图像变得很奇怪”。如果你有不同比例的原始图像,那么,为了防止失真,你应该使用
最大宽度:450px;最大高度:360px;
它将保留原始比例并有助于避免可能的失真。
关于html - 图像 - CSS、HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19252637/
相关文章:
css - 宽度 : 100%; height: auto dont work properly
html - span inside anchor 不起作用,有什么想法吗?
javascript - 如何在 css 中将 <ul> 放在图像周围
javascript - 正则表达式以像素为单位转换所有 rem-calc
python - 如何使用OpenCV检测具有相同颜色的像素区域
javascript - (Javascript) 使用文件路径创建一个 File 对象
Javascript : store an image in the browser, 然后在 Markdown 中使用它