Css 如何使切换按钮响应？

我不知道如何使引导样式响应我的输入

因为每次我尝试实现它时，它都会呈现一个基本的丑陋复选框。我也放松了我的风格

我有一个字段

：secret（boolean）

，我想用它做一个切换按钮

这是我的密码：

/***切换默认值***/
.TriSea technologies开关>输入[type=“checkbox”]{
显示：无；
}
.TriSea technologies开关>标签{
光标：指针；
高度：0px；
位置：相对位置；
宽度：40px；
}
.TriSea technologies开关>标签：：之前{
背景：rgb（0,0,0）；
方框阴影：插入0px 0px 10px rgba（0,0,0,0.5）；
边界半径：8px；
内容：''；
高度：16px；
利润上限：-8px；
左边距：-20px；
位置：绝对位置；
不透明度：0.3；
过渡：所有0.4缓进缓出；
宽度：40px；
}
.TriSea technologies开关>标签：：之后{
背景：rgb（255、255、255）；
边界半径：16px；
盒影：0px 0px 5px rgba（0,0,0,0.3）；
内容：''；
高度：24px；
左：-4px；
利润上限：-8px；
位置：绝对位置；
顶部：-4px；
过渡：所有0.3秒的缓进缓出；
宽度：24px；
}
.TriSea technologies开关>输入[type=“checkbox”]：选中+标签：：之前{
背景：继承；
不透明度：0.5；
}
.TriSea technologies开关>输入[type=“checkbox”]：选中+标签：：之后{
背景：继承；
左：20px；
}
/***切换默认值***/

集团名称：


群秘密
当前用户id%>