html - 如何使用图标作为 'background-image' 而不是 CSS 中的图像

标签 html css icons font-awesome-5

我想使用图标作为背景图像而不是使用任何图像。有什么办法吗?

通常我们将'background-image'写成:

背景图片:url(...)

但我想使用字体图标作为背景。有没有办法在

里面写fontawesome图标的Unicode

url()

请帮助我,CSS 专家。

最佳答案

您可以获得任何 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;
}

enter image description here

关于html - 如何使用图标作为 'background-image' 而不是 CSS 中的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57937870/

相关文章:

html - 在 CSS 中为每个标签创建新行

html - 覆盖父 div 的 z-index?

javascript - 隐藏事件元素并在点击时用新元素替换它(javascript)

javascript - 更改复选框状态

html - 对齐文本框旁边的图像

JavaScript 更改光标图标

html - HTML 中的图标未显示在网页上?

java - 应用程序图标不清晰

html - 仅在 Mac 上的 Chrome 中输入时输入字段变小(可能是 CSS-Grid 问题)

javascript - 从 Leaflet 中的图例中删除 ""