css - 如何使图像在不同的屏幕上拉伸

Question

我有一个带有 ID 的分隔线#divider。我使用 Elementor 来编辑我的 wordpress 网站并使用 CSS 修复内容。它在某些屏幕上看起来不错，但我只是在我的笔记本电脑上检查了它，它不会延伸到边缘。它的宽度为 1278 像素。

此外，它似乎以某种方式推动了另一个文本列。在 elementor 上，它看起来很好。

Answer 1

我检查了您的网站，当我通过开发人员工具尝试以下代码时，它似乎运行良好：

.elementor-image img {
    width: 100%;
}

Answer 2

问题就在这里

<img width="1400" height="75" src="http://berko.createak.co.il/wp-content/uploads/2017/05/Divider-2.png" class="attachment-full size-full" alt="" srcset="http://berko.createak.co.il/wp-content/uploads/2017/05/Divider-2.png 1400w, http://berko.createak.co.il/wp-content/uploads/2017/05/Divider-2-300x16.png 300w, http://berko.createak.co.il/wp-content/uploads/2017/05/Divider-2-768x41.png 768w, http://berko.createak.co.il/wp-content/uploads/2017/05/Divider-2-1024x55.png 1024w">

您的图像宽度设置为 1400，这将覆盖样式表中的内容。

您可以删除 width="1400" 或者如果不可能使用

.elementor-image img {
    width: 100%!important;
}

Answer 3

我做了以下操作，我设法实现了图像的全宽.. 1. 行 -> 扩展部分和内容全宽 2. 图像本身 -> 样式 -> 宽度 -> 将 VW 设置为 100。

这就是我所做的一切，它奏效了。