title | type | tags | cover | dateModified | |
---|---|---|---|---|---|
Stripes background pattern |
snippet |
|
jars-on-shelf |
2021-01-11 09:51:43 +0200 |
Creates a stripes background pattern.
- Use
background-color
to set a white background. - Use
background-image
with aradial-gradient()
value to create a vertical stripe. - Use
background-size
to specify the pattern's size. - Note: The fixed
height
andwidth
of the element is for demonstration purposes only.
<div class="stripes"></div>
.stripes {
width: 240px;
height: 240px;
background-color: #fff;
background-image: linear-gradient(90deg, transparent 50%, #000 50%);
background-size: 60px 60px;
background-repeat: repeat;
}