如何使用CSS将图像添加到锚标记？

Question

我通过使用图像使锚标记看起来像一个按钮,但它在浏览器中没有显示任何内容.

到目前为止这是我的代码......

HTML

<span>
    <a id="knapNyhed" href="file:///E:/Projekt_skolespil/hjemmeside/index.html"></a>
</span>

CSS

.knapNyhed{
    background-image: pic/knap_nyhed_layout_00.png;
    width:226px;
    heigth: 50px;
    margin: 0 2px 0 2px;
}

希望你能帮忙解决为什么我看不到我的按钮

Answer 1

您必须添加display:block或默认设置display:inline-block为a标签display:inline,并且内联元素不能有width,height或margin.

要使背景图像正常工作,您必须添加url.请注意,此网址与您的css文件相关.

#knapNyhed {
  display:block;
  background-image: url(pic/knap_nyhed_layout_00.png);
  width:226px;
  heigth: 50px;
  margin: 0 2px 0 2px;
}