html - 如何增加图像大小但不增加其所在容器的大小

标签 html css

所以我的问题是我正在尝试减少网站标题中浪费的黑色空间,现在标题的右下角有一个图像,如果我将其尺寸增加 100 像素,则需要完美地增加了空间,但是当我这样做时,它增加了标题的大小以适合图像,但空白空间刚刚变大了相同的数量。

我怎样才能简单地增加图像在容器中占用的空间量?

使用 CSS 添加大小是否会覆盖 HTML 并在不增加标题大小的情况下使图像变大?请帮忙,我是新手。

最佳答案

如果增加图像的大小也会增加容器的大小:检查外部元素上的padding

使用 element{ padding:0; 在你的 CSS 中来防止这种情况。

您不应该用 CSS“覆盖 HTML”。所有样式都应使用 CSS 完成。如果您使用 CSS 设置容器的尺寸,如果高度设置为 100%,图像将填满最大空间。如果容器与图像的宽高比不同并且图像占据容器的 100% 高度和宽度,则会发生失真。

关于html - 如何增加图像大小但不增加其所在容器的大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29356503/

相关文章:

javascript - 无法让这个简单的脚本正确运行

html - 使用 css 进行星级评定 - 如何将文本值与图标对齐,以便它们具有相同的高度和大小

javascript - 为什么对齐元素不沿交叉轴居中?

html - 如何卡住页面的标题

javascript - 我的谷歌地图 DIV 位于其他所有内容之上 - 不明白为什么

javascript - 如何访问javascript变量的函数

javascript - 在 JavaScript 中删除小数以获得自动结果

html - 修复具有两个固定位置父项的 leafletjs map div

javascript - 华丽的弹出窗口 : Why doesn't border radius work on the image and how can i make it work?

javascript - JQuery - 使用 'this' 通过一个函数显示和隐藏 DIV