2020-10-22 css画八边形等

使用属性cli-path。

直接上代码：需要li变成八边形，类似这种：

HTML：

<ul>
              <li v-for="(item,index) in designWords" :key="index" :class="{active2:index == nowIndex1}"  @click="tabsChange1(index)">
                {
  {item}}
              </li>
            </ul>

css：

主要是这个-webkit-clip-path:polygon()；允许裁剪块状元素。

li{
            clip-path: polygonpolygon(10px 0%, 125px 0%, 100% 10px, 100% 52px, 125px 100%, 10px 100%, 0% 52px, 0% 10px);
            -webkit-clip-path:polygon(10px 0%, 125px 0%, 100% 10px, 100% 52px, 125px 100%, 10