Javascript 如何使两个按钮类似于切换按钮

我有两个按钮相互重叠，看起来像

我让它像两个按钮，一些css，我已经提供了下面

.tab{
溢出：隐藏；
}
.选项卡按钮{
背景色：继承；
浮动：左；
边界：无；
大纲：无；
光标：指针；
边界半径：30px；
填充：14px 16px；
过渡：0.3s；
字号：17px；
边框：1px实心#中交；
颜色：#6767；
&.主动{
颜色：#ffffff；
背景色：#009bdf；
}
}

按钮1
{{btn_状态}
按钮2
{{btn_状态}

我修改了css和Angular代码，使示例生效。添加了

z-index

和

position:relative

，使其正常工作。应该很容易重新组合

.tab{
溢出：隐藏；
}
.选项卡按钮{
位置：相对位置；
背景色：继承；
浮动：左；
边界：无；
大纲：无；
光标：指针；
边界半径：30px；
填充：14px 16px；
过渡：0.3s；
字号：17px；
边框：1px实心#中交；
颜色：#6767；
z指数：1；
宽度：50%；
}
.tab按钮。激活{
z指数：2；
颜色：#ffffff；
背景色：#009bdf；
}

按钮1
挑选出来的
按钮2


按钮1
按钮2
挑选出来的