当前位置: 首页 > 面试题库 >

HTML / CSS中整个div的href链接

沃皓轩
2023-03-14
问题内容

这是我要在HTML / CSS中完成的工作:

我有不同高度和宽度的图像,但是它们都在180x235以下。所以我要做的是创建一个divwith border及其vertical-align: middle所有。我已经成功地做到了这一点,但是现在我仍然停留在如何正确地href链接整个链接的问题上div

这是我的代码:

<div id="parentdivimage" style="position:relative;width:184px;height:235px;border-width:2px;border-color:black;border-style:solid;text-align:center;">
    <div id="childdivimage" style="position:absolute;top:50%;height:62px;margin-top:-31px;">
        <img src="myimage.jpg" height="62" width="180">
    </div>
</div>

请注意,为了方便复制粘贴到此处,样式代码是内联的。

我读到某个地方,我可以简单地在代码顶部添加另一个父div,然后在其中添加href。但是,根据一些研究,它不是有效的代码。

因此,再次总结一下,我需要将整个div(#parentdivimage)用作href链接。


问题答案:

在HTML5中,在div中使用div在语义上是正确的。

您需要在以下情况之间进行选择:

<a href="http://google.com">
    <div>
        Hello world
    </div>
</a>

从语义上讲这是不正确的,但是它将起作用。

<div style="cursor: pointer;" onclick="window.location='http://google.com';">
    Hello world
</div>

从语义上讲这是正确的,但是涉及使用JS。

<a href="http://google.com">
    <span style="display: block;">
        Hello world
    </span>
</a>

在语义上是正确的,可以按预期工作,但不再是div。



 类似资料:
  • 我目前正在为我的网站使用2倍的谷歌字体。 使用这些谷歌字体设计的单词看起来渲染速度非常慢,我已经放置了http://fonts.googleapis.com/css?family=Open Sans'rel='stylesheet'type='text/css' 但是当我在谷歌字体页面上阅读时,它说,把它放在头标签的第一行之后。 所以我的问题是,我应该遵循Google字体推荐还是Insight字体

  • 问题内容: 我要使整个div可单击,并且在没有JavaScript且没有有效代码/标记的情况下单击时链接到另一个页面。 如果我有这个就是我想要的结果- W3C验证程序说,不应将块元素放置在内联元素内。有一个更好的方法吗? 问题答案: 如果没有javascript且使用有效代码,单击整个div会链接到另一个页面,这可能吗? 小学生回答:不。 正如您已经发表的另一条评论一样,在标签内嵌套一个标记是无效

  • 问题内容: 我正在尝试将表格列分为两列。我希望最右边的列停靠在页面的右边,并且此列应具有不同的背景色。右侧的内容几乎总是小于左侧的内容。我希望右侧的div始终足够高,以到达其下一行的分隔符。如何使背景色填充该空间? 编辑:我同意这个示例非常类似于表,并且实际表将是一个不错的选择。但是我的“真实”页面最终将变得不像表格一样,我只想首先掌握此任务! 另外,由于某种原因,当我在IE7中创建/编辑帖子时,

  • 问题内容: import urllib2 到目前为止,一切都很好。 但是我只希望纯文本HTML中的href链接。我怎么解决这个问题? 问题答案: 尝试使用Beautifulsoup: 如果您只想要以开头的链接,则应使用: 在带有BS4的Python 3中,它应该是:

  • 使用此代码: 和CSS类表单元素: .form-element{margin-bottom:20px;display:grid;grid-template-columns:1fr 1fr auto 1fr;grid-gap:20px;} 所以看起来不错。我想添加1个复选框并使表单看起来如下所示: 使用此代码(只需添加一个复选框输入): null null 我该怎么解决呢?我试图添加auto而不是c

  • 我不知道如何为这个问题设置一个标题。 我想要的是用单击的标记的内容更改DIV内部的内容。问题是,在我的标记中,我有另一个嵌套的DIV和一些文本,我不希望该文本在更改时显示。 如何在更改时只显示标记的内容,而不显示其子div? 这是我的代码和指向JSFiddle的链接 null null https://jsfidle.net/mariokala/zmdjoy9b/28/