<template>
  <div class="train-banner">
    <div class="train-banner-content">
      <ul>
        <router-link :to="{path: '/artTrainDetail/' + list.id}" tag="li" v-for="list in classList" :key="list.id">{{list.name}}</router-link>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Banner',
  props: {
    classList: Array
  }
}
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.train-banner
  width 100%
  min-width 1200px
  background url("../../../assets/images/train-banner.png") no-repeat center
  background-size 100% 100%
  .train-banner-content
    width 1200px
    margin 0 auto
    ul
      li
        width: 200px
        height: 45px
        line-height 45px
        text-align center
        background #01a9f8
        font-size 18px
        color #fff
        cursor pointer
</style>
