html - 从自定义样式 radio 中删除“边框”

原文 标签 html css

这是我的HTML:

<div class="gender-options">
<label title="item1">
<input type="radio" name="gender" value="male" /> 
<img /> 
Musko   
</label>
<label title="item2">
<input type="radio" name="gender" value="female" />
<img />
Zensko
</label>
</div>


这是我的CSS:

div.gender-options > label > input {
visibility: hidden;
color: #b8b9bd;
}

div.gender-options > label > img {
display: inline-block;
padding: 0px;
height:20px;
width:20px;
border: 0px;
background: url("../img/icons/checkbox.png");
}

div.gender-options > label > input:checked +img {  
background: url("../img/icons/checkbox_checked.png");
background-repeat: no-repeat;
background-position:center center;
background-size:20px 20px;
border: 0px;
}


一切正常,但是我在边框上遇到了问题,如果删除background,它将只是一个空白边框。我只想删除该边框。

这是图像(蓝色复选框上方的白色边框):

最佳答案

尝试添加outline: none;属性。另外,一个演示会很好。

关于html - 从自定义样式 radio 中删除“边框”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35932620/

相关文章:

html - 如何减少两个 Bootstrap 行之间的垂直空间/边距?

jquery - css <li>在chrome onload中重叠

Javascript .style 更改影响两个元素,尽管它们的值记录不同

php - 如何在 for 循环中使用 php 更改 css 样式值?

css - 在 <head> 中为手机网站添加 CSS 会好吗?

html - 可以使用 CSS 从图像中删除 mime 类型图标吗?

javascript - 需要麻烦的复选框

html - 将 Material 图标导入 Cordova Android Studio

jquery - 动态水平布局

html - 更改链接到 radio 的选定CSS标签的背景图像