阻止单选按钮

时间:2017-11-09 06:08:02

标签: html css

我想制作无线电广播

这是我的代码。

   
   <label> Rating
     <input type="radio">great
     <input type="radio">wonderful 
   </label>

但它无法正常工作。

5 个答案:

答案 0 :(得分:2)

&#13;
&#13;
label{
  display: block;
}
&#13;
   <p> Rating</p>
   <label for="radio1"><input type="radio" id="radio1" name="radiogroup1">great</label>
   <label for="radio2"><input type="radio" id="radio2" name="radiogroup1">wonderful</label> 
   
&#13;
&#13;
&#13;

答案 1 :(得分:1)

仅限html:

<label> Rating: </label>

<p>
  <input type="radio" name="rate" id="great">
  <label for="great">great</label>
</p>

<p>
  <input type="radio" name="rate" id="wonderful">
  <label for="wonderful">wonderful</label>
</p>

答案 2 :(得分:0)

尝试使用此简单解决方案显示为列表。

&#13;
&#13;
 label li {
    list-style:none;
    }
&#13;
     <label> Rating
       <li><input type="radio" name="group1">great</li>
       <li><input type="radio" name="group1">wonderful </li>
       </label>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

<div style="display:flex; width: 120px;">
  <p style="flex:1">Rating</p>
  <div style="flex:1">
    <input type="radio">Good<br>
    <input type="radio">Great
  </div>
</div>

你是说这样的意思吗?您也可以使用表格来获得相同的效果。

答案 4 :(得分:0)

您可能没有在这里使用任何CSS,您可以使用block elements创建结构。

在这里,您尝试对齐块中的内联元素,以便使用pdiv或任何其他块元素。

/* outline focus */
label:focus, input:focus{
  outline: dotted 2px red;
}

/* No CSS to align the below elements */
<label for="rating"> Rating</label>
<p><label for="great">great</label><input type="radio" name="rating" id="great"></p>
<p><label for="wonderful">wonderful</label><input type="radio" name="rating" id="wonderful"></p>