现在,整个东西都是红色的。
我该怎么做这个渐变,左边一半是红色,一半是蓝色?
这就是我在代码中要做的。
div {
width: 640px;
height: 340px;
background:
linear-gradient(45deg,
transparent,
transparent 7px,
red 7px,
red 7.5px,
transparent 7.5px,
transparent 10px),
linear-gradient(-45deg,
transparent,
transparent 7px,
red 7px,
red 7.5px,
transparent 7.5px,
transparent 10px);
background-size: 10px 10px;
}
<div></div>
3条答案
按热度按时间yrwegjxp1#
使用你的梯度配置内蒙板,然后考虑一个定期的背景为您的分离。我也优化了你的梯度配置:
jrcvhitl2#
您可以同时使用
repeating-linear-gradient
、background-size
、background-position
、background-repeat
和background-position
。所以你可以在不同的区域放置不同大小的渐变可能的示例:
eeq64g8w3#
在半块的顶部,我们将层放置在伪元素中,背景上有一个css过滤器。过滤器属性不同。在我们的例子中,我们应用了一个过滤器,它旋转色调调色板
backdrop-filter: hue-rotate(240deg)
,使红色变成蓝色。240deg
表示顺时针旋转240度。