我正在开发一个网站,我需要在右上角放置一个图像,单击该图像将链接到另一个网站。我在 CSS 文件中创建了这个:
div.image:before {
content:url(http://LinkToMyImage);
max-height: 169px;
max-width: 220px;
position: absolute;
top: 0px;
right: 0px;
}
然后添加这个html:
<div class="image"></div>
它看起来正是我想要的,但它显然不是一个链接,有什么办法可以使其可链接吗?我已经尝试过对 div 的 href 但不起作用。任何帮助是极大的赞赏!谢谢!
最佳答案
您可以通过简单地使用 anchor 标记来完成完全相同的事情。另外,没有必要通过引用您的类所应用的元素来使您的 css 如此具体。与仅使用类名相比,这将花费更长的时间来处理。
如果您需要更高级别的特异性,请使用另一个类名称来定位您的元素。如果将来需要更改标记,避免使用特定元素会使您的代码更加灵活。
将 html 更改为:
<a class="image"></a>
和你的CSS:
.image:before {
content:url('http://LinkToMyImage');
// You should also be able to safely eliminate `display: block;`
// when setting `position: absolute`, but included it just in case you
// experienced problems setting width and height
display: block;
height: 169px;
width: 220px;
position: absolute;
// top 0 is usually inferred when setting position: absolute;
// you should be able to remove this
top: 0px;
right: 0px;
}
关于css - 将 CSS 图像设为链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19648693/