Question

我想制作无线电广播

这是我的代码。

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

但它无法正常工作。

Answer 1

＆＃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;

Answer 2

仅限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>

Answer 3

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

＆＃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;

Answer 4

<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>

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

Answer 5

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

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

/* 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>

阻止单选按钮

5 个答案: