「:focus」で入力エリアのon-offをCSSで制御する

input[type=text]{
border:1px solid #cccccc;
}
input[type=text]:focus{
border:1px solid #000000;
}
<input type="text" value="" placeholder="入力してください" />

カーソルを入れると、入力エリアのボーダーが黒に変化します。
外すとまたグレーに戻ります。