Crear un elemento de detalles que se abre pero nunca se cierra

Los elementos detailsy summaryen HTML son útiles para alternar contenido entre fragmentos de texto. De forma predeterminada, verá el summaryelemento con un triángulo de alternancia (▶︎) al lado. Haga clic en eso para expandir el resto del texto dentro del detailselemento.

Pero digamos que quieres poder hacer clic para abrirlo y eso es todo. Se acabó la interactividad. Vi esto usado en uno de esos diseños de artículos “Leer más”, donde haces clic en el botón “Leer más” y el artículo se expande, pero no hay vuelta atrás.

Comenzaré diciendo que no estoy seguro de que sea una gran idea en general. Eliminar controles simplemente no se siente bien, ni tampoco colocar demasiado contenido importante dentro de un detailselemento. Pero bueno, la Web es un lugar muy grande y nunca sabes lo que podrías necesitar. El hecho de que esto se pueda hacer en unas pocas líneas de HTML/CSS es convincente y podría reducir la necesidad de soluciones más pesadas.

El truco principal aquí es ocultar el resumen cuando los detalles están abiertos.

details[open] summary {  display: none;}

Eso es todo realmente.