☰

JavaScript を使わずに HTML と CSS で 'div' 全体をクリック可能にするにはどうすればいいですか? [重複] 質問する

tag-icon • tag-icon html css click
JavaScript を使わずに HTML と CSS で 'div' 全体をクリック可能にするにはどうすればいいですか? [重複] 質問する

div 全体がクリック可能になり、JavaScript を使用せず、有効なコード/マークアップを使用してクリックすると別のページにリンクするようにしたいと考えています。

これが私が望む結果である場合、

<a href="#">
<div>This is a link</div>
</a>

W3C バリデーターでは、ブロック要素をインライン要素内に配置すべきではないとされています。これを実行するより良い方法はありますか?

ベストアンサー1

リンクを div 全体に表示して、div がクリック可能であるように見せることも可能です。

CS: ...

#my-div {
    background-color: #f00;
    width: 200px;
    height: 200px;
}
a.fill-div {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
}

HTML:

<div id="my-div">
    <a href="#" class="fill-div"></a>
</div>

おすすめ記事