如何将图标用作 'background-image' 而不是 CSS 中的图像
How to use an icon as 'background-image' instead of an image in CSS
我想使用图标作为背景图像,而不是使用任何图像。有什么办法吗?
通常我们将'background-image'写成:
background-image: url(...)
但是我想用一个很棒的字体图标作为背景。有没有办法在
里面写fontawesome图标的Unicode
url()
请CSS专家帮助我。
一种方法是下载图标的 SVG,就像使用其他图像一样使用它,您可以在 font awesome 网站上找到每个图标的 SVG 文件。
SVG 的优点在于它们是矢量,因此无论放大多少都不会造成质量损失。
您可以获得任何 SVG 或 PNG 图标文件并将其用作背景。
例如
https://codepen.io/hisbvdis/pen/XWrBKNp
body {
background: url("https://image.flaticon.com/icons/svg/60/60993.svg") 0 0 / 20px 30px repeat;
}
我想使用图标作为背景图像,而不是使用任何图像。有什么办法吗?
通常我们将'background-image'写成:
background-image: url(...)
但是我想用一个很棒的字体图标作为背景。有没有办法在
里面写fontawesome图标的Unicodeurl()
请CSS专家帮助我。
一种方法是下载图标的 SVG,就像使用其他图像一样使用它,您可以在 font awesome 网站上找到每个图标的 SVG 文件。
SVG 的优点在于它们是矢量,因此无论放大多少都不会造成质量损失。
您可以获得任何 SVG 或 PNG 图标文件并将其用作背景。
例如
https://codepen.io/hisbvdis/pen/XWrBKNp
body {
background: url("https://image.flaticon.com/icons/svg/60/60993.svg") 0 0 / 20px 30px repeat;
}