定位背景图像

带有背景图片的部分示例
带有背景图像的典型部分/容器

使图像适合您的设计 #

图片是任何网站的关键元素。这些图像不仅可以用作元素本身(使用图像小部件),还可以用作背景,或用作其他元素的组成部分。然而,有时很难让您的图像适合您的设计。下面概述的基本概念应该可以帮助您基本了解 Elementor 如何处理图像以及如何将它们最好地融入您的设计中。

使图像适合您的设计 #

将要放置图像的元素想象成相框。在大多数情况下,图像不会完全适合框架。Elementor 为您提供了多个选项,可帮助您确定图像的显示方式或“适合”框架的方式。有四个主要选项共同作用以将图像“适合”框架。

位置——如果图像大于元素,则位置决定图像的哪一部分可见。想象一下,你正坐在一栋窗户很小的房子里,外面挂着一幅大壁画。位置将四处移动壁画,确定您可以看到它的哪一部分。 

如果图像小于元素,position 确定图像在元素中的位置。

位置选项包括:居中、居左、居右、居上、居左、居右、居中、居中、居左、居右和自定义。选择自定义将打开滑块,允许您更改图像的 x、y 位置以获得更精确的放置。

背景与完整图像一起设置在右上角。
右边是一张图片。在左侧,这是图像显示为背景并定位为左上角的方式。
用作部分背景的小图像。
用作背景的小图像。位置设置为中心中心,重复设置为不重复。

重复——默认情况下,如果图像对于元素来说太小,图像将被重复以占据整个元素。 

  • 不重复意味着图像只会出现一次
  • 重复 X – 表示图像将出现在一行中
  • 重复 Y表示图像将沿列重复

大小——尽管它的名字,这个属性更多地与图像如何适应元素有关,而不是图像的大小(尽管两者是相关的):

  • 封面——图像将填满元素的整个空间。如果图像太大,它会自动裁剪图像。如果图像太小,它将使用较大版本的图像。
  • 包含– 整个图像将适合元素 – 保持相同的比例。这通常会导致图像周围出现空白的“信箱效应”。    
  • 自定义– 一个滑块将允许您设置图像的宽度(高度自动随宽度缩放。

注意:正如您可以用足够的力将方形钉子放入圆孔中一样,您可以使用这些选项将几乎任何图像放入您的设计中,但如果您尝试获得最适合您设计的图像,您将获得最佳结果. 例如,如果您有一个非常宽阔的空间,请考虑使用横向图像而不是尝试在空间中放置纵向图像。  

下一步 #

要充分利用Elementor,请查看Elementor 学院和我们的YouTube 频道以获取有用的学习资源。如果您遇到任何问题或需要帮助,请联系我们的支持中心

Powered by BetterDocs

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

Scroll to Top