单选按钮自定义，仅使用css

我想要这种无线电输入，但我不知道怎么做

多谢各位

html

<input type="radio" id="Professionel" value="Professionel">
                    <label for="Professionel">Professionel</label>

专业人员

---

看起来你已经有了这个标记，有什么问题吗

这不是一个完整的解决方案，它仍然需要
:focus
，
:hover
和
:active
样式。这会给你一个良好的开端

你也应该结账


正文{
字体系列：无衬线；
}
.海关检查{
字号：1rem；
显示：内联flex；
对齐项目：居中；
证明内容：之间的空间；
位置：相对位置；
}
/*方便地隐藏输入*/
.自定义检查>输入{
剪辑：rect（0）；
剪辑路径：插入（50%）；
高度：1px；
溢出：隐藏；
位置：绝对位置；
空白：nowrap；
宽度：1px；
}
.自定义检查>范围{
显示：块；
线高：1.5；
}
.自定义检查>span:：之前，
.custom check>span:：after{
内容：''；
显示：内联块；
位置：绝对位置；
}
.自定义检查>span:：之前，
.custom check>span:：after{
宽度：2ch；
高度：2ch；
左：0；
排名：0；
边框：2个实心#e1e1；
边界半径：25px；
}
.custom check>span:：after{
过渡：背景色0.25s缓变；
}
.custom check>input:checked+span:：after{
背景颜色：矢车菊蓝；
}
.自定义检查>范围{
左侧填充：3ch；
}

你的标签
显示结果，但缺少css