2016-09-03 11 views
0

input-fieldに入力されたテキストの色をMaterializeCSSに変更するにはどうすればよいですか? documentationは、ラベルの色や下線を変更する方法を示しますが、テキストの色は変更しません。MaterializeCSSで入力フィールドのテキストの色を変更する方法は?

/* label color */ 
    .input-field label { 
    color: #000; 
    } 
    /* label focus color */ 
    .input-field input[type=text]:focus + label { 
    color: #000; 
    } 
    /* label underline focus color */ 
    .input-field input[type=text]:focus { 
    border-bottom: 1px solid #000; 
    box-shadow: 0 1px 0 0 #000; 
    } 
    /* valid color */ 
    .input-field input[type=text].valid { 
    border-bottom: 1px solid #000; 
    box-shadow: 0 1px 0 0 #000; 
    } 
    /* invalid color */ 
    .input-field input[type=text].invalid { 
    border-bottom: 1px solid #000; 
    box-shadow: 0 1px 0 0 #000; 
    } 
    /* icon prefix focus color */ 
    .input-field .prefix.active { 
    color: #000; 
    } 

文書はまた、sass変数を変更することは可能だと述べている:

ここ

はCSSで入力フィールドを変更するためのCSSテンプレートです。 Sassを使用すると、 変数を変更するだけでこれを達成できます。以下に示す のCSSは固定されていません。使用する内容に応じて、 タイプの属性セレクタを変更する必要があります。

しかし、どの変数が変更可能であるかを明確にしていません。

答えて

2

入力フィールドのラッパー<div>を選択するだけで、テキストの色を変更するCSSクラスが用意されています。 SASSに関するChange an HTML5 input's placeholder color with CSS

を::

.input-field { 
    color:orange; 
} 

フィドル:参照プレースホルダーテキストの色を変更するためのhttps://jsfiddle.net/Lxx2k0fq/

マテリアライズで定義された唯一のグローバルテキストの色がデフォルトでも適用され、そこにあるように見えます入力フィールドに入力します。 _variables.scssには、色の原因となる$ off-black変数があります。 <html>タグに適用されています。変更すると、ページ全体のテキストの色が変更されます。

関連する問題