在以下屏幕截图所示的 HTML 布局中，我希望单选按钮正好位于 Yes 和 No 标签下，但 CSS padding 属性似乎不适用于 HTML input 标记。给出了代码。
如何更改内联 样式，使单选按钮位于 Yes 和 No 标签下。
<html>
<div style="padding:25px;">
<div style="background-color:#bf5b5b; ">
<label style="padding-left:25px; padding-right:25px;">Yes</label>
<label style="padding-left:25px; padding-right:25px;">No</label>
<label style="padding-left:25px; padding-right:25px;"></label>
</div>
<div id="option_one_div" style="background-color:#74d4dd;">
<input style="padding-left:125px; padding-right:25px;" type="radio" name="radio" value="0">
<input style="padding-left:25px; padding-right:25px;" type="radio" name="radio" value="1">
<label style="padding-left:25px; padding-right:25px;" for="option_one_div">Label of first group of Radio Buttons</label>
</div>
<div id="option_two_div" style="background-color:#36d666;">
<input style="padding-left:25px; padding-right:25px;" type="radio" name="radio" value="0">
<input style="padding-left:25px; padding-right:25px;" type="radio" name="radio" value="1">
<label style="padding-left:25px; padding-right:25px;" for="option_two_div">Label of second group of Radio Buttons</label>
</div>
</div>
</html>
最佳答案
padding 的思想是在元素内增加空间。您似乎在尝试在元素外添加空间，为此您应该使用 margin。
这张图片可能有助于解释这个概念。
(来源:w3schools.com)
要点是，要在元素周围添加空间，您通常会使用边距而不是填充。
附带一提，很多人在向 body 添加填充时都会犯这个错误；他们改用 margin ，这会产生不可预测的结果。
Here's an example fiddle使用您的代码，仅使用边距而不是填充(我修改了像素以使其正常工作)。
关于html - 如何将填充应用于 HTML 输入元素？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25402749/