簡単。CSS、HTMLのツールチップ(マウスホバーで吹き出しが出てくる)を実装

HTML/CSS

マウスホバーで吹き出しが出てくるツールチップを簡単に設置できるCSSを紹介します。

上にツールチップを表示

◆ HTML

◆ CSS

◆ 実際の挙動

ここをマウスオーバーでツールチップテキストがでる

右にツールチップを表示


HTMLは上に表示する場合も右の場合も、もちろん左や下でも同じです。変わるのはCSSのみ。

◆ HTML

◆ CSS

◆ 実際の挙動

ここをマウスオーバーでツールチップテキストがでる

ピックアップ記事

関連記事一覧

  • コメント ( 0 )

  • トラックバックは利用できません。

  1. この記事へのコメントはありません。