Question

我在Chrome上的Rails 3.2.6中。

我的html.erb文件中有以下代码：

<div id="beta">
    <%= form_tag({}, {:id => "id_search"}) do %>
        ID: <%= text_field_tag "beta_id" %>
        <%= submit_tag "Go" %>
    <% end %>
</div>

当我在CSS文件中将font-size设置为24pt时，文本字段会正确更改，但按钮根本不会更改。我在我的开发者工具中提取它，它获得了CSS属性，但只是没有改变它的字体大小。即使我放!important，也没有发生任何事情。我也无法改变字体系列。

JSFiddle：http://jsfiddle.net/R5CXg/

更改其他属性。当我更改background-color属性时，按钮突然变为方形而不是圆形，并弹出正确的font-size和font-family。

为什么会出现这种情况，我该如何解决？

Answer 1

尝试包括：

-webkit-appearance: button;
-moz-appearance: button;

在font-size之前的css中

，并将其仅应用于按钮，因此为btn提供一个id，然后将带有代码的css应用于按钮。这是为了确保webkit正确显示它。希望这会让你朝着正确的方向前进。

Answer 2

按钮样式因浏览器而异。

Webkit尝试使用无法使用所有CSS属性设置样式的本机控件。尝试：

-webkit-appearance:none

禁用特殊的原生样式。 It's a magic vendor-specific property.

为什么只在按钮上设置背景颜色时字体大小才有效？

2 个答案: