2011-05-26 104 views
3

我试图改变一些单选按钮字体大小:改变单选按钮文本的字体大小

<input type="radio" name="rdDate" id="ShowAll" value="Show All" style="border-style:none;margin-left:0px;font-size:11px;"/>Show All 
    <input type="radio" name="rdDate" id="ShowCurrent" value="Show Current" style="border-style:none;font-size:11px;"/>Show Current 

但添加样式= “FONT-SIZE:11像素;”到输入标签不会更改文本大小。我发现要做到这一点的唯一方法是将文本包装在一个字体标签中,但是你只能将字体大小限制在1到7之间,其中没有一个适合我需要的大小。

有人知道如何更改单选按钮文本的字体大小吗?

回答

10

文本是旁边的单选按钮,不在里面。

首先,添加一个<label>元素(确保for属性匹配与它相关联,这将它们连接输入的id所以人们将有一个更大的点击目标和屏幕阅读器的用户就会知道哪些标签与所属哪个控制)。

然后款式的标签

+0

有关说明:'for'-attribute必须与输入的'name'属性相同。这些应该重命名为'rdDate1'和'rdDate2'才能正常工作。 – Tim 2011-05-26 11:03:10

+1

@Tim - 不! 'id'属性!如果你改变了名字,那么单选按钮就不会再是一个组了! – Quentin 2011-05-26 11:07:07

+0

当然!对不起..:| – Tim 2011-05-26 14:16:02

0

<label>标记包装文本,然后可以设置该标记的样式。

<input type="radio" name="rdDate" id="ShowAll" value="Show All" style="border-style:none;margin-left:0px;font-size:11px;"/><label style="font-size: 11px;">Show All</label> 
<input type="radio" name="rdDate" id="ShowCurrent" value="Show Current" style="border-style:none;font-size:11px;"/><label style="font-size: 11px;">Show Current</label> 

还考虑不使用内联样式并使用外部样式表。

相关问题