Mengapa Saiz Latar Belakang: Sampul Tidak Berfungsi pada Safari Mudah Alih?

Meliputi Imej Latar Belakang pada Safari Mudah Alih

Gelagat unik Safari Mudah Alih dengan saiz latar belakang: harta penutup boleh mengecewakan. Daripada meliputi keseluruhan div, imej selalunya kekal di tengah, tidak terjejas oleh lebar port pandangan. Walau bagaimanapun, isu ini boleh diselesaikan dengan mudah dengan beberapa pengubahsuaian.

Penyelesaian:

Untuk menjadikan imej latar belakang meliputi keseluruhan div, walaupun pada Safari Mudah Alih, laraskan sifat lampiran latar belakang:

.section {
  margin: 0 auto;
  position: relative;
  padding: 0 0 320px 0;
  width: 100%;
}

#section1 {
  background: url(...) 50% 0 no-repeat;
  background-size: cover;
  background-attachment: scroll;
}

#section2 {
  background: url(...) 50% 0 no-repeat;
  background-size: cover;
  background-attachment: scroll;
}

#section3 {
  background: url(...) 50% 0 no-repeat;
  background-size: cover;
  background-attachment: scroll;
}

Bagaimana ia berfungsi:

Dengan menetapkan lampiran latar belakang: tatal, imej kini dibenarkan untuk menatal bersama-sama dengan kandungan halaman. Ini memastikan bahawa imej sentiasa meliputi lebar penuh div, tanpa mengira lebar peranti atau port pandangan.

Penyelesaian ini berkesan menggantikan gelagat saiz latar belakang: penutup pada Safari Mudah Alih, membolehkan anda membuat penuh dengan mudah -imej latar belakang lebar yang bertindak balas kepada saiz skrin yang berbeza.

Atas ialah kandungan terperinci Mengapa Saiz Latar Belakang: Sampul Tidak Berfungsi pada Safari Mudah Alih?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!