内联css工作，而外部样式表不在textarea html元素上

Question

我有一个文本区域，如果我使用内联样式，其字体大小只会增加。我无法理解错误是什么。这是我的HTML：

<div class="col-xs-12">
   <textarea class="form-control" rows="10" id="letter_text" name="content_area"> </textarea>
</div>

如果我这样做有效：

<textarea class="form-control" rows="10" id="letter_text" name="content_area" style="font-size: 30pt;"></textarea>

但不是这个，在我的外部样式表上。文本框字体pt不受影响：

textarea
{
    font-size: 30pt;
}

Answer 1

鉴于您使用的是bootstrap CSS，并且它与内联样式一起使用 - 这是一个特殊性问题。

Bootstrap通过font-size

添加.form-control { font-size: 14px; }

如果您想覆盖它，只需更具体一点。使用像

这样的东西

jsFiddle example，它有效。

textarea.form-control {
    font-size: 30pt;
}

Answer 2

完全有可能有一个更具体的选择器指示该textarea上的字体大小，但没有一个完整的例子，我们不会知道。我建议你阅读CSS specificity。