时间戳

首页 > 解决方案 > 如何在手机和桌面上制作固定的整页背景图片？WordPress - Divi - CSS

css - 如何在手机和桌面上制作固定的整页背景图片？WordPress - Divi - CSS

问题描述

所以我正在为 WordPress 开发 Divi 网站。

我添加了 CSS 代码，允许我在主页上设置固定的背景图像，但是，在平板电脑和移动设备视图上，图像不会覆盖整个屏幕，页面的一半是白色的。有什么方法可以将固定图像也设置为在移动设备上全屏显示？

这是我得到的代码：

.select_page {
  visibility: hidden;
}

span.mobile_menu_bar:before {
  color: rgba(201,144,0,0.78) !important;
}

.et_mobile_menu {
  border-top: 3px solid rgba(201,144,0,0.78);
}

/* First we have to make the main header transparent */

#main-header {
  background-color: transparent;
}

  #main-header,
  #main-header.et-fixed-header {
    background-color: transparent;
  }

/* Then we turn off the footer */

#main-footer {
  background-color: transparent !important;
}

/* Here we make the content of our page builder sections transparent. This is so that the background image shows through */

.et_pb_section {
  background-color: transparent;
}

/* Here we set the background image for our specific pages. We also set the background image to cover so that it always fills the screen */
.page-id-15 {
  background-image: url("https://ardakarakaya.com/wp-content/uploads/2019/12/ARDA1-1.jpg");
  background-size: cover;
}

header#main-header.et-fixed-header, #main-header {
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important;
}

网站：ardakarakaya.com

亲切的问候

担

标签： csswordpressplugins

解决方案

这个CSS需要改变：

body.custom-background {
...
background-attachment: fixed;
}

推荐阅读