Question

我正在尝试设置一个锚标记，从页面的底部滚动到顶部，功能正常 - 但我要显示的箭头图标没有显示在链接的CSS中。

HTML

<a href="#" class="anchorScroll" style=""></a>

CSS

/*Anchor to move to top*/

.anchorScroll {
    content:url(https://visualpharm.com/assets/98/Upward%20Arrow-595b40b85ba036ed117dbd06.svg/200x200);
    background: #8994a5;
    color: #fff;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 20px;
    border-radius: 3px;
}

这是一个JS小提琴link.提前感谢任何人提供的任何帮助。

Answer 1

你改变了这个：

props

到此：

content:url(https://visualpharm.com/assets/98/Upward%20Arrow-595b40b85ba036ed117dbd06.svg/200x200);

将“内容”更改为“背景”，将链接添加到引号中，然后删除200x200。

完整代码在这里：

background:url('https://visualpharm.com/assets/98/Upward%20Arrow-595b40b85ba036ed117dbd06.svg');

Answer 2

您需要从内容网址链接中删除 200x200 ，请参阅下文

＆＃13;

.anchorScroll {
    content:url(https://visualpharm.com/assets/98/Upward%20Arrow-595b40b85ba036ed117dbd06.svg);
    background: #8994a5;
    color: #fff;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 20px;
    border-radius: 3px;
}

＆＃13;

<a href="#" class="anchorScroll" style=""></a>

＆＃13;

图像没有从CSS继承

2 个答案: