aタグで複数のブロック要素を囲むやり方
状態:不明
閲覧数:14,070
投稿日:2010-11-05
更新日:2011-02-21
そもそも、今までこんなことやりたいとも思ったことなかったのだが、ついさっき、ふとやりたいと思ったので試してみた。<br /><br />
▼やりたいと思った理由<br />
実際に、複数のブロック要素を飛び越え、そのまま普通にaタグで囲ったところ、IE8で、該当部分の表示色が指定どおりにならず、またhoverも効かなかったため。なお、リンクは正常に機能したし、ブラウザで言えば、FFでは全く問題なかった。少なくとも、表面上は…。<br /><br />
▼最終的なコード抜粋
<pre class="code"><code>
▼HTML
[url=http://design.w4c.work/" class="hoge]
<div class="hoge">
<h1>ブロック要素1</h1>
<div>ブロック要素2</div>
</div>
[/url]
▼CSS
a.hoge {
display:block;
}
</code></pre>
<br /><br />
▼やり方<br />
１．aタグで囲いたい範囲をdiv等で囲む<br />
２．囲ったaタグ以下のその範囲へ対してクラスを設定し、ブロック要素を指定<br />
※そもそも、<a href～> [/url]
で囲めるのは、インライン要素だけのため<br /><br />
▽div にリンク - 質問・相談ならMSN相談箱<br />
http://questionbox.jp.msn.com/qa2438728.html<br />
▼やりたいと思った理由<br />
実際に、複数のブロック要素を飛び越え、そのまま普通にaタグで囲ったところ、IE8で、該当部分の表示色が指定どおりにならず、またhoverも効かなかったため。なお、リンクは正常に機能したし、ブラウザで言えば、FFでは全く問題なかった。少なくとも、表面上は…。<br /><br />
▼最終的なコード抜粋
<pre class="code"><code>
▼HTML
[url=http://design.w4c.work/" class="hoge]
<div class="hoge">
<h1>ブロック要素1</h1>
<div>ブロック要素2</div>
</div>
[/url]
▼CSS
a.hoge {
display:block;
}
</code></pre>
<br /><br />
▼やり方<br />
１．aタグで囲いたい範囲をdiv等で囲む<br />
２．囲ったaタグ以下のその範囲へ対してクラスを設定し、ブロック要素を指定<br />
※そもそも、<a href～> [/url]
で囲めるのは、インライン要素だけのため<br /><br />
▽div にリンク - 質問・相談ならMSN相談箱<br />
http://questionbox.jp.msn.com/qa2438728.html<br />