Un usuario preguntó 👇
Hola.
¿Cómo cambio el color de fondo de la pestaña en la vista del producto? Los sujetos anteriores tienen CSS para cambiar el color de las pestañas al pasar el mouse.
¿Y también es posible cambiar el color del catálogo?
Muchísimas gracias.
Lanzador de hilos
(@heroprint)
Hace 2 años, 6 meses
Para el color del catálogo anterior en lugar de los 3 colores estándar.
(@etoilewebdesign)
Hace 2 años, 5 meses
Su enlace va a una página sin errores.
Puede usar CSS personalizado para el color de la pestaña, al igual que cualquier ejemplo que le daríamos anteriormente al hover. Por ejemplo:
.upcp-tabbed-layout-tab {
background: #f0a !important;
}
Puede utilizar CSS personalizado para cambiar el color de la mayoría de los elementos del catálogo. Haga clic con el botón derecho en un elemento y seleccione «Inspeccionar elemento» (o simplemente «Inspeccionar» según el navegador). Luego obtendrá la clase o ID que necesita para su CSS personalizado.
Si se refiere a las pestañas pequeñas en la parte superior del catálogo que le permiten cambiar entre diseños, estas son imágenes y actualmente solo están disponibles en esos colores. En algún momento, esperamos poder convertirlos en íconos de fuentes, lo que dará lugar a más opciones de color.
Esta respuesta fue modificada hace 2 años, 5 meses. Esta respuesta fue modificada hace 2 años, 5 meses. Lanzador de hilos
(@heroprint)
Hace 2 años, 5 meses
Hola. El enlace es ahora https://www.iffl.com.au/gia-certified-loose-diamonds/?&SingleProduct=12
Entonces, cuando uso el CSS anterior
.upcp-tabbed-layout-tab {background: # f0a! importante; }
le
.upcp-tabbed-tabs-menu li # upcp-tabbed-tab: hover {background: # D56093;}
para asegurarse de que los colores de las pestañas cambien
Los colores de las pestañas al pasar el mouse no cambian.
Gracias.
(@etoilewebdesign)
Hace 2 años, 5 meses
Hola heroprint,
¿Puede intentar reemplazar todo este código en su cuadro «CSS personalizado» (antes de hacerlo, asegúrese de tomar una copia del código existente, por si acaso):
.upcp-tabbed-addtl-info-menu, .upcp-tabbed-addtl-info {
display: none;}
.upcp-tab-break {
display: inline;}
.upcp-tabbed-layout-tab {
background: #1e2d3d !important;}
.upcp-tabbed-layout-tab:hover {
background: #990000!important;}
.upcp-tabbed-layout-tab:hover a {
color:#fff;
text-decoration: none;}Para reemplazar el fondo de la pestaña, cambie 1e2d3d con otro color HEX. Para cambiar el fondo flotante, reemplácelo con otro 990000.
Nota: Agregamos «.upcp-tabbed-layout-layout: hover a» para establecer el color del enlace en blanco + eliminar la línea adicional al pasar el mouse
Lanzador de hilos
(@heroprint)
Hace 2 años, 5 meses
Gracias. Funciona a las mil maravillas. Sin embargo, una pregunta. ¿Cómo supiste qué CSS ya agregué :-)?
(@etoilewebdesign)
Hace 2 años, 5 meses
Hola heroprint,
De nada. ¡Me alegro de haber podido ayudar! Podríamos averiguar el CSS usando el menú de desarrollador de Google Chrome (puede usar la consola de desarrollador de cualquier navegador y ver los scripts, CSS y otros componentes cargados por cualquier página).
Lanzador de hilos
(@heroprint)
Hace 2 años, 5 meses
Gracias. Eso está más allá de mi conocimiento 🙂
¿Solucionó tu problema??
0 / 0