element栅格自定义等分

由于element栅格组件是 24 分栏，所以当我们需要5、7、9等分时，就不好实现

<template>
  <el-row>
    <el-col :span="24">1</el-col>
  </el-row>
  <el-row>
    <el-col :span="12">2</el-col>
    <el-col :span="12">2</el-col>
  </el-row>
</template>

解决方式：自定义等分
例子：满足 md 时4等分，满足 lg 时5等分

<template>
  <el-row>
    <el-col :md="6" :lg="{ span: '5-5' }"></el-col>
  </el-row>
</template>

<style>
  // 当我们需要适配时，自定义等分一定要加上媒体查询
  @media only screen and (width >= 1200px) {
    .el-col-lg-5-5 {
      max-width: 20%;
    }
  }
</style>

// scoped中需要使用深度选择器
<style lang="scss" scoped>
 @media only screen and (width >= 1200px) {
    :deep(.el-col-lg-5-5) {
      max-width: 20%;
    }
 }
<style>