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

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，这将覆盖您的样式 sheet。

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

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

Answer 3

我做了以下操作，并设法实现了图像的全宽.. 1. Row -> Extend section and Content 全宽 2.图片本身->样式->宽度->设置VW为100.

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

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

How to make an image stretch in different screens

css

wordpress

elementor