在台式机与移动设备上放置背景图片

Question

我正在建立一个新的Wordpress网站，并被困在如何放置我的徽标（标题图像）/背景图像的位置上。下面的照片是我希望它的外观以及当前在桌面上的外观。但是，它在移动设备上受到限制，我认为这与我的设置方式有关...

我的标题图像实际上是透明的，您看到的是背景图像。所以我的问题是，有没有办法我也可以将其正确放置在移动设备上？或者，有更好的方法吗？

我选择将其设置为背景图像而不是标题图像的原因是，我不确定如果将其设置为标题图像，如何真正将其触摸到页面顶部。

如果您想查看我的实际网站，it's here。我正在使用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;
    }
}