css小技巧

1、css绘制条纹背景图

<template>
  <div class="test">
    <div class="one"></div>
  </div>
</template>
<script>
export default {
  name: 'test'
}
</script>
<style lang="less" scoped>
.test {
  width: 250px;
	height: 140px;
	background-color: #9C255D;
  .one{
    height: inherit;
    background: linear-gradient(rgba(255,249,225,.5) 50%,transparent 0);
    background-size: 56px 56px;    
  }
}
</style>

2、vue动态插入富文本，文件css样式无法对富文本生效
原因很简单： 插入的富文本就相当于插入的小组件，样式层级不一样，在父级html文档中，使用/deep/便能使样式在富文本中生效

3、使用外部字体样式
注意：很多第三方字体样式是有版权的，免费的通常有思源黑体、站酷字库（其中有几个是免费）
引用：

font.less

@charset "UTF-8";

@font-face {
  font-family: "zcool";
  src: url("./yuyang2.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

然后全局引用font.less文件