Q&A
#div要素をリンクにしたいです
HTML
1<div class="item-wrapper"> 2 <div class="item-content">aaaa</div> 3 <div class="item-time">time</div> 4</div>
以上のようなdiv要素で構成されているときに
item-wrapper全体をリンクとするにはaタグをどのように記述するべきなのでしょうか？
回答2件
0
ベストアンサー
div全体をaタグで囲めばいいと思います。
html
1<a href="#"> 2 <div class="item-wrapper"> 3 <div class="item-content">aaaa</div> 4 <div class="item-time">time</div> 5 </div> 6</a>
HTML4では<a>タグはインライン要素であるため、ブロックレベル要素を含めることができず、ブロック全体をリンクとして振る舞わせるには工夫が必要でした。
HTML5ではインライン要素/ブロックレベル要素といったタグの分類に変更があり、<a>タグの中に<div>タグなどの元ブロックレベル要素を含めてもよいことになりました。
aタグとは｜コーディングのプロが作るHTMLタグ辞典
投稿2020/04/04 13:47
総合スコア34075
0
html
1<body> 2 <a href="#"> 3 <div class="item-wrapper"> 4 <div class="item-content">aaaa</div> 5 <div class="item-time">time</div> 6 </div> 7 </a> 8 </body>
このようにaタグで全体を囲ってやればリンクが張れます。
ただし、aタグを入れ子構造にすることが非推奨な規約も存在するので注意です。
以前まではaでdivやhxといったタグを囲うことは禁止されていましたが、現在は親要素によってはaタグの中にdivやhタグを入れることが良しとされています。(略)親要素タグのコンテンツモデルがなにかによって、aタグの中にpタグ、aタグの中にaタグ、aタグの中にdivを入れることが可能になるわけです。
投稿2020/04/04 13:41
編集2020/04/04 13:45
総合スコア89
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/04/07 05:38
2020/04/07 07:16