Question

我使用以下样式作为占位符，但它将输入文本（当我开始键入时）从右向左开始。现在我看到这个example，它只是文本对齐，但为什么我的格式错误？以下是我的示例fiddle

input[placeholder="Required"]{
    text-align: right;
}

Answer 1

您的选择器input[placeholder="Required"]选择具有占位符属性的输入，而不是占位符本身。

使用示例中给出的选择器：

input::-webkit-input-placeholder {
  text-align: right;
}
input:-moz-placeholder {
  text-align: right;
}
input::-moz-placeholder {
  text-align: right;
}
input:-ms-input-placeholder {
  text-align: right;
}

<form method="post">
  <div class="blocks">
    <label for="fullname">Full Name</label>
    <input type="text" id="fullname" name="name" placeholder="Required">
  </div>
  <div class="blocks">
    <label for="Email">Email Address</label>
    <input type="Email" id="Email" name="email" placeholder="Required">
  </div>
</form>

Answer 2

因为在示例中它设置了占位符的样式而不是输入元素（就像你做的那样）。

input[placeholder="Required"]::-moz-placeholder{ text-align: right; }
input[placeholder="Required"]::-ms-input-placeholder{ text-align: right; }
input[placeholder="Required"]::-webkit-input-placeholder{ text-align: right; }

更新了演示：https://jsfiddle.net/z1zuo69q/2/

占位符文本对齐

2 个答案: