更改Bootstrap表单输入字体

Question

HTML：

<div class="form-group">
   <label for="email">Email Address:</label>
   <input type="email" class="form-control" id="email" placeholder="example@domain.com">
</div>              

CSS：

::-webkit-input-placeholder {
    font-weight: bold;
    font-size: 17px;
}

:-ms-input-placeholder {
   font-weight: bold;
    font-size: 17px; 
}

基本上，＆＃34; example@domain.com"上的字体;得到改变。但是一旦我写入字段，字体就不一样了，而且看起来很弱。 请注意：我对编码很新，如果我的代码出错或者我的代码结构不正确，我也不会感到惊讶。

How it looks like

How it looks like after writing

Answer 1

您目前只为placeholder设置样式。当您在输入字段中输入内容时，占位符会自动替换为您的数据，这意味着您还必须设置.input的内容样式，而不仅仅是placeholder的内容，以获得正确的结果。

例如，使用以下代码：

::-webkit-input-placeholder {
  font-weight: bold;
  font-size: 17px;
}

:-ms-input-placeholder {
  font-weight: bold;
  font-size: 17px; 
}

input {
  // Styling can be put here
}