0
344
Vistas¿Cómo leo esto? Esta pestaña virtual está creando un botón y configurando sus propiedades, pero ¿cuál de estas propiedades es responsable del color del texto?
La pestaña V que se muestra a continuación crea este botón (el de la derecha ) en la barra de la aplicación virtual
<v-tab :to="'/demo'" active-class="text--primary" class=" font-weight-bold white--text v-btn v-btn--depressed v-btn--flat v-btn--outlined theme--dark deep-purple--text text--accent-4 mx-1 my-2 " min-width="96" text >{{ $i18n.t("Registration") }} </v-tab> <v-tab :to="'/registration'"> </v-tab>Lo que quiero preguntar es cómo leo [ class = "" ] de la v-tab y cuál de las propiedades es responsable del color de fondo de v-btn y el color del texto.
Lo que entendí hacer para v-btn--outline crea un botón delineado, v-btn--flat flat o round, mx1 y my-2 margins.
¿Qué están haciendo white--text , theme--dark , text--accent-4 , deep-purple--text ? y si quiero que el botón cambie a
<v-btn outlined color="#0e2672" elevation="2" dark large @click="login" :loading="loading" >{{ $i18n.t("Demo") }}</v-btn >¿Qué cambios en la sección v-tab debo hacer? Y también me gusta obtener cualquier material de referencia que me ayude a entender todo esto.
1 Respuestas
Responde la pregunta0
Información básica y recursos
Muchos desarrolladores hoy en día usan 'clases de utilidad', bibliotecas que configuran estilos automáticamente de acuerdo con el nombre de la clase ( Leer más ).
Cómo saber cuál afecta el fondo
Este es el caso aquí también. Para saber qué propiedad de clase genera el color del botón, puede:
- consulte la hoja de estilo de esta clase.
- O busque en la documentación de la biblioteca de estilo (busque en la parte superior de la página html los enlaces para saber qué biblioteca es)
- O Genere div de demostración y agregue clases para ver cómo reacciona cada clase / elimine gradualmente las clases de su elemento.
Esto es todo lo que puedo ayudar sin ver el código completo (tal vez dar algún enlace a la fuente). Aunque algunas veces las respuestas genéricas son mejores ya que podemos aprender más de ellas. Espero que esto haya sido útil.
Mi conjetura: theme--dark es la única que afecta el color.
Para cambiar el fondo
color que puede:
- intente agregar alguna clase de acuerdo con esta biblioteca
- O simplemente use:
style="background-color: skyBlue”dentro de este elemento de pestaña V.