输入字体重量小于400

Question

我正在尝试为我的网站使用300的字体权重，输入内的文字拒绝变得比400更薄。这是一个例子：

http://jsfiddle.net/m8FZ6/3/

<span style="font-weight: 300;">300 weight:</span> <input type="text" value="text" style="font-weight: 300;"></input><br />
<span style="font-weight: 400;">400 weight:</span> <input type="text" value="text" style="font-weight: 400;"></input><br />
<span style="font-weight: 700;">700 weight:</span> <input type="text" value="text" style="font-weight: 700;"></input>

我在FF 25，Chrome 30.0.1599.69和IE10中注意到了这一点。有没有办法让它工作，还是我必须使用不同的元素？

Answer 1

input个元素（以及其他像textarea等）不会从父元素继承字体。他们有自己的默认字体。

如果您将CSS选择器更改为html, input，则可以看到它在所有输入中都具有适当的字体粗细。

Answer 2

您需要明确设置输入框的字体系列

http://jsfiddle.net/m8FZ6/5/

input {font-family: 'Roboto';}