Tengo una duda, acerca del por qué en mi navegador, no se observa el cambio de color en mi hipervínculo inicio.
He colocado la clase .menu__link--activo pero no cambia el color, únicamente se vio cuando lo coloqué de esta forma: .menu__link.activo
¿A qué se debe esto?
<li class="menu__item">
<a class="menu__link--activo" href="">
Inicio
</a>
</li>
.menu__link--activo {
color: #333333;
}
¡Hola Kenia!
El problema que estás experimentando puede deberse a que estás utilizando el modificador "--activo" como si fuera una clase independiente, cuando en realidad es parte de la clase ".menu__link".
Cuando utilizas "--activo" como parte de la clase, estás indicando que ese estilo se aplicará cuando el enlace esté activo, es decir, cuando el usuario haga clic en él. En cambio, cuando lo utilizas como una clase independiente, estás creando una nueva clase que no está relacionada con la clase ".menu__link".
Por lo tanto, para solucionar tu problema, te sugiero que utilices la clase ".menu__link--activo" como parte de la clase del enlace, de la siguiente manera:
<li class="menu__item">
<a class="menu__link menu__link--activo" href="">
Inicio
</a>
</li>
De esta manera, el estilo que has definido en ".menu__link--activo" se aplicará correctamente cuando el enlace esté activo.
Espero que esto te haya ayudado a resolver tu duda. ¡Buenos estudios!