我试图使两个三角形组成一个矩形。然后，我想将内容放入每个三角形。我从这里关注上一个问题的答案：上一个问题。
我的问题是，如果没有足够width: 80vw的高度，我将无法获得矩形。然后，我不确定如何将内容放入after元素中，或者不确定这是否是设计此内容的最佳方法，因为我知道我会将内容放入三角形中。
有谁知道我该怎么做或有更好的解决方案？
#tierBoxSec {
position: relative;
height: auto;
width: 100%;
}
.box {
width: 80vw;
height: 200px;
background: radial-gradient(at top left, #FFF 49%, #b82222 50%, #b82222 100%);
}<section id="tierBoxSec">
<div class="box"></div>
</section>我做了一个更好的片段来说明如何使用线性渐变来做到这一点：
red 50%, blue 50%将每种颜色的“色标”设置为50％，这意味着它们将不会超过渐变区域的50％。例如，您可以通过执行类似的操作来创建不同的分界线red 25%, blue 25%。
#box {
width: 100px;
height: 100px;
}#box {
background: linear-gradient(45deg, red 50%, blue 50%);
}<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient -->
<body>
<div id="box">
</div>
</body>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句