离子 - 如何更改文本字段背景颜色？答案

【问题标题】：Ionic - how to change textfield background colour?离子 - 如何更改文本字段背景颜色？
【发布时间】：2015-06-09 17:02:53
【问题描述】：

我已经将文本字段背景颜色设置为透明，但在 Ionic 中不起作用。

.item .item-input {
    background-color: transparent;
}

我已经阅读了 Ionic 文档，但它不起作用。它仍然是白色的。

【问题讨论】：

【解决方案1】：

也许有点小技巧，但是你能不能把文本放在另一个 div 中，并给 div 一个特殊的背景颜色。

所以，是这样的：

.text {
background-colour: red; // or colour: red; I don't know
}

然后将文本放在这个 div 之间。希望能帮助到你。

【讨论】：

【解决方案2】：

您确定您的 css 规则匹配正确的元素吗？

你的规则：

.item .item-input {
    background-color: transparent;
}

匹配具有类 item-input 的元素，该元素是具有类 item 的元素的后代。也许您的意思是以下？：

.item.item-input {
    background-color: transparent;
}

此规则匹配具有类 item 和 item-input的元素。

【讨论】：

【解决方案3】：

.label {
background-color: reba(255, 255, 255, 0.0);
}

然后将 CSS 规则放在 ion-item 元素上，如下所示：

<ion-item class="label">

【讨论】：

【解决方案4】：

在 Angular 中（因为您的问题有 Angular 标签），答案是使用 --background

--background: transparent !important; // example

查看https://ionicframework.com/docs/api/input#css-custom-properties（从列表中选择：Angular 以查看 Angular 相关文档）

【讨论】：