Bagaimanakah Saya Boleh Menggunakan Peraturan CSS Secara Eksklusif pada Google Chrome?

Menggunakan Peraturan CSS Khusus pada Chrome Secara Eksklusif

Untuk memenuhi enjin pemaparan unik Google Chrome, selalunya perlu menggunakan peraturan CSS secara eksklusif kepadanya. Satu contoh ialah melaraskan kedudukan elemen div.

Penyelesaian CSS:

Memanfaatkan awalan vendor, anda boleh menyasarkan gaya khusus Chrome seperti berikut:

• Untuk Chrome, Safari, Edge dan Firefox:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  div {
    top: 10px;
  }
}

• Untuk Chrome 29 (menyokong nilai DPI pecahan)

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
  div {
    top: 0px;
  }
}

• Untuk Chrome 22-28:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  .selector {
    -chrome-only(top: 0px);
  }
}

Penyelesaian JavaScript:

Sebagai alternatif kepada CSS, anda boleh menggunakan JavaScript untuk mengesan penyemak imbas Chrome dan ubah suai gaya div dengan sewajarnya:

if (navigator.appVersion.indexOf("Chrome/") != -1) {
  // Modify the div's top position here
}

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan Peraturan CSS Secara Eksklusif pada Google Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!