HTMLコードでテキストを非表示にする方法

メールを読んで歩道のカフェで女性

画像クレジット: Jacob Ammentorp Lund / iStock / Getty Images

いくつかのHTMLタグには、「可視性」と呼ばれるプロパティが付属しています。 このスタイルを持つ要素の1つは、divタグです。 divタグは、Webページの特定の場所にテキストと画像を保持するコンテナです。 このタグを使用して、Webページ上のテキストを非表示にすることができます。 テキストのブロックをdivタグで囲むと、ユーザーからは見えなくなります。 これは、ユーザーがボタンまたはリンクをクリックするまで情報を表示しないメニューまたは動的ページを作成する場合に役立ちます。

ステップ1

テキストエディタでWebページを開きます。 これは、メモ帳のような単純なものでも、メモ帳++やVisualStudioなどのより高度なHTMLエディターでもかまいません。

今日のビデオ

ステップ2

テキストを配置するページのセクションにdivタグを配置します。 以下のコードは、visibilityプロパティがhiddenに設定されたdivタグを配置します。

ステップ3

divタグ内にテキストを入力します。 テスト目的で、タグ内に「MyHiddenText」と入力します。 コードは次のようになります。

私の隠されたテキスト

ステップ4

ファイルを保存して、Webブラウザで開きます。 レンダリングされたコードで表示されていても、Webブラウザにテキストは表示されません。