Como esconder e mostrar imagens no celular e desktop

Em uma postagem, há 10 imagens.

As primeiras 5 imagens, como ocultar no celular (ainda mostrar no desktop).

As últimas 5 imagens, como ocultar no desktop (ainda mostrar no celular).

Existe algum HTML e CSS razoável para eu fazer o acima?

Muito obrigado, especialistas em Discourse.

Olá,

Acho que a maneira mais confiável é envolver as imagens.

[wrap="hide-mobile"]
... primeiras cinco imagens
[/wrap]

[wrap="hide-desktop"]
... últimas cinco imagens.
[/wrap]

Então, o CSS:

Na aba Mobile:

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

Na aba Desktop:

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

O que você acha?

7 curtidas