佔位符文本對齊

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/