読者です 読者をやめる 読者になる 読者になる

プログラマーな日々

プログラマーをやっています。好きなツール:WorkFlowy、好きな言語:C#、好きなサービス:Backlog、好きなAWS:AWS Lambda。

input要素 placeholder属性

HTML5

placeholder属性は、その入力フィールドのウォーターマークを表します。

使用例

<!DOCTYPE html>
<html lang="ja">
<head>
<title>Hello! HTML5></title>
<meta charset="UTF-8">
</head>
<body>
    <form action="hoge.cgi" method="post">
        <p>
            書籍検索:<input type="search" id="booktitle" placeholder="書籍名" />
            <input type="submit" value="検索" />
        </p>
    </form>
</body>

レンダリング

初期表示

ウォーターマークが表示されます。

入力フィールドにフォーカス

ウォーターマークが消えます。