ホームページ >ウェブフロントエンド >フロントエンドQ&A >HTML内の要素を非表示にする方法

HTML内の要素を非表示にする方法

藏色散人
藏色散人オリジナル
2021-04-29 14:57:5810465ブラウズ

html要素を非表示にする方法: 1. "display:none;" で非表示にする; 2. "overflow:hidden;" で非表示にする; 3. ボックス モデルの属性値を設定します。要素の幅と高さを 0 に設定します; 4. 位置決めを使用して非表示にします; 5. 要素の透明度を 0 に設定します; 6. 可視性によって非表示にします。

HTML内の要素を非表示にする方法

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。

HTML 要素を非表示にする方法

1.display:none;

特徴: 本当に隠された要素。

(1) 要素の表示属性を none に設定すると、要素が確実に非表示になります。

(2) この属性を使用すると、非表示の要素はスペースを占有しません。

(3) 要素を非表示にするには、display:none を使用します。ユーザーと直接対話することはできません。

(また、画面読み上げソフトウェアを使用して要素の内容を読み取ることはできません。この非表示方法は、 )

# (4) この非表示要素の子孫要素も非表示になります;

(5) ただし、この非表示要素にはアクセスできます。 JS での DOM 操作を通じて、または DOM を通じて操作します。

2.overflow: hidden;

原則: 要素の位置を親要素の外側に設定します。

3. 要素の幅や高さなどのボックスモデルの属性値を0に設定します。

4. 配置を使用して要素を非表示にします。

利点: 要素の左側と上部が十分に大きな複数に設定されている限り (この要素はユーザーと対話できます);

欠点: 画面読み上げソフトウェアを引き続き使用できます。要素の内容を読み取ります。

5.opacity: 要素の透明度を 0 に設定します。

機能: 要素の透明度を 0 に設定すると、要素が見えなくなるだけです。要素自体の位置はまだ存在しており、ユーザーと対話することもできます。

6.visibility: 要素が表示されるかどうかを設定します。

デフォルト: 表示 (表示);

## 非表示 (非表示): 非表示。

機能: 要素を非表示にしますが、その位置は保持します。

HTML/CSS の詳しい知識については、

CSS ビデオ チュートリアル

列をご覧ください。

以上がHTML内の要素を非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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