Cómo ocultar y mostrar imágenes en móvil y escritorio

En una publicación, hay 10 imágenes.

Las primeras 5 imágenes, cómo ocultarlas en dispositivos móviles (aún mostrarlas en escritorio).

Las últimas 5 imágenes, cómo ocultarlas en escritorio (aún mostrarlas en dispositivos móviles).

¿Hay algún HTML y CSS razonable para que yo haga lo anterior?

Muchas gracias, expertos de Discourse.

Hola,

Creo que la forma más fiable es envolver las imágenes.

[wrap="hide-mobile"]
... primeras cinco imágenes
[/wrap]

[wrap="hide-desktop"]
... últimas cinco imágenes.
[/wrap]

Luego, el CSS:

En la pestaña Móvil:

[data-wrap="hide-mobile"] {
    display: none;
}

En la pestaña Escritorio:

[data-wrap="hide-desktop"] {
    display: none;
}

¿Qué opinas?

7 Me gusta