問題描述
我正在使用 Ionic 2 rc0 開發一個應用程序，并且在整個應用程序中有幾個仍然需要樣式的輸入字段.
I am working on an application using Ionic 2 rc0 and have several input fields throughout the application that still need styling.
<ion-item class="su-p3-item">
<ion-label floating class="su-input">Your name</ion-label>
<ion-input type="text" class="su-input"></ion-input>
</ion-item>
ionic 2 輸入接口 http://ionicframework.com/docs/v2/api/components/input/Input/
ionic 2 input api http://ionicframework.com/docs/v2/api/components/input/Input/
具體來說，我需要更改占位符文本的樣式，以及活動時的底部邊框.通過 API，并提供 SASS 變量覆蓋，我無法弄清楚如何覆蓋繼承的邊框樣式和輸入字段的占位符文本.
Specifically, I need to change the styling of the placeholder text, and bottom-border when active. Through the API, and provided SASS variable overrides, i could not figure out how to override the inherited styles for borders and placeholder text for input fields.
除了影響每個輸入所在的特定頁面的這些更改之外，我想避免使用！important"(我不希望更改為全局").
I would like to avoid using '!important' in addition to these changes on affecting the specific page each input is on (I dont want the changes to be 'global').
推薦答案
使用 Ionic2 RC4，您必須在 app.scss 文件中添加以下行:
With Ionic2 RC4, you have to add the following line in your app.scss file:
.text-input::-moz-placeholder {
color: white;
}
.text-input:-ms-input-placeholder {
color: white;
}
.text-input::-webkit-input-placeholder {
text-indent: 0;
color: white;
}
這篇關于Ionic 2 占位符文本樣式的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！