响应式解释:
响应式页面就是随着设备属性(如宽高)的变化,网页也随着变化。在Elementor中响应式适配的端口一般分为两个或者三个(电脑端、手机端,也可能有平板端)。
在响应式设计中,页面上的板块要适配不同设备大小的显示,需要分别在设备上设置,比如:文字大小,元素边距(margin)和填充(padding)等。
响应式编辑步骤:
- 选择需要设置的区块块、列、小部件或者元素,然后Elementor菜单栏左侧找到下图按钮进行切换设置
- 点击设备图标进行设置不同的值或属性内容
控制响应式背景或边框:
Elementor中的背景图像是自动响应设备的,但是您还可以控制每个设备的更多配置。
背景图像:如果需要,您可以为每个设备选择不同的背景图像,可以设置不同大小版本的相同图像,或完全不同的图像。
背景图像显示选项:您可以为每个设备选择不同的图像位置、附件、重复和大小。通过这种方式,您可以更好地控制在不同大小的设备上显示图像的哪个区域。
元素在不同设备的可见性:
有时候我们不想在手机端显示太多内容,这时候就需要单独在手机端对某个元素进行隐藏操作,那么在Elementor编辑器里面是怎么设置的呢?
下面是设置步骤:
- 在Elementor左侧的菜单中,转到:高级设置——响应
- 根据需求,来设置元素在不同设备的可见性,如:隐藏在桌面上、在平板电脑上隐藏、隐藏在手机。
设备预览:
通过单击面板底部相应的图标在桌面、移动或平板电脑视图之间切换。


