css - 通过单击填充来定位 ahref

Question

新手问题在这里。我的所有 li 都有一个带有填充的导航栏，我希望能够在您单击填充时定位 ahref。这可以通过每个 li 的 onclick/javascript 来完成吗？还是有一个简单的 CSS 方法？

我还有一个搜索栏，我也想通过点击它的填充来关注它。我认为这需要类似的方法。

Answer 1

将填充设置为锚点而不是li.

请参阅http://jsfiddle.net/FBsKH/并进行比较。

关于搜索栏，您可以发布一些代码吗？

如果我向 a 添加填充<input type="text" />并在它的填充上单击它，它将获得焦点（在 Firefox 和 Chrome 上测试）。在这里看到它：http: //jsfiddle.net/fnsRu/

编辑：

啊，现在我明白了您对搜索栏的要求。

问题是使用 CSS 的 AFAIK 无法将焦点设置到元素。

那么你就可以：

• 删除填充：http: //jsfiddle.net/fnsRu/3/
• 使用 JavaScript：http: //jsfiddle.net/fnsRu/4/

Answer 2

也许你可以指定：

li.someclass a {
    display: inline-block; //or display:block;
    width: 100%;
    height: 100%;
}

（记得指定父容器的宽度/高度）

不知道我是否说对了

Answer 3

首先，您必须将其设置display:inline-block为链接的属性。然后，从列表项中删除填充并将其应用于链接。

您的 CSS 应反映以下内容：

li a {
 display: inline-block;
 padding: 10px; 
}

这是一个工作示例的小提琴。