我有以下HTML:
<input type="radio" name="beds" value="1" />1+ <input type="radio" name="beds" value="2" />2+
如何更改单选按钮和“1+”文本之间的间距?我希望文本离单选按钮更近,但浏览器在两个元素之间插入了一定量的未定义填充。
laik7k3q1#
许多HTML元素都有默认边距设置。您可以覆盖此设置并将其设置为0。在您的示例中,您希望重置单选按钮上的margin-right:
margin-right
<input type="radio" name="beds" value="1" style="margin-right: 0" />1+
您可能希望将其添加到样式表中,以便应用于所有单选按钮:
input[type="radio"] { margin-right: 0; }
2ic8powd2#
您将需要label元素。
label
<input type="radio" name="beds" value="1" id="first" /><label for="first">1+</label> <input type="radio" name="beds" value="2" id="second" /><label for="second">2+</label>
然后,可以将其样式设置为:
label { margin-left: -3px; }
还请注意,for属性用于辅助功能。
for
z31licg03#
在css中只需要将输入id的宽度改为auto。
#input-id { width: auto; }
hfwmuf9z4#
您可以将以下内容添加到样式表中:
input[type="radio"] { margin-right: 10px; }
siv3szwd5#
首先创建id的内部输入标记(例如id="input1"),然后在css文件中创建样式id(例如#input1{margin-left:5px; margin-top:5px;}),您也可以使用margin-top:5px和margin-left:5px使用内联样式
id="input1"
#input1{margin-left:5px; margin-top:5px;}
margin-top:5px
margin-left:5px
w8rqjzmb6#
<input type="radio" name="beds" value="1" id="first" /> <label for="first"> 1+ </label> <input type="radio" name="beds" value="2" id="second" /> <label for="second"> 2+ </label>
这就是你的将+1(和+2)更改为<h:outputText value ="+1" style="margin-left: -3px"/>您必须修改用作标签的文本的样式,为此,您需要它是一个实际的元素,而不仅仅是原始文本。
6条答案
按热度按时间laik7k3q1#
许多HTML元素都有默认边距设置。您可以覆盖此设置并将其设置为0。在您的示例中,您希望重置单选按钮上的
margin-right
:您可能希望将其添加到样式表中,以便应用于所有单选按钮:
2ic8powd2#
您将需要
label
元素。然后,可以将其样式设置为:
还请注意,
for
属性用于辅助功能。z31licg03#
在css中只需要将输入id的宽度改为auto。
hfwmuf9z4#
您可以将以下内容添加到样式表中:
siv3szwd5#
首先创建id的内部输入标记(例如
id="input1"
),然后在css文件中创建样式id(例如#input1{margin-left:5px; margin-top:5px;}
),您也可以使用margin-top:5px
和margin-left:5px
使用内联样式w8rqjzmb6#
这就是你的
将+1(和+2)更改为
<h:outputText value ="+1" style="margin-left: -3px"/>
您必须修改用作标签的文本的样式,为此,您需要它是一个实际的元素,而不仅仅是原始文本。