10 formas de ocultar elementos con CSS

Una revisión desde la perspectiva de compatibilidad, accesibilidad, cambios de layout, animaciones, manejo de eventos y rendimiento

1. opacity, filter:opacity()

2. Alfa de color

3. transform

4. clip-path

5. visibility

6. display

7. hidden

8. position

9. Overlay ::after

10. Reducir width y height

[xguru]

Yo casi siempre usaba display:none, así que pensaba: ¿hacía falta llegar a tanto?

Pero está bueno lo de poder ocultarlo sin alterar el layout.

Visto así, parece que la opción 5 o la 3, que además tienen buena compatibilidad, también son bastante útiles.