<div class="tabs">
<div :class="activeName == index ? 'selected':'tab_item'" v-for="(item,index) in tabList" :key="index" @click="handleClick(index,item)">
{{item.title}}
</div>
.tabs{
display: flex;
width: 50%;
height: 25px;
margin: 0 auto;
.tab_item{
cursor:pointer;
position: relative;
width: 110px;
height: 25px;
line-height: 25px;
text-align: center;
font-size: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0 15px;
z-index: 1;
&::after{
position: absolute;
content: "";
left: -55px;
bottom: 0;
transform: translateX(50%);
z-index: -1;
border-bottom: 25px solid #F4F4F4;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
width: 110px;
}
}
}