css - html/css 中可点击的 div 列表

Question

我想制作可点击的 div 水平列表。 我得到了这样的东西:

<div id="header">
    <a href="/"></a>
        <ul id="list">
            <li id="column1">
                <div></div>
            </li>
            <li id="column2">
                <div></div>
            </li>   
        </ul>   
</div>

样式:

#header
{
    height: 200px;
    width:500px;
}

a{
  display: block;
  width: 100%;
  height: 100%;
}

问题是，“a”元素与列表不在同一个位置，我希望列表是可点击的。

Answer 1

如果您希望页面上的任何内容都可以点击，请使用 javascript 事件监听器而不是 anchor 标记。

当您希望某个元素可点击时，只需在您的客户端代码上添加一个事件监听器以点击操作并定义您的对象的行为。

仅当您的对象的行为是链接到另一个地方时才使用 anchor 标签。

这将使您的代码更清晰、更易于阅读，也可以更轻松地将每个对象放置在您想要的位置。