ここでデモを参照してください: jsfiddle デモ
各アイコンの下にテキストを含む一連のアイコンを含むテーブルがあります。
カーソルがホバーすると、テキストの背景とフォントが変更され、画像がリンクの一部になるはずです。
問題は、画像の下にテキストを移動するために使用される段落タグです。
デモから:
Link1: リンクの背景とフォントの変更。よし、今度は a タグを img の外に移動する...
Link2: リンクの背景は変わらず (?!)、フォントは変わるが、画像はリンクの一部。
リンク 3: これは望ましい動作ですが、[a] タグと [p] タグが一致していません。
誰かが説明できますか
- 段落タグが背景の色の変化を「ブロック」しているように見えるのはなぜですか?
- タグの不一致により、これが機能するのはなぜですか?
- この動作を実装するためのよりクリーンな方法はありますか? (不一致タグなし)
ありがとう！