媒体屏幕 css 未正确呈现图像

Question

我有一个博客页面 KW-Masterointi，我还在其中添加文本之间的图像。出于某种原因，如果我在 HTML 中输入图像尺寸，则图像无法在移动视图中正确显示。我在我的 css 中将图像最大值设置为 100%，但只有当我从 HTML 代码中删除图像尺寸时，图像才会正确显示。

目前我有所有图片，除了一张没有尺寸。第 299 行的尺寸为 FGx.jpg 的一张图片。当我在移动视图中查看页面时，这张图片看起来很有趣。所有其他的都正确渲染。

我的 css 中有东西覆盖了 {max with 100%}，但我一直无法弄清楚它是什么。

非常感谢任何帮助。 谢谢 金

Answer 1

您需要在 CSS 中的样式末尾使用 !important 来覆盖内联样式。

例）

.container { 
          width: 100% !important;
          height: auto;
     }

高度：自动；将确保您的图像在调整为较小的屏幕时不会失真。

Answer 2

因为您在 img 标签中以像素为单位明确定义了图像的宽度和高度，所以这就是为什么没有其他样式适用于该元素的原因。 通过定义明确的宽度和高度，响应性将不会作用于您的图像。