如何使用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，{ {1}}或height。

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

url

Answer 2

你必须用你的url（）包围你的文件路径：

background-image: url('pic/knap_nyhed_layout_00.png');

Answer 3

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

u您需要在> <这样的文本之间