Vuetify js에서 비활성 필드의 기본 색상을 변경하거나 재정의하는 방법

Vuetify js에서 비활성 필드의 기본 색상을 변경하거나 재정의하는 방법

기본적으로 vuetify는 비활성화된 텍스트 필드/항목에 밝은 회색 음영을 적용합니다.이 색상을 원하는 색상으로 덮어쓰려면 어떻게 해야 하나요?

현재 비활성화된 선택기를 사용하고 있습니다.:disabled { color: #000000 !important; }텍스트 필드 텍스트 색상의 변경에만 도움이 됩니다.내 폼에는 드롭다운과 체크박스가 있습니다.이에 대한 해결책이 있나요?

클래스를 덮어쓰기 위해 텍스트 필드로 시도했지만 작동하지 않습니다만, 모든 양식 입력 요소에 대해 'read only'라는 편리한 소품이 있습니다.'disabled' 대신 'read only'를 사용합니다.

<v-textarea placeholder="Notes" :readonly="true"></v-textarea>
<v-select :items="['Mango', 'Apple']" label="Filled style" :readonly="true"></v-select>

타겟이 될 수 있다

체크박스를 켜다.input-group--disabled.checkbox .input-group__input

드롭 다운을 합니다..input-group--disabled.input-group--select label

.input-group--disabled.checkbox .input-group__input {
    color: #000 !important;
}

.input-group--disabled.input-group--select label {
    color: #000 !important;
}

---

Afaics most classes have --disabled suffix, so perhaps this could work for you (but I didn't test):

[class$="--disabled"],
[class*="--disabled "] * {
    color: #000 !important; 
}

모든 하위 항목을 선택하고 색상을 적용합니다.

.input-group__input *
  color: rgba(0,0,0,0.87) !important

언급URL : https://stackoverflow.com/questions/49450065/how-to-change-override-the-default-color-for-disabled-fields-in-vuetify-js