각도 부품의 각도 재료 스타일 재 지정

각도 부품에 재료 2 <md-input-container>을 사용하고 있습니다. 예를 들어 클래스 중 하나를 재정의하려고합니다. .mat-input-wrapper은 각도 재료로 정의됩니다. 하지만 해당 구성 요소에서만 재정의하려는 및 재정의 페이지의 다른 구성 요소에 영향을주지 않아야합니다.각도 부품의 각도 재료 스타일 재 지정

이

<div class="special"> 
    <md-input-container> 
</div>

CSS는 :

이 @Dylan가 지적한 바와 같이, 당신은

.special md-input-container .mat-input-wrapper { 
    //your css 
}

출처

2017-05-20 nullDev

: host/deep/md-input-container .mat 입력 래퍼 {. . . } – Dylan

@Dylan 감사합니다. 작동합니다. 수락 할 수 있도록 답변으로 게시 해주십시오. – nullDev

사용하는

출처

2017-05-23 12:24:58 nullDev

그냥 내가 뭘 찾고 있었는지, 고마워! –

나는 이곳 저곳을 찾고 있었다! 필자는이 솔루션이 문서의 중요한 부분에 작성되어야한다고 생각합니다. –

것은 div에 랩 : 여기

렌더링 된 요소의 스크린 샷입니다 /deep/을 사용하여 하위 compoenets 내의 CSS를 변경하십시오. 여기에 내가 찾고 있던 대답은 :

:host /deep/ md-input-container .mat-input-wrapper

출처

2017-05-20 18:11:31

요소 내의 div에 적용된 클래스를 타고 싶습니다. 선명도를 위해 렌더링 된 요소 dom 이미지를 추가했습니다. – nullDev

예, 내 코드가 –

입니다. 배치와 관련이 없습니다. 트립? 만일 그렇다면 그는'md-input-container '와 마찬가지로 할 수있다.매트 입력 래퍼 { // 당신의 CSS }' – Ced

선호되는 솔루션은 아마도 자신의 재료 테마 스타일 시트의 스타일을 정의하는 것입니다./deep /를 사용하는 것이 더 이상 사용되지 않습니다. (Angular V 4.3) : https://angular.io/guide/component-styles#special-selectors

이제 자신의 테마 스타일 시트를 정의하는 대신에 :: ng-deep를 사용할 수 있습니다.

그러나, (재 아이콘뿐만 아니라 글꼴 - 가족처럼)

출처

2017-10-05 09:55:58 Messchendorp

':: ng-deep'도 이제 감가 상각됩니다 ... –

필요에가 없습니다 기본 폰트 패밀리를 오버라이드 (override)를 사용하는 경우 부정적인 다시 사용 재질의 아이콘에 영향을 미칠 수있는 NG-깊은 ::를 사용하여 <div class="someCssClassName">으로 감싸십시오. 사용하여 또 다른 '아이'요소에이 적용

mat-card mat-card-content, 
mat-card mat-card-title { 
    color: red; 
}

<mat-card-content> 같은 : 오히려, 카드의 제목과 같은 각도 재료 요소 ..

<mat-card> 
    <mat-card-title> 
     {{title}} 
    </mat-card-title> 
</mat-card>

CSS 스타일을 VS 코드, CSS 편집기에서 마우스를 가져 가면 CSS가 어떻게 렌더링되는지 자세히 알 수 있습니다. 단일 구성 요소에 카드의 여러 용도가있는 경우이 예에서, 물론 <mat-card>...<mat-card-title>

, 당신은 CSS 클래스 이름이 <mat-card class="card-style-1" 같은 요소 자체를 class="card-style-1"을 추가하는 구별을해야합니다보다.

는 CSS : 이것에

mat-card.card-style-1 mat-card-content, 
mat-card.card-style-1 mat-card-title { 
    color: red; 
}

대안은 필요에 따라 각각의 스타일을 다른 카드의 사용을 특정 개별 구성 요소를 만드는 것입니다.

출처

2017-12-15 17:20:02

각도 부품의 각도 재료 스타일 재 지정

답변

관련 문제