Question

我的jsfiddle here链接到bootstrap和bootstrap材料设计。我想让输入占位符的字体变小，但它只是没有预算，即使使用moz或webkit的输入占位符也是如此。任何建议将不胜感激。

HTML

<form class="form form-group has-info col-md-4">
      <input class="search-input form-control" placeholder=" . . . enter pokemon name" type="text">
      <button type="submit" class="btn btn-info btn-raised " name="button">Search!</button>
 </form>

CSS

::-webkit-input-placeholder {
   font-size: 25px;
}

:-moz-placeholder { /* Firefox 18- */
      font-size: 25px;
}

::-moz-placeholder {  /* Firefox 19+ */
      font-size: 25px;
}

:-ms-input-placeholder {
      font-size: 25px;
}

Answer 1

添加!important以覆盖样式

::-webkit-input-placeholder {
   font-size: 25px;
}

:-moz-placeholder { /* Firefox 18- */
      font-size: 25px;
}

::-moz-placeholder {  /* Firefox 19+ */
      font-size: 25px;
}

/* Overriding styles */

::-webkit-input-placeholder {
   font-size: 13px!important;
}

:-moz-placeholder { /* Firefox 18- */
      font-size: 13px!important;
}
::-moz-placeholder {  /* Firefox 19+ */
      font-size: 13px!important;
}

<input type="text" placeholder="Example..">

如何更改引导程序和引导程序材料设计的占位符字体大小？

1 个答案: