时间戳

首页 > 解决方案 > 背景图像伪引号问题

html - 背景图像伪引号问题

问题描述

我正在将背景图像应用于伪元素，它似乎在 codepen 上运行良好。我正在使用与下面完全相同的代码，但在我正在处理的网站上，此规则因无效名称错误而中断。如果我检查元素并在 URL 周围添加引号，它就可以工作。

button::before {  
content: '';
display: block;
width: 22px;
height: 22px;	
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z'/%3E%3C/svg%3E")
}
<button class="Comment-vote-button vote-true" data-voted="false" title="Good Answer"><span class="Comment-vote-count">2</span></button>

就好像浏览器去掉了引号/在这个站点上无法识别它们。很奇怪的问题。我被它难住了。

标签： htmlcss

解决方案

更改''里面的引号""或者你也可以试试``

推荐阅读