2017-05-14 5 views
2

イオン属性で機能しない色属性2.色は通常のIONICタグでは機能しますが、HTMlタグでは機能しません。これで助けてくれますか?コードは以下に書かれています。色属性が機能しないイオン内容タグ内の見出し

<ion-content> 
<div class="page-home"> 
<h1 color="secondary">LOGO</h1> 
<br/> 
<br/> 
<p color="danger">Sign in with social media account</p> 
<div id="socialLogin"> 
    <img src="assets/icon/fb.svg" /> 
    <img src="assets/icon/tw.svg" /> 
    <img src="assets/icon/goo.svg" /> 
</div> 
<ion-list> 
    <ion-item> 
    <ion-label floating color="secondary">Username</ion-label> 
    <ion-input type="text"></ion-input> 
    </ion-item> 
    <ion-item> 
    <ion-label floating>Password</ion-label> 
    <ion-input type="password"></ion-input> 
    </ion-item> 
</ion-list> 
<br/> 
<br/> 
<button ion-button full icon-left> <ion-icon name="log-in"></ion-icon>Login</button> 

<button ion-button clear>Register</button>/ 
<button ion-button clear>Forgot Passowrd</button> 
</div> 

</ion-content> 
+0

通常のhtmlには 'style'を使用しないのはなぜですか? –

答えて

10

ion-textディレクティブを要素に使用してから、色を適用します。それが動作します。

あなたの場合、このようにする必要があります。

<h1 ion-text color="secondary">LOGO</h1> 
<!-- and --> 
<p ion-text color="danger">Sign in with social media account</p> 
0

イオン成分のcolor属性は@Input秒なので、イオンのコンポーネントのためにのみ使用することができます。通常のHTML使用[style.color]="regular css color/name or hash"についてはhttps://ionicframework.com/docs/api/components/button/Button/#input-properties

: は、例えばイオンのドキュメントを参照してください。

「セカンダリ」を使用する場合は、component.tsファイルで宣言する必要があります。

関連する問題