Question

有一个页面显示一些按钮（背景图像等），它们都是可点击的。我想要这个特定按钮做的是使用* target =“_ blank”*在另一个浏览器选项卡中打开目标页面。它被设置为 div 中的href的方式我无法做到这一点。关于解决这个问题的任何想法？

<div class="dashboard_navbutton" href="Home/RequestRedirect" style="background-image: url('@Url.Content("~/Content/images/Form_button.png")');">
    <p>Insert witty text here</p>
</div>

Answer 1

只需将div设为a，然后将display:block;添加到style。

编辑：确保您选择的DOCTYPE支持在p元素中使用a。更一般地说，它应该使用display的计算样式而不是标记名称来确定元素是inline还是block。我相信HTML5很好：<!DOCTYPE html>。

Answer 2

为div捕获onclick事件，调用javascript函数，将函数打开窗口。

html代码段的onclick = “opennewwin（）”

function opennewwin(){
    var awindow = window.open(loc, "blank", "height=500px,width=500px");

}

Answer 3

我试图动态添加也可以用作链接的 div。这是我使用 CSS 的解决方案。

首先容器需要相对定位。

.container {position: relative;}

接下来，链接需要填充容器。

.container a {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}

就像我说的，我动态组装了 div，但 html 看起来像这样：

<div class='container'>[some other content]<a href="link"></a></div>

容器必须是位置相对的，否则位置绝对链接会填充它的第一个位置相对祖先（可能是整个视口）。当然，您可以为 div 或链接添加样式。请注意，我使用的是 position:sticky nav-bar，我不得不将它的 z-index 设置为高以避免与 div 按钮发生冲突。

优点：您为链接设置的任何样式和定位都将适用。良好的“风格”：不会将块元素放在内联中（应该避免浏览器问题，尽管我还没有对其进行彻底的测试）。不需要任何其他语言或框架。

缺点：不像 Niet 的回答那么简单，但不应该依赖于 Doctype。

如何在DIV标签中设置target =“_ blank”？

3 个答案: