Расположение фонового изображения на рабочем столе и на мобильном телефоне

Question

Я настраиваю новый сайт Wordpress и застрял на том, как разместить мой логотип (изображение заголовка) / фоновое изображение.На фото ниже показано, как я хочу, чтобы оно выглядело и как оно сейчас отображается на рабочем столе.Тем не менее, он отключается на мобильном телефоне, и я думаю, что это связано с тем, как я его настроил ...

Мое изображение заголовка на самом делепрозрачный и то, что вы видите, это фоновое изображение.Итак, мой вопрос, есть ли способ, чтобы я мог правильно расположить его на мобильных устройствах?Или есть лучший способ сделать это?

Причина, по которой я решил установить его в качестве фонового изображения, а не заголовочного изображения, заключается в том, что я не был уверен, как заставить его фактически касаться верхней части.страницы, если установлено в качестве изображения заголовка.

Если вы хотите увидеть мой настоящий веб-сайт, он здесь .Я использую тему Brunch Pro.

Любая помощь или идеи будут очень благодарны!:)

Answer 1

Добавьте этот CSS к файлу style.css активной темы.

@media (max-width: 767px){
    body.custom-background {
        background-image: url(http://gleefulthings.com/WPtestblog/wp-content/uploads/2018/06/backgroundlogo2.jpg);
        background-position: 50% top;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 70% auto;
    }
}