10ヶ月前に投稿

aタグでdivを囲んでみた

この記事は約 2 分で読めます。

4

HTML4では<a>タグはインライン要素であるため、
ブロックレベル要素を含めることができず、
ブロック全体をリンクするには、それこそ
JavaScriptを使って実装？していましたが、

HTML5では、
インライン要素とブロックレベル要素の
分類が廃止され、
<a>タグの中に<div>タグなどの
ブロックレベル要素を含めてもOKになりました。

HTML4.01ではa要素はインライン要素であったため、ブロックレベル要素全体をリンクを指定することはできませんでした。 例えば、段落全体を～で囲んでリンクするような指定方法は認められていませんでした。

HTML5では、インライン要素とブロックレベル要素の分類は廃止されており、 段落・リスト・表などのセクションに対しても、全体を～で囲んでリンクを指定できるようになっています。 ただし、その中に他のリンクやフォームボタンなどのインタラクティブコンテンツが含まれる場合には、リンクを指定することはできません。

ハイパーリンクを指定する
4.5.1. The a element
<a href="#">
  <div>
    <h1>吾輩は猫である</h1>
    <p>吾輩は猫である。名前はまだない。どこで...</p>
    <p class="more">Learn More &raquo;</p>
  </div>
</a>

吾輩は猫である

吾輩は猫である。名前はまだない。どこで生れたか頓（とん）と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

Learn More »
貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました
aタグでdivを囲んでみた

カスタマイズ - HTMLElement,HTML5

Posted by FOUR 4to6