element plus中的tabs 去掉底部的下划线

你可以通过设置 `tab-bar-style` 属性来去掉 Element Plus Tabs 组件底部的下划线。具体做法如下：

<template>
  <el-tabs tab-bar-style="border: none;">
    <el-tab-pane label="Tab 1">Content of Tab Pane 1</el-tab-pane>
    <el-tab-pane label="Tab 2">Content of Tab Pane 2</el-tab-pane>
    <el-tab-pane label="Tab 3">Content of Tab Pane 3</el-tab-pane>
  </el-tabs>
</template>

在 `el-tabs` 组件中添加 `tab-bar-style` 属性，将 `border` 设置为 `none` 即可去除底部的下划线。

相关问题

vue element el-tabs 去掉底部的下划线和切换时的下划线

要去掉el-tabs组件底部的下划线和切换时的下划线，你可以使用以下两种方法：

1. 使用CSS样式覆盖默认样式：

.el-tabs__header::after {
  border-bottom: none;
}

.el-tabs__item.is-active {
  border-bottom: none;
}

2. 通过设置组件属性来实现：

<el-tabs type="border-card" :tab-position="position" :stretch="false" style="border: none">
  <el-tab-pane label="tab1"></el-tab-pane>
  <el-tab-pane label="tab2"></el-tab-pane>
  <el-tab-pane label="tab3"></el-tab-pane>
</el-tabs>

其中，`:stretch="false"` 可以去掉切换时的下划线， `style="border: none"` 可以去掉底部的下划线。

element el-tabs 底部的下划线变细

您可以通过以下两种方式来使element-ui中的el-tabs底部的下划线变细：

1. 使用CSS样式覆盖默认样式

/* 将下划线高度设为2px，宽度设为70% */
.el-tabs__header::after {
  height: 2px;
  width: 70%;
}

2. 使用element-ui自定义主题

在项目中引入element-ui的scss文件，并根据需要修改变量。例如，将下划线高度设为2px，宽度设为70%：

$tabs-ink-bar-height: 2px;
$tabs-ink-bar-width: 70%;
@import 'element-ui/packages/theme-chalk/src/index';

需要注意的是，使用自定义主题需要安装sass依赖，并且需要在项目中配置相关loader。详细的使用方法可以参考element-ui文档。