リンク(aタグ)は文字の部分しかクリックすることができませんが、
これを拡張して文字以外の部分もクリック可能にするサンプルです。
(例)
サンプル
例)aタグを囲っているpタグいっぱいまでクリックできるようにする
aタグに対して、display:block;を指定すればOKです。
1 2 3 4 |
a.sample{ width:100%; display:block; } |
1 2 3 |
<p> <a href="#" class="sample">リンク拡張</a> </p> |
【結果】
リンク文字以外の部分もクリックできるようになっています
備考
- スマホ向けサイトなどではユーザビリティ向上のために指定する事をお勧めします。
コメント