html - 在文本字段中居中占位符和输入文本

Question

我想知道是否可以将占位符和用户将在文本字段中输入的输入居中。我想这是可能的，但我无法弄清楚。有人可以帮忙吗？我有问题的文本字段的代码如下...

<input type="text" style="font-weight:bold:" name="kword" id="kword" autofocus ="on" placeholder="Enter Keyword(s)" autocomplete ="on"/>

谢谢

Answer 1

这可以用来text-align:center

CSS：

input, input[placeholder] {
    text-align: center;
}

Answer 2

定位浏览器特定的占位符伪元素，如下所示：

input {
  text-align: center;
}

::-webkit-input-placeholder {
  text-align: center;
}
:-moz-placeholder {
  /* Firefox 18- */
  text-align: center;
}
::-moz-placeholder {
  /* Firefox 19+ */
  text-align: center;
}
:-ms-input-placeholder {
  text-align: center;
}

<input type="text" style="font-weight:bold;" placeholder="Enter Keyword(s)" />

Answer 3

就我而言，一个好的解决方案是：

div.search {display: flex;}

input::placeholder {align-self: center;}