ホームページ >ウェブフロントエンド >htmlチュートリアル >擬似クラスの有効および無効_html/css_WEB-ITnose

擬似クラスの有効および無効_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-21 08:57:111406ブラウズ

CSS3 より前は、入力が正しいかどうかを判断するために入力ボックスを処理するときに、入力の正しさをユーザーに知らせるために対応する入力スタイルを作成していましたが、この機能は有効です。 CSS3 に追加された 2 つの疑似クラスと無効な関数は、入力ボックスにあります。

提案の送信の例を見てみましょう。

構造コードでは、ユーザー名を入力する必要があり、メールアドレスはオプションです。コンテンツの文字は 4 ~ 20 文字にすることをお勧めします (ここではパターン属性の使用法が一致します)。次に、実際には入力ボックスの背景を変更する CSS コードを記述します。

input:valid{

background-color: #44b549;

}

input:invalid {

background-color: crimson;

}

最終的なインターフェイス効果は次のとおりです:

対応する一致するテキストを入力してみてください。テキストを一致させて、どのように機能するかを確認してください。

プログラマーはオンラインでトレーニングを受けています。

「エンドプログラミング開発」、「バックエンド開発」、「モバイル開発」など、

学習が必要な方はグループに参加するか、WeChat にメッセージを残してください

オリジナルコンテンツ、

パブリック WeChat ID: bianchengderen

QQ グループ: 186659233

に統合してください。プログラマーの人生を理解し、彼らの思考パターンを理解し、彼らの喜びと悲しみを理解し、プログラマーに注目してください。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。