<template><section class="demo-tag"><h1 class="demo-title">tag</h1><example-block title="基础用法">
                <div class="tags-container">
  <zan-tag>返现</zan-tag>
  <zan-tag :plain="true">返现</zan-tag>
</div>
<div class="tags-container">
  <zan-tag type="danger">返现</zan-tag>
  <zan-tag type="danger">四字标签</zan-tag>
  <zan-tag type="danger">一</zan-tag>
</div>

              </example-block><example-block title="高级用法">
                <div class="tags-container">
  <zan-tag type="danger">返现</zan-tag>
  <zan-tag :plain="true" type="danger">返现</zan-tag>
</div>
<div class="tags-container">
  <zan-tag type="primary">返现</zan-tag>
  <zan-tag :plain="true" type="primary">返现</zan-tag>
</div>
<div class="tags-container">
  <zan-tag type="success">返现</zan-tag>
  <zan-tag :plain="true" type="success">返现</zan-tag>
</div>
<div class="tags-container">
  <zan-tag type="danger" :mark="true">返现</zan-tag>
</div>

              </example-block></section></template>
<style>
.tags-container {
  padding: 5px 15px;

  .zan-tag + .zan-tag {
    margin-left: 10px;
  }
}
</style>
<script>
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);</script>