biaoqian.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <div id="biaoqian">
  3. <el-row>
  4. <el-col :span="24">
  5. <ul>
  6. <li>
  7. <el-link href="#" style="color:#ffffff;background-color:#22529a">
  8. <el-image :src="biaoqianurl" style="width:30px;height:22px;margin: 17px 0 -2px 0;"></el-image>
  9. 标签栏
  10. </el-link>
  11. </li>
  12. <li v-for="(item,index) in biaoQian" :key="index">
  13. <el-link :underline="false" href="#">
  14. {{item.title}}
  15. </el-link>
  16. </li>
  17. </ul>
  18. </el-col>
  19. </el-row>
  20. </div>
  21. </template>
  22. <script>
  23. export default {
  24. name: 'biaoqian',
  25. props: {
  26. biaoQian: null,
  27. },
  28. components: {},
  29. data: () => ({
  30. biaoqianurl: require('../../../assets/detail-biaoqian.jpg'),
  31. }),
  32. created() { },
  33. computed: {},
  34. methods: {},
  35. };
  36. </script>
  37. <style lang="less" scoped>
  38. ul {
  39. padding: 0;
  40. list-style: none;
  41. margin: 0;
  42. background-color: #ffffff;
  43. font-size: 22px;
  44. text-align: center;
  45. line-height: 60px;
  46. height: 364px;
  47. }
  48. li {
  49. border-bottom: 1px dotted #215496;
  50. }
  51. /deep/.el-link {
  52. text-decoration: none;
  53. height: 60px;
  54. width: 240px;
  55. display: block;
  56. color: #22529a;
  57. font-size: 22px;
  58. }
  59. </style>