0

我试图解决我的问题,但不幸的是我仍然没有找到正确的解决方案。

我想要的只是在 Column#1 的左侧有白色背景,在 Column#2 的右侧有灰色背景。

但是我在 Column 选项中找不到所需的属性(而且我不确定是否有任何属性。

我附上了我想做的手绘。

谢谢各位,你们是最棒的。在此处输入图像描述

4

2 回答 2

2

按着这些次序:

  1. 将部分的背景设置为渐变。
  2. 选择白色作为第一种颜色
  3. 选择灰色作为您的第二种颜色
  4. 设置渐变类型 = 线性
  5. 将天使设置为 90
  6. 现在根据自己的喜好调整位置(推荐 15+)
  7. 单击下面的链接以查看我得到的结果。

你会看到这样的东西

于 2018-06-08T18:02:23.857 回答
0

您可以通过使用灰色背景的伪元素轻松实现这一点。在你的身体上设置一个白色背景。

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>

于 2018-06-08T09:07:06.903 回答