边境的单选按钮

我有这样的代码，我不能handly（仅适用于CSS）修改边境的单选按钮

<label class="radio"> 
    <input type="radio" name="showTabs" checked="" value="1"> LABEL 1 
</label> 

<label class="radio"> 
    <input type="radio" name="showTabs" value="2"> LABEL 2 
</label>

我怎样才能避免添加边框选中单选按钮+标签？

来源

2017-07-07 Shakirov Ramil

你可以使用JavaScript？ –

没有。只是为了这个功能，我不想这样做 –

检查下面的代码，希望这是你所期待

.radio{ 
 
    position:relative; 
 
    display:inline-block; 
 
} 
 

 
.ch-style{ 
 
    display:block; 
 
    position:absolute; 
 
    top:0; 
 
    bottom:0; 
 
    left:0; 
 
    right:0; 
 
    z-index: 0; 
 
} 
 

 

 
input[type="radio"]:checked ~ .ch-style{ 
 
    border:1px solid red; 
 
}

<label class="radio"> 
 
<input type="radio" name="showTabs" value="2"> LABEL 2 
 
<span class="ch-style"><span> 
 
</label>

来源

2017-07-07 09:44:26 Karthik

再次修改的html代码。好的，我明白了，这是不可能的 –

边境的单选按钮

回答

相关问题