Javascript 无法更改swiper next/prev按钮样式

在这里，我尝试将“下一步”的

swiper按钮更改为
#444444
，但是您可以看到我的样式被忽略：


var swiper=新的swiper（“.swiper容器”{
幻灯片视图：3，
幻灯片组：1，
循环：对，
loopFillGroupWithBlank:true，
导航：{
nextEl:“.swiper按钮下一步”，
prevEl:“.swiper按钮prev”，
},
});
.swiper按钮下一步，.swiper容器rtl.swiper按钮上一步{
背景图片：url（数据：image/svg+xml；charset=utf-8，%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%…2L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%2344444'%2F%3E%3C%2Fsvg%3E）！重要；
}
我没有SVG方面的经验，但从CSS中查看URL似乎不完整。可能是复制粘贴错误

background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%…2L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23444444'%2F%3E%3C%2Fsvg%3E) !important;

注意
www.w3.org%..
的
..
看起来不太对劲

运行代码并使用控制台中的inspect复制当前应用的URL，并将填充颜色从
007aff
更改为
444444
可以正常工作

此外，应用的每个URL也包含箭头的形状，因此您可以为
next
和
prev
创建单独的CSS条目


var swiper=新的swiper（“.swiper容器”{
幻灯片视图：3，
幻灯片组：1，
循环：对，
loopFillGroupWithBlank:true，
导航：{
nextEl:“.swiper按钮下一步”，
prevEl:“.swiper按钮prev”，
},
});
.swiper按钮前{
背景图像：url（“数据：image/svg+xml；charset=utf-8，”）！重要；
}
.下一步按swiper按钮{
背景图像：url（“数据：image/svg+xml；charset=utf-8，%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%2344444%2F%3Csvg”）；
}

@不，实际上它是svg，颜色代码在数据url中。您一定是替换了url的错误部分，或者在某个地方有一个关闭错误的
“
？我只是猜测，因为改变SVG填充颜色似乎在一般情况下起作用：
data:image/SVG+xml；charset=utf-8，
我刚刚用中推荐的
444444
替换了
007aff
。@NarūnasK您在CSS中指定的URL似乎不完整/不完整
www.w3.org%..2L2
这似乎很奇怪。我可以通过使用原始应用的URL并按照您所说的简单地更改填充颜色使其正常工作。是的，这是一个
复制粘贴
错误，因为我从浏览器
开发人员工具
样式部分复制了此URL。