CSS 知識更新！ 参考: MDN - CSS カスタムプロパティ (変数) の使用 謎のスタイル定義を発見 ある日、いつものようにスタイルをデバッグしていたときのこと。 適用スタイルの下の方に、見慣れない書き方の項目があるのに気づきました。 --blue ってなに？　そんなスタイルあったっけ？ CSS カスタムプロパティ (変数)とは これは、 CSSカスタムプロパティ または CSSカスタム変数

ツールチップを表示させるのに、jQueryやBootstrapなどのライブラリを使うまでもないなーってとき、CSS だけで記述する方法があります。 まずはサンプルをご覧ください。 マウスホバーでツールチップを表示 ここにマウスを載せる ↑ の要素にマウスを載せるとツールチップが表示されます。 このサンプルでは JavaScript は使わず、CSS のみで対応しています。 ソースコード解説 HTML HTMLにはdata-tooltipというカスタム属性を設定します。カスタム属性は、data-プレフィックスで始まっていれば自由に設定して良いというHTML5の仕様です。 ここにマウスを載せる CSS CSSはちょっと複雑です。 下記はボタンの見た目を定義しています。 button { position: relative;