小编Shi*_*fra的帖子

https://www.thezone.org/ride/insertride.asp

在这个页面上,单选按钮有一个字体很棒的图标响铃,而不是常规的单选按钮圈.当你选择一个选项时,环内应该有一个圆圈 - 就像在同一个网站的这个页面上一样:

https://www.thezone.org/application-camper.asp

选择似乎不起作用.我无法弄清楚为什么它在另一页上工作但不在这一页上.当我检查元素时,这个css(参见下面的其余部分)[type = radio]:checked + label:before {content:"\ f192"; font-family:FontAwesome;}没有显示,但它显示在另一个表单上.这是应该让小圆圈显示的css.

这是html:

<div class="form-group">
               <label class="control-label col-lg-3 col-sm-4" id="gender">
          Gender</label>
            <div class="col-sm-8 col-md-7 col-lg-8 full-input">
                <input type="radio" name="gender" value="Male" id="gender_0"     />
                <label class="radio-inline">Male</label>

                <input type="radio" name="gender" value="Female"     id="gender_1" />
                <label class="radio-inline">Female</label>

                <input type="radio" name="gender" value="Family" id="gender_2" />
                <label class="radio-inline">Family</label>
           </div>
        </div>

这是css:

[type=radio] {    display: none;}
[type=radio] + label:before {    content: "\f10c";  font-family:   FontAwesome;  font-size: 1.1em;    color: #028167;    letter-spacing: 10px;  display: inline-block;}
[type=radio]:checked + label:before {    content: "\f192"; …