CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSの使用法：focus疑似クラス

次のコードを実行して、：focus疑似クラスを実装してみてください

例 

<!DOCTYPE html>
<html>
   <head>
      <style>
         input:focus {
            background-color: orange;
         }
      </style>
   </head>
   <body>
      <form action = "">
         Subject <input type = "text" name = "subject"><br>
         Student: <input type = "text" name = "student"><br>
         Age: <input type = "number" name = "age"><br>
         <input type = "submit" value = "Submit">
      </form>
   </body>
</html>
>

出力

CSSの使用法：focus疑似クラス


  1. CSSの疑似クラスとは何ですか

    CSS疑似クラスは、さまざまな要素の特殊な状態を表します。これらのクラスは、ドキュメント内の基本要素だけでなく、ステータス、位置、履歴などの外部要因も表します。これらの疑似クラスを使用すると、開発者は、を介して直接選択できない要素のスタイルを設定することもできます。 CSSセレクター。 構文 以下は、要素でCSSPseudoクラスを使用する構文です- Selector:pseudo-class {    css-property: /*value*/; } 例 CSS疑似クラスを使用する例を見てみましょう- <!DOCTYPE html> <html&

  2. CSSでフォーカスの入力フィールドをクリアするにはどうすればよいですか？

    以下は、フォーカスのある入力フィールドをクリアするためのコードです- 例 <!DOCTYPE html> <html> <head> <h1>Clearing an input field on focus example</h1> <input type="text" onfocus="this.value=''" value="Some random text..."> <h2>Click on the above field to