2016-09-03 3 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는 접두사가 붙지 않습니다. 사용하는 항목에 따라 유형 특성 선택기를 변경해야 할 수 있습니다.

그러나 sass 변수를 변경할 수있는 것은 분명하지 않습니다.

답변

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> 태그에 적용되므로 전체 페이지의 텍스트 색상이 변경됩니다.

관련 문제