Question

我在bootstrap中使用了下面的html单选按钮

<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>
<div class="radio">
  <label>
    <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
    Option two can be something else and selecting it will deselect option one
  </label>
</div>

除标签外，没有显示单选按钮..

偶<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">

没有显示单选按钮。可能是什么问题

Answer 1

如果你的单选按钮没有显示，你的css中的某个地方可能有以下代码：

input[type="radio"] {
    display:none;
}

display：none; 位使您的单选按钮不可见。

Answer 2

如果未显示单选按钮，则可能是不透明度可能设置为“ 0”。因此您可以使用以下CSS代码。

  input[type="radio"] {
  opacity: 1;
 }

Answer 3

对于Bootstrap 4，它是类.custom-control-input和position: absolute：

.custom-control-input {
    position: absolute;
    left: 0;
    z-index: -1;
    width: 1rem;
    height: 1.22rem;
    opacity: 0;
}

这可能有助于使其显示：

input[type="radio"] {
    display: block;
    position: relative;
    opacity: 1.0;
}

Bootstrap单选按钮未显示

3 个答案: