aタグ

子要素を親要素の大きさにする

ブロック要素の内側のaタグをその親要素の大きさにしたい場合、2つ

position

親要素の左上を基準にして、子要素を親要素の大きさにするために、まず親要素にposistion:relative, 子要素にposition:absoluteを適用します。また、子要素を親要素の左上に配置するのに、top:0とleft:0を指定し、width:100%, height:100%で親要素の大きさにします。

<div>
	<a href="...">...</a>
</div>

div{
	position:relative;
}
a{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:inline-block;
}

-　aタグを使って要素全体をリンクにする二つの方法

aタグをblock要素にする

aタグはインライン要素のため、aタグはコンテンツ以上の大きさになりません。aタグを親要素の大きさにするには、aタグをブロック要素にすればいいです。

    display:block

-　aタグ（リンク）のクリックできる範囲をCSSで親要素まで広げる

画像をリンクにする

画像をaタグで囲む。