独立定型占位符

Question

有没有办法在input元素中设置占位符的样式，而与用户输入内容时出现的文本无关？例如，我想使用input设置text-align: right元素的样式，但让占位符文本显示为text-align: center。

Answer 1

是的，但似乎您现在需要使用供应商前缀。

input {
  text-align: right;
}

::-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; 
}

<form>
  <fieldset>
    <label>
      Name
      <input type="text" placeholder="John Doe">
    </label>
    <input type="submit">
  </fieldset>
</form>

来源： http://css-tricks.com/snippets/css/style-placeholder-text/