Les images d'arrière-plan ne peuvent pas être affichées sur iPad.

Question

J'ai placé une image d'arrière-plan sous la barre de navigation afin que lorsque vous faites défiler vers le bas, la barre de navigation descende avec vous. Mais lorsque je le regarde sur mon iPad, je vois que l'image d'arrière-plan apparaît d'un bleu foncé proche du noir.

.background__image {
  largeur : 100 % ;
  image d'arrière-plan : url("https://background-image.jpg");
  répétition d'arrière-plan : pas de répétition ;
  position d'arrière-plan : centre centre ;
  pièce jointe d'arrière-plan : corrigé ;
  taille de l'arrière-plan : couverture ;
  hauteur : 800px ;
  alignement du texte : centre ;
  affichage : flexible ;
  justifier-contenu : centre ;
}

            

Answer 1

.background__image {
  width: 100%;
  background-image: url("https://background-image.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  background-size: cover;
  height: 800px;
  text-align: center;
  display: flex;
  justify-content: center;
}

@media (max-width: 768px) {
  /* Adjust the max-width value as needed */
  .background__image {
    background-attachment: scroll;
  }
}

尝试使用媒体查询设置最大宽度为768px（根据您的需求进行调整），以针对较小的屏幕，如iPad或其他移动设备。在媒体查询内部，将background-attachment属性设置为scroll，使背景图片能够随内容在这些设备上一起滚动。