これが Chrome の何らかのバグなのか、それとも (おそらく) 私が何か間違ったことをしているのかはわかりません。入力したものが数字でない場合、テキストボックスの背景色を赤くしようとしています。
私はこのhtmlページを持っています:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>iSPT</title>
<link rel="stylesheet" type="text/css" href="style2.css" />
</head>
<body>
<form >
<input type="number" autofocus />
</form>
</body>
</html>
これは style2.css です。
@CHARSET "ISO-8859-1";
:invalid{
background-color: red;
}
これは上記のように機能しません (文字を入力してもボックスが赤くなりません)。私がそれを機能させるには2つの方法があります。1 つ目は、入力から autofocus 属性を削除することでした。
または、外部ファイルの CSS を HTML ヘッドにインラインで配置すると、検証も機能します。
ただし、オートフォーカスと外部 css シートを保持できるようにしたいと考えています。
何か案は？