Bootstrap 引导单选按钮：无线电圆消除

lokaqttq 于 2023-04-09 发布在 Bootstrap

关注(0)|答案(4)|浏览(337)

我试图使用 Bootstrap 为我的网站。我有单选按钮，我试图使用“按钮”从 Bootstrap 为相同的。

<td style="margin-bottom:0px; padding-bottom: 0px;font-size=12px;vertical-align:bottom;">
    <div class="btn-group" data-toggle="buttons" id="topButtonDiv" >
        <button type="button" class="btn btn-primary">Home
        <input type="radio" id="radio1" ></button>
        <button type="button" class="btn btn-primary">Home1
        <input type="radio" id="radio2" > </button>
        <button type="button" class="btn btn-primary">Home2
        <input  type="radio" id="radio7"> </button>                
     </div>
</td>

我面临的问题是，我仍然看到单选按钮中的圆圈，而在Bootstrap示例中，我没有看到这样的圆圈。
http://getbootstrap.com/javascript/#buttons-usage
你能告诉我我错过了什么吗？

twitter-bootstrap

来源：https://stackoverflow.com/questions/18714735/bootstrap-radio-button-radio-circle-removal

4条答案

按热度按时间

zte4gxcn1#

如果CSS版本更新不起作用，另一种替代方法是使用CSS手动隐藏单选按钮

[type='radio'] {
display: none; 
}

赞(0）回复(0）举报 2023-04-09

xienkqul2#

检查你添加的css的版本，同样的btn-group类可以正常工作here

赞(0）回复(0）举报 2023-04-09

fv2wmkja3#

引导单选按钮的标记是错误的，您可以这样做：

<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>

此外，你不能把input元素放在button元素中，那是无效的html。

赞(0）回复(0）举报 2023-04-09

2jcobegt4#

用data-toggle="buttons"将所有内容 Package 在span中
在输入字段中添加class="d-none"

<span class="float-right" data-toggle="buttons">
     <label asp-for="ExpertiseLevel" class="btn btn-outline-secondary" for="juniorCheckbox">
         <input asp-for="ExpertiseLevel" type="radio" class="d-none" id="juniorCheckbox" value="JUNIOR" checked>
     Junior</label>

                    
     <label asp-for="ExpertiseLevel" class="btn btn-outline-secondary" for="expertCheckbox">
         <input asp-for="ExpertiseLevel" type="radio" class="d-none" id="expertCheckbox" value="EXPERT">
     Expert</label>
</span>

赞(0）回复(0）举报 2023-04-09

我来回答

Bootstrap 引导单选按钮：无线电圆消除

4条答案

相关问题

热门标签

最新问答