Cómo hacer que una línea aparezca debajo de un enlace activo usando HTML y CSS

Para que una línea aparezca debajo de un enlace activo sin decoración de texto: subrayado; propoerty, aquí estoy sugiriendo otras 2 formas.

Acabo de hacer prácticas las opciones para ayudarlo a comprender mejor.

Primero: con el uso del borde inferior

Aquí está el código HTML

Cómo se ve con el uso de border-bottom:

Este código funciona, pero en el navegador IE encuentro el problema de que no funciona. Entonces, deberíamos mantener display: inline-block property.

Tenemos un efecto de baile, que se puede resolver con el uso de altura de línea.

Segunda solución: uso de Psudo Classed (antes y después)

Captura de pantalla adjunta, cómo funciona con las clases psudo.

¡Espero que estas 2 soluciones resuelvan su problema!

Hola,
Creo que ya sabes la “técnica” que han aplicado. ¿Tiene algún problema con su código?
¿Has probado la propiedad CSS de borde inferior para agregar colores mientras se hace clic en el elemento?

sí, es una buena respuesta, solo aplica un borde en la clase cada vez que estés flotando. encontré un buen recurso para ti mira esto

Agregar un borde a una imagen al pasar el mouse

Sí, puede hacer que una línea aparezca debajo de un enlace activo usando HTML y CSS simplemente aplicando un borde en la clase cada vez que se desplaza.

Para problemas relacionados con HTML y CSS puede contactar: ​​HTMLPanda