设置样式<input>标签

Question

为什么不能在输入标签中设置像字体大小一样的样式，例如，

<input style="font-size:20px" type="radio" name="a" value="a">some text</input> 

不应该使用字体属性吗？

其次，那么做到这一点的最好方法是什么？

感谢

Answer 1

我认为，这是因为你设置的CSS适用于输入的“内部”标签。

你想要的风格是它的价值，所以你需要将你的输入封装在一个占位符和样式中。

例如：

<span style="font-size:40px"> 
    <input type="radio" name="a" value="a">some text 
    <input type="radio" name="a" value="b">some text 
</span> 

按预期工作。

Answer 2

尝试以下操作：

<input type="radio" name="a" value="a"><span style="font-size: 50px;">some text</span></input> 

如果你换一个跨度\ p标记文本，你就能风格，标签内的文本。

Answer 3

有没有很多可以做，以风格单选按钮，但是：

<input type="radio" name="radiogroup" id="radio-1"> 
<label for="radio-1">Radio button 1</label> 

你可以风格的标签...

Answer 4

去这个问题的最好办法是提供风格减速在外部样式表中，或者也许在文档的顶部。内联样式通常是您想要尽可能避免的，因为后来的更改会变得混乱，并可能导致非常脏的特定性问题。

修复的一个例子：

HTML（例如）

<div id="form"> 
    <input type="text" name="name" value="a" /> 
</div> 

CSS（例如）

#form input { 
    font-size: 20px; 
} 

希望这有助于。

Answer 5

我知道这个问题已经有一个公认的答案，但我想这是值得一提的是：

这可能是更好的或者是<label>标签与每个无线输入（使用标签的for属性）关联或用标签标签包裹每个无线电输入。这让您的用户点击文本来选择无线电输入，而不必瞄准一个相当小的圆圈。

所以您的标记看起来像这样：

<input type="radio" id="radio1" name="radios" value="something 1" /> 
<label for="radio1">Something 1</label> 

<input type="radio" id="radio2" name="radios" value="something 2" /> 
<label for="radio2">Something 2</label> 

<input type="radio" id="radio3" name="radios" value="something 3" /> 
<label for="radio3">Something 3</label> 

无线输入分为由他们的名字互斥选择，该组将分享。标签的for属性中指定的值将与要选择的无线电输入的id属性匹配。所以在上面的例子中，如果你点击文本“Something 1”，那么被选中的无线电输入id为radio1。

然后，您可以将标签的文字设计为您心中的内容。

这是关于你问题的第二部分，

“其次，什么是做到这一点的话，最好的方法？”