Haga clic una vez, seleccione todo; Haga clic nuevamente, seleccione normalmente

¡Un auténtico truco de CSS de Will Boyd!

1. Forzar la selección de todo el contenido de un elemento al hacer clic conuser-select: all;
2. Si hace clic por segunda vez, permita que el usuario seleccione solo partes del texto como de costumbre.
3. ¿Segundo clic? Bueno, es un truco. Realmente usando una animación forwardsde finalización retardada @keyframescuando el elemento está dentro :focuspara cambiarlo auser-select: text;

El artículo de Will tiene mucha más información útil y casos de uso para user-select.

Si quieres conocer otros artículos parecidos a Haga clic una vez, seleccione todo; Haga clic nuevamente, seleccione normalmente puedes visitar la categoría Tutoriales.