以下是一个示例解决方法，可以在选项卡指示器下方删除不需要的线条：

HTML代码：

  

    
选项卡1
    
选项卡2
    
选项卡3
  
  

    
  

CSS代码：

.tab-container {
  position: relative;
}

.tab-list {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.tab {
  display: inline-block;
  padding: 10px 20px;
  background-color: #ccc;
  cursor: pointer;
}

.tab.active {
  background-color: #f00;
}

.tab-content {
  border: 1px solid #ccc;
  padding: 10px;
}

.tab-indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  background-color: #f00;
  transition: transform 0.3s ease-in-out;
}

.tab.active .tab-indicator {
  transform: scaleX(1);
}

.tab.indicator-none .tab-indicator {
  display: none;
}

JavaScript代码：

const tabs = document.querySelectorAll('.tab');

tabs.forEach(tab => {
  tab.addEventListener('click', () => {
    tabs.forEach(tab => {
      tab.classList.remove('active');
    });
    tab.classList.add('active');
  });
});

上述代码中，.tab-indicator 类定义了选项卡指示器的样式，.tab.active .tab-indicator 类定义了选项卡激活时指示器的样式。在JavaScript代码中，通过为选项卡添加和移除 active 类来切换选项卡的激活状态。

如果不需要显示选项卡指示器，可以为不需要的选项卡添加 indicator-none 类。.tab.indicator-none .tab-indicator 类定义了不显示指示器的样式。