gpt4 book ai didi

css - 输入[类型= radio ] :before radio sticking out

转载 作者:行者123 更新时间:2023-11-28 14:15:31 26 4
gpt4 key购买 nike

圆形边缘刚好从正方形或圆形中伸出,因此如果我在 before 之前提供白色背景,则 radio 边缘仍然略微可见。

enter image description here

enter image description here

input[type=radio] {
box-sizing: border-box;
margin: 0;
padding: 0;
position: relative;
cursor: pointer;
}

input[type=radio]:before {
content: "";
display: block;
width: 16px;
height: 16px;
border: 2px solid grey;
border-radius: 50%;
/* background-color: white; */
position: absolute;
top: 0;
left: 0;
}
> <input type="radio" name="r" checked>

如何使用 css before 完全隐藏单选按钮?

最佳答案

我认为使用 visibility:hidden 可能会有帮助,请检查以下内容:

input[type=radio] {
box-sizing: border-box;
margin: 0;
padding: 0;
position: relative;
cursor: pointer;
visibility: hidden;

}

input[type=radio]:before {
content: "";
display: block;
width: 16px;
height: 16px;
border: 2px solid grey;
border-radius: 50%;
/* background-color: white; */
position: absolute;
top: 0;
left: 0;
visibility: visible;

}
input[type=radio]:checked:after {
content: "";
display: block;
width: 10px;
height: 10px;
/* border: 2px solid green; */
border-radius: 50%;
background-color: green;
position: absolute;
top: 5px;
left: 5px;
visibility: visible;
}
<input type="radio" name="r" checked>

关于css - 输入[类型= radio ] :before radio sticking out,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55967112/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com