ホームページ >ウェブフロントエンド >CSSチュートリアル >何も表示しない とはどういう意味ですか?表示なしの使用例
何も表示しない とはどういう意味ですか?表示なしの使用例
- 不言オリジナル
- 2018-10-23 14:58:4965504ブラウズ
cssのdisplay属性はWebページのレイアウトでよく使われますが、特にdisplay属性のblock、inline-block、inline、noneの4つの属性値について紹介します。 need は、display 属性の none 属性値の使用法を参照できます。
ps: css 表示属性の関連知識の簡単な紹介については、css 表示属性とは何を意味しますか? を参照してください。 cssの表示属性について詳しく解説します。
まず、display none の意味を見てみましょう。
display:none の意味:
要素を非表示にして文書から切り離すという流れで、領域を非表示にし占有しません。正直に言うと、要素が none に設定されている場合、要素はスペースを占有することも表示されることもありません。これは要素が存在しないことと同じです。 。
display noneの意味を読んだあとは、display noneの使い方を見てみましょう。
display none の使用法:
display:none の例を直接見てみましょう:
<html>
<head>
<title></title>
<style type="text/css">
div{
background: lightblue;
width: 200px;
height: 200px;
}
span{
background: pink;
display: none;
}
</style>
</head>
<body >
<div><span>需要隐藏的区域</span></div>
</body>
</html>上記のコードでは、display:none 属性値を設定します。その効果は次のとおりです。
display:none 属性値が設定されている場合、効果は次のようになります。次の図: 非表示にする必要がある領域が非表示になりました。
display:none を使用するときに注意する必要があるのは、
1 スタイル ファイルを使用する場合です。または
2. display:none を直接使用してスタイル ファイルまたはページ ファイル コード内の要素を非表示にする場合、ページを読み込んだ後、要素を表示するために js を通じてスタイルを設定せずに、js コードを使用すると一部の属性が表示されます。 offSetTop、offSetLeft などの要素の要素が正しく取得できません。戻り値は 0 になります。これらの値は、js で style.display を設定して要素を表示した後でのみ正しく取得できます。
以上が何も表示しない とはどういう意味ですか?表示なしの使用例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。