Materialize - 양식 스타일 사용 안함

Question

기본 구체화 양식 스타일을 변경할 수 있습니까? 예를 들어 포커스가있는 입력에서 밑줄을 제거하십시오. CSS 스타일을 덮어

는

materialize framework link

Answer 1

쉽게 : 사용자 정의 CSS 스타일 시트를 작성하고 포함하는 구체화 된 CSS 스타일 시트 후. 그런 다음 Materialize가 설정 한 규칙을 찾아 덮어 씁니다. 예를 들어

, 입력 필드 아래의 경계는 다음과 같이 MaterializeCSS에 의해 스타일됩니다

input:not([type]), input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea { 
    background-color: transparent; 
    border: none; 
    border-bottom: 1px solid #9e9e9e; 
    border-radius: 0; 
    outline: none; 
    height: 3rem; 
    width: 100%; 
    font-size: 1rem; 
    margin: 0 0 20px 0; 
    padding: 0; 
    box-shadow: none; 
    box-sizing: content-box; 
    transition: all 0.3s; 
} 

가 border-bottom을 제거하려면, 사용자 정의 CSS 시트에이 규칙 설정 :

input:not([type]), input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea { 
    border-bottom: none; 
} 

을

JS 기능을 사용 중지하는 것이 어렵습니다. 소스 JS 코드를 변경하고 마음에 들지 않는 기능을 제거해야합니다. 당신이 말대꾸를 사용하는 경우

Answer 2

당신은 NPM 또는 정자와 구체화 CSS의 구현 (http://materializecss.com/getting-started.html)

이 수 후 새하는 SCS 파일을 가져올 수 있습니다. Rails Gem (https://github.com/mkhairi/materialize-sass)