在O组单选按钮之间添加空格

迪斯科舞者 提供了一个有效的答案,但请注意 IE6 不支持属性选择器( http://www.quirksmode.org/css/contents.html )你不需要一个黑客来解决这个问题,通过将类应用到你的单选按钮上。

所以你的HTML应该是:

<input type="radio" name="foo" class="bar" value="lorem"> Lorem <br>
<input type="radio" name="foo" class="bar" value="ipsum"> Ipsum <br>
<input type="radio" name="foo" class="bar" value="dolor"> Dolor

CSS可以是:

input.bar { margin: 5px 0; }

尝试将其放入样式表:

input[type=radio] { margin-bottom: 15px }

当然,你可以把15像素增加到你喜欢的程度。

line-height 可能是你最好的选择

<p class="radios">
    <label><input type="radio"> Foo</label>
    <label><input type="radio"> Bar</label>
</p>

.radios label {
    display: block;
    margin-bottom: 15px;
}

简单易行,适用于所有浏览器。总是使用 label 对于所有表单元素,尤其是单选按钮和复选框,可以单击文本和小按钮来选择选项。