Html 更改单选按钮文本的字体大小
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6137424/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
changing the font size of radio button text
提问by user517406
I am trying to change the font-size of some radio buttons :
我正在尝试更改某些单选按钮的字体大小:
<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
But adding style="font-size:11px;" to the input tag does not change the text size. The only way I have found to do this is to wrap the text in a font tag, but then you are limited to a font size of 1 to 7, none of which is the right size for what I require.
但是添加 style="font-size:11px;" 到输入标签不会改变文本大小。我发现这样做的唯一方法是将文本包装在字体标签中,但随后您只能使用 1 到 7 的字体大小,这些大小都不是我需要的正确大小。
Does anybody know how to change the font size of a radio button text?
有人知道如何更改单选按钮文本的字体大小吗?
回答by Quentin
The text is besidethe radio button, not inside it.
文本在单选按钮旁边,而不是在里面。
First, add a <label>
element (make sure the for
attribute matches the id
of the input with which it is associated, this will link them so people will have a bigger click target and screen reader users will know which label belongs with which control).
首先,添加一个<label>
元素(确保该for
属性id
与其关联的输入匹配,这将链接它们,以便人们拥有更大的点击目标,屏幕阅读器用户将知道哪个标签属于哪个控件)。
Then style the label.
然后设置标签样式。
回答by Tim B James
Wrap the text with a <label>
tag and then you can style up this tag.
用<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>
Also consider NOT using inline styles and use an external stylesheet.
还要考虑不使用内联样式并使用外部样式表。