Elementor 不同的背景颜色

Question

我在尝试解决我的问题时伤透了脑筋，但不幸的是我仍然没有找到正确的解决方案。

我只想要第 1 列左侧的白色背景和第 2 列右侧的灰色背景。

但我在Column选项中找不到需要的属性（我不确定是否有。

我附上了我想做的手绘图。

谢谢你们，你们是最棒的。

Answer 1

您可以通过对灰色背景使用 pseudo-element 来轻松实现此目的。在你的 body 上设置白色背景。

body {
    background: #fff;
    }
    main {
    position: relative;
    height: 250px;
    }
    main::after {
    content: '';
    background: grey;
    position: absolute;
    width: 35%;
    height: 100%;
    right: 0;
    top: 0;
    }
    main .container {
    z-index: 1;
    position: relative;
    }

<body>
    <header>
    
    </header>
    <main>
      <div class="container">
        <div class="column1">
        
        </div>
        <div class="column2">
        
        </div>
      </div>
    </main>
    <footer>
    
    </footer>
</body>

Answer 2

按照以下步骤操作：

将分区的背景设置为渐变。
Select 白色作为第一种颜色
Select 灰色作为你的第二颜色
设置渐变类型 = 线性
将角度设置为 90
现在根据自己的喜好调整位置（推荐15+）
点击下方的link查看我得到的结果

You will see something like this

Elementor 不同的背景颜色

Elementor Different Background Colors

css

wordpress

elementor