多くのプログラマは、プロジェクトを作成するときに入力枠のスタイルを削除するという問題に遭遇するでしょう。今日はそれを勉強しますが、この問題を解決する方法はありますか?
通常、入力を設定します。
input{
border: none;
}このメソッドでは表示スタイルを削除しますが、入力するときに入力ボックスをクリックすると、黒い初期化境界線がまだ残っていることがわかります。
この状況にどう対処すればよいでしょうか?
これはフォーカス セレクターを通じて実現できます。
テキスト入力ボックスのスタイルを削除します。
input[type=text]:focus {
outline: none;
}パスワード入力ボックスのスタイルを削除します。
input[type=password]:focus {
outline: none;
}つまり、どちらのタイプの type=input が使用されても、スタイルは削除されます。
最終的な効果は以下の通りです。
以下は、一般的な入力ボックスのさまざまな値です。
text デフォルトの入力タイプ。
パスワード 一連のドットとして表現されるパスワード入力ボックス。
ファイル ファイル アップロード コントロール
ラジオのラジオボタン
チェックボックス チェックボックス
hidden 非表示の入力フィールド。ユーザーに表示されないフォームを追加するために使用されます。
ボタン ボタン
画像 画像フォームの送信ボタン
リセット リセット ボタンでフォーム内のすべてのデータをクリアします
送信 送信ボタン。送信ボタンはフォームデータをサーバーに送信します。
カラーパレット
tel 電話番号を含む入力フィールド
電子メール 電子メールアドレスを含む入力フィールド
URL アドレスを含む URL 入力フィールド
検索 検索ドメイン
数値 数値を含む入力フィールド
range 一定の範囲内の数値を含む入力フィールド
date は日、月、年の入力フィールドを選択します
month は月と年の入力フィールドを選択します
週は週と年の入力フィールドを選択します
月と年を選択するための時間入力フィールド
datetime は、時刻、日、月、年 (UTC 時間) の入力フィールドを選択します。
datetime-local は、時刻、日、月、年 (現地時間) の入力フィールドを選択します。
この時点で、遭遇した問題は解決しましたが、このようなことを学ぶには、1つの事例から推論を導き出す必要があり、要約と深掘りが得意である必要があります。どう思いますか？
