Question

给出以下HTML片段：

<span name="foo" class="foo-class">
   <input name="foo" value="0" id="foo2_0" type="radio">
   <label for="foo2_0">The Server Side</label>
   <input name="foo" value="1" id="foo2_1" type="radio">
   <label for="foo2_1">Java Lobby</label>
   <input name="foo" value="2" id="foo2_2" type="radio">
   <label for="foo2_2">Java.Net</label>
</span>

<span name="bar" class="bar-class">
   <input name="bar" value="0" id="bar2_0" type="radio">
   <label for="bar2_0">The Server Side</label>
   <input name="bar" value="1" id="bar2_1" type="radio">
   <label for="bar2_1">Java Lobby</label>
   <input name="bar" value="2" id="bar2_2" type="radio">
   <label for="bar2_2">Java.Net</label>
</span>

是否有用于水平布置foo中辐射线的CSS：

服务器端 Java大厅 Java.Net

放射线垂直方向，就好像它们是用<br/>隔开的一样？

       服务器端
       Java大厅
       Java.Net

或者您是否需要将css类属性添加到radiobuttons或标签，或两者都添加？

编辑时：这是生成的代码，因此当span标记可以更改为您想要的任何内容时，只能对跨区内的标记（输入和标签标记）进行可能的更改是在输入和标签中添加了css类。（如果我想要简单，我会用<li>...</li>包裹每个无线电频率。不幸的是，我必须使用我所拥有的。）

注意：一个完全可以接受的答案是，“这不能（便携）完成，找到一种更好的方法来生成代码，伙计”，不过如果这就是答案，请告诉我原因。

啊，太棒了！ jdangel的解决方案不仅可以工作，而且如果我将相同的CSS分配给封闭跨度的div，它也可以工作。谢谢jdangel。

Answer 1

根据反馈进行编辑：太糟糕了。尝试：

.bar-class label {display:block; margin-left: 30px;clear:right;}
.bar-class input {float:left;clear:left;}

radiobuttons的CSS格式

1 个答案: