html - Ionic 3.x 中的样式 : Ion-Icon with gradient background colour (ion-chip)

标签 html css sass ionic2 ionic3

我正在尝试为图标提供渐变背景。我该怎么做?

我尝试将 ionic 图标放入 ionic 芯片中,如下所示:

<ion-chip class="my-chip">
   <ion-icon name="basket></ion-icon>
</ion-chip

然后在 .css 文件中:

.my-chip{
  color: linear-gradient( 0deg, #color1 0%, #color2 100%) !important;
}

但这没有用。颜色一和颜色二显然是用十六进制代码给出的。

最佳答案

你应该使用background-image

在你的 .css 文件中,

.my-chip{
  background-image: linear-gradient( 0deg, #color1 0%, #color2 100%) !important;
}

关于html - Ionic 3.x 中的样式 : Ion-Icon with gradient background colour (ion-chip),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46027720/

相关文章:

jquery - 单击更改边距然后在第二次单击时恢复

html - 使用 css 替换图像(在 <img/> 标签中)

带有绝对位置的 HTML 打印

css - 如何包含数据驱动的 sass 值?

node.js - 编译时找不到 node-sass 命令

html - 纯粹在 CSS 背景中创建箭头

CSS 垂直对齐

html - 制作一个样式为文本的表单输入 - 总结

html - 样式图片元素

git - 有没有办法部署 CSS 而无需将其提交到 git repo?