svg图是我在阿里巴巴矢量图标库里面找到的,我测试的代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style type="text/css">
i{
width: 100px;
height: 100px;
background-image: url(back.svg);
}
.icon {
display: inline-block;
background-repeat: no-repeat;
background-size: 100%;
}
</style>
</head>
<body>
<i class="icon"></i>
</body>
</html>
不知道为什么,svg图片显示不出来,而且浏览器也打开svg图片是空白的。
别人的项目可以打开,我引入和他一样的文件也不行,这是为什么呢?
https://github.com/sevenddddd...
iconfont上下载的svg有问题可能性很小。你下载时设置没设置颜色,如果设置了了白色就不会显示,你可以在下载一次,下载前先把颜色设置为黑色,然后用浏览器打开看一下,或者你将body背景色设置为黑色看一看。