Vue + css implémente un menu déroulant

    <div class="dropdown fleft">
      <!-- <button class="dropbtn listxx">更多赛事</button> -->
      <div class="dropbtn listxx">更多赛事</div>
      <div class="dropdown-content">
        <a href="javascript:;" :data-id="item.id" :data-index="index+8" @click="dianjilist($event)" v-for="(item, index) in listqt" :key="index">{
   
   { item.name }}</a>
      </div>
    </div>
2./* 下拉菜单 */

.dropbtn { // bordure: aucune; // margin-top: 3px; curseur: pointeur; taille de la police: 15px; arrière-plan: rgba (0,0,0,0,0); // contour: aucun; }

.dropdown { position: relative; // affichage: bloc en ligne; }

.dropdown-content { affichage: aucun; position: absolue; // couleur d'arrière-plan: # f9f9f9; arrière-plan: rgba (0,0,0,0,5); largeur min: 104px; indice z: 8888; // boîte-ombre: 0px 8px 16px 0px rgba (0,0,0,0.2); }

.dropdown-content a { couleur: #fff; rembourrage: 12px 16px; texte-décoration: aucun; bloc de visualisation; indice z: 8888; }

.dropdown-content a: hover { font-weight: bold; }

.dropdown: hover .dropdown-content { affichage: bloc; }