【CSS】display:noneの使い方

「display: none」は、HTML要素を非表示にするためのCSSプロパティです。要素が非表示になると、その要素に割り当てられたスペースもなくなり、文書の流れも変わりません。

使用方法は以下のようになります。

1.HTML要素に「display: none」を適用する

例:

<div style="display: none;">これは非表示になる要素</div>

2.CSSファイルに「display: none」を適用する

例:

.hidden {
  display: none;
}

<div class="hidden">これは非表示になる要素</div>

これにより、「div」要素が非表示になり、見た目上から消えます。このプロパティは、JavaScriptと組み合わせて動的に要素の表示非表示を切り替えたり、メニューなどを非表示にしたりすることができます。