ホームページ  >  記事  >  ウェブフロントエンド  >  CSS要素を非表示にする方法

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

coldplay.xixi
coldplay.xixiオリジナル
2021-04-16 16:05:204490ブラウズ

CSS 要素を非表示にする方法: 1. opacity 属性は要素の透明度を設定することを意味します; 2. Visibility はその値を hidden に設定して要素を非表示にします; 3. display 属性は次に従って要素を実際に非表示にします言葉の意味。

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

このチュートリアルの動作環境: Windows7 システム、css3 バージョン、DELL G3 コンピューター。

CSS 要素を非表示にする方法:

1. Opacity

opacity 属性は、要素の透明度を設定することを意味します。 。要素の境界ボックスを変更するようには設計されていません。これは、不透明度を 0 に設定すると、要素が視覚的に非表示になるだけであることを意味します。要素自体は引き続き独自の位置を占め、Web ページのレイアウトに貢献します。

css コード:

.hide {
  opacity: 0;
}

2. Visibility

値を hidden に設定すると、要素が非表示になります。 opacity 属性と同様に、非表示要素も Web ページのレイアウトに影響を与えます。

.hide {
   visibility: hidden;
}

3. Display

display 属性は、単語の意味に従って要素を実際に非表示にします。表示プロパティを none に設定すると、要素は表示されなくなり、ボックス モデルも生成されなくなります。この属性を使用すると、非表示の要素はスペースを占有しません。

.hide {
   display: none;
}

推奨関連チュートリアル: CSS ビデオ チュートリアル

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

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