Question

font-size标签的input不会增加。我知道它遵循浏览器/操作系统设置规则，但是否应该能够覆盖它？

<style>
input[type="search"]
{
  font-size:50px;
}
</style>
<form class="search-box" action="https://www.google.com/search">
  <input type="search" name="q" placeholder=" welcome back" value="" autocomplete="off" autofocus>
</form>

结果

https://imgur.com/a/iegRUl3

Answer 1

苹果做苹果的东西。 https://developer.mozilla.org/es/docs/Web/CSS/-moz-appearance

input[type=search]{
   -moz-appearance: none;/* older firefox */
   -webkit-appearance: none; /* safari, chrome, edge and ie mobile */
   appearance: none; /* rest */
}

Answer 2

我刚刚为您的代码创建了jsfiddle，它可以按预期工作。我相信还有其他CSS规则会覆盖您的规则。

因此，您可以尝试将clf.score添加到规则中，例如：

!important

Answer 3

在输入中添加一个类，例如：

<style type="text/css">
.search{
font-size:50px;
}

<form class="search-box" action="https://www.google.com/search">
<input class="search" type="search" name="q" placeholder=" welcome back" value="" autocomplete="off" autofocus>

CSS如何更改输入字体大小

3 个答案: