Cześć chce osiągnąć na stronie taki efekt:


No i tu się zaczynają problemy, po pierwsze <img> w h1 (ponoć nie jest to zbyt poprawne)
i po drugie chcę aby po zmniejszeniu rozdzielczości do np. takiej telefonowej zamieniło się to na



Z góry dzięki za pomoc.

Struktury nie można zmienić przy użyciu media queries.
Jeśli jednak nie zależy Ci na zmianie struktury, ale tylko tym aby obrazek wizualnie był na zewnątrz <h1>, to można wtedy użyć np. pozycjonowania absolutnego.
Innym rozwiązaniem jest zdublowanie <img>, jeden wewnątrz <h1>, drugi poza. Wtedy w zależności o rozdzielczości ukrywasz jeden z nich.
Gdyby jednak była wymagana zmiana struktury, to pozostaje JS.

Wielkie dzięki, zdublowany img to chyba najlepsze wyjście.