¿Cómo cambio el texto hover y el color de fondo del menú de encabezado?

Desarrollador
,
1

¿Cómo cambio el color del texto y del fondo al pasar el cursor sobre el menú del encabezado?
¿No tengo experiencia con CSS?

¡El código y dónde colocarlo sería útil, gracias!

@vinothkannans

2

Hola @rickwatson, aquí tienes algo de código para ayudarte. Necesitarás actualizar los valores de color/color de fondo para que se adapten a cómo quieres que se vea. Colocarlos en la pestaña common.css debería funcionar.

Color de fondo del menú de encabezado:

.b-header {
   background-color: var(--tertiary);
}

Enlaces

.b-header .nav-pills li a {
    color: var(--secondary);
}

Enlaces (al pasar el ratón por encima)

.b-header .nav-pills li a:hover {
    color: #001aff;
    background-color: red;
}

En cuanto a los valores que puedes proporcionar a las propiedades color y background-color, consulta aquí para obtener más información. Puedes introducir códigos de color hexadecimales, valores rgba, valores hsa, etc.

Sin embargo, se recomienda siempre que sea posible utilizar variables CSS existentes para poder mantener cosas como el soporte del modo oscuro.

Puedes averiguar qué variables existen en tu sitio y a qué colores corresponden consultando las herramientas de desarrollador de tu navegador (:link: cómo acceder).

Una vez abierto, consulta en la pestaña Estilos las declaraciones en color_definitions.scss en el selector :root.

example
example814×1394 189 KB

3 Me gusta
3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.