前提・実現したいこと
Vuetify.jsのText fieldをカスタマイズし、一部コンポーネント内でのみラベルの色を変えたい。
発生している問題
<sytle> だと全画面に適用されてしまい、<style scoped> だとDeepSelectorを
使用しても適用されない。
試したこと
Vue-cliで環境構築直後、HellowWorld.vueを以下のように書き換え。
(vue init vuetifyjs/webpack vuetify-testで構築)
<template> <v-container> <v-text-field label="ラベル" ></v-text-field> </v-container> </template> <style scoped> </style>
style部分を変えてみたが、以下のようにうまくいかなかった。
パターン1
<style scoped> .theme--light.v-label >>> hoge{ color:red } </style>
→ まったく反映されない。
パターン2
<style> .theme--light.v-label { color:green; } </style>
→ 全てのコンポーネントで適用されてしまう。
お分かりになる方がいましたら、ご教授願います。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/10/29 02:10