CSS サンプル: JavaScriptを使わないフェードイン・フェードアウト

チェックボックスのON・OFFにより表示非表示を切り替えます。

• チェックは下記のように<label>と連携させるとボタンのように扱うことができます。
• display: none の状態からフェードインはできないため position と visibility で要素を隠します。
  (後続の文章との間に空きができてもよければ position は不要です。position を用いる場合は width を設定しておいたほうが幅が変わってしまう心配がなく安全です)

後続の文章