HTML <input>元素的placeholder屬性作用如下。
<input>元素的placeholder屬性會在輸入欄位中顯示輸入提示(hint)。
可使用placeholder屬性的<input>類型(type)包括以下：
text：一般文字輸入欄位search：搜尋欄位tel：電話輸入欄位url：URL輸入欄位email：Email輸入欄位password：密碼輸入欄位number：數字輸入欄位
總之就是那些可用來輸入資料的欄位類型。
例如下面的欄位都使用了placeholder屬性來提示使用者此欄位應輸入什麼資料。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>
<label>姓名:</label>
<input type="text" placeholder="請輸入英文姓名">
</div>
<div>
<label>電話:</label>
<input type="tel" placeholder="e.g. 0932-333-333">
</div>
<div>
<label>信箱:</label>
<input type="email" placeholder="請輸入gmail信箱">
</div>
<div>
<label>數量:</label>
<input type="number" placeholder="請輸入購買數量">
</div>
</body>
</html>
效果如下。
參考：
沒有留言:
張貼留言