css实现斜条纹背景
最近有个模块需求采用斜条纹背景 做标头背景 记录下实现代码
<template>
<div class="striped-background">
<span>货种</span>
<span>企业数</span>
<span>企业数</span>
<span>客户数</span>
</div>
</template>
<script>
export default {
name:'testDemo'
}
</script>
<style scoped>
.striped-background {
background: repeating-linear-gradient(
135deg,
#0b4ba1,
#0b4ba1 10px,
#0d57b0 10px,
#0d57b0 20px
);
color: #00faff;
font-size: 16px;
padding: 10px;
display: flex;
justify-content: space-around;
align-items: center;
text-align: center;
}
</style>
代码渲染效果
