ホームページ  >  記事  >  ウェブフロントエンド  >  CSSでフォーカスボックスを削除する方法

CSSでフォーカスボックスを削除する方法

王林
王林オリジナル
2021-06-08 14:39:054892ブラウズ

CSS でフォ​​ーカス ボックスを削除する方法は、入力ボックスにスタイル [input{outline:none}] を追加することです。この時点では、入力ボックスに内容を入力しても、外枠にはフォーカスがありません。

CSSでフォーカスボックスを削除する方法

#この記事の動作環境: Windows10 システム、css 3、thinkpad t480 コンピューター。

入力は HTML の非常に重要な要素です。ユーザー入力を提供できます。入力時にフォーカスされたスタイルを追加する必要があります。しかし、フォーカスがあると枠線が表示されてしまうので、枠線を消したい場合はどうすればいいのでしょうか?以下、具体的な方法を見ていきましょう。

まず、新しい HTML および CSS ドキュメントを作成します。

入力ボックスのコンテンツを作成します。ここでは入力内のテキストを使用します。

マウスを入力ボックス内に移動すると、境界線にフォーカスがあることがわかります。

input {
    outline: none;
}

今回は上記のスタイルをCSSに追加し、境界線のフォーカスを削除します。

これでコンテンツを入力しても外枠にはフォーカスがありません。

枠線を追加しても効果はありません。

CSSでフォーカスボックスを削除する方法

関連ビデオ共有:

css ビデオ チュートリアル

以上がCSSでフォーカスボックスを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。