ホームページ > ウェブフロントエンド > CSSチュートリアル > 入力から枠線を削除する方法

入力から枠線を削除する方法

醉折花枝作酒筹
リリース: 2023-01-05 16:10:21
オリジナル
10844 人が閲覧しました

CSS では、border 属性を使用して、input 要素に「border:none」スタイルを設定するだけで枠線を削除できます。 border 属性は、すべての枠線属性を設定します。値が none の場合は、label 要素に枠線属性が設定されていないか、枠線属性が解除されて枠なしスタイルが定義されていることを意味します。

入力から枠線を削除する方法

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

新しい HTML ファイルを作成し、test.html という名前を付けます。test.html ファイルで、input タグを使用してテキスト入力ボックスを作成します。デフォルト値は空です。クラス属性 myttpp を入力要素に追加して、このクラスを通じて CSS スタイルを設定します。 タグを記述すると、そのページの CSS スタイルがタグ内に記述されます。

<body>
    <input type="text" name="" class="myttpp">
</body>
ログイン後にコピー

css タグで、クラス (myttpp) を介して入力スタイルを設定し、枠線の削除を実現するために枠線属性を none として定義します。効果を表示するには、背景色もグレーに設定します。

<style>
.myttpp{
    border: none;
    background: #ccc;
}
</style>
ログイン後にコピー

ブラウザで test.html ファイルを開いて効果を確認します。

入力から枠線を削除する方法

推奨学習: css ビデオ チュートリアル

以上が入力から枠線を削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート