Šta su vendor prefiksi?

Ovo su nestandardni prefiksi koje koriste programeri pretraživača za dodavanje podrške novim ili eksperimentalnim CSS svojstvima pre njihovog zvaničnog odobrenja i uključivanja u standarde. Omogućavaju postepeno uvođenje novih mogućnosti na vebu, ali zahtevaju pažljiv pristup.

Glavni prefiksi:

• -webkit-: Chrome, Safari, Opera (neke verzije), većina mobilnih pretraživača (uključujući Android i iOS).
• -moz-: Firefox.
• -ms-: Internet Explorer, Edge (neke verzije).
• -o-: Opera (stare verzije).

Prilikom korišćenja prefiksa dobavljača, važno je poštovati redosled pisanja: prvo prefiksi, zatim standardna svojstva. Ovo osigurava da kada pretraživači počnu da podržavaju standardno svojstvo, ono ga prepisuje.

.element {
  -webkit-border-radius: 10px; /* Safari verzije 5 i starije */
  -moz-border-radius: 10px; /* Firefox verzije 4 i starije */
  border-radius: 10px; /* Standardno svojstvo */
}

U ovom trenutku, upotreba prefiksa dobavljača je znatno smanjena zahvaljujući aktivnijoj implementaciji novih CSS svojstava od strane svih pretraživača. Međutim, oni mogu biti potrebni za podršku starijih verzija pretraživača ili pri radu sa eksperimentalnim API-jem.

Za automatizaciju upravljanja prefiksima dobavljača često se koristi PostCSS sa Autoprefixer pluginom.

// Primer konfiguracije PostCSS sa Autoprefixer-om
module.exports = {
  plugins: [
    require('autoprefixer')({
      overrideBrowserslist: ['poslednje 2 verzije', '> 1%'] // Podržani pretraživači
    })
  ]
};

Autoprefixer analizira CSS i dodaje potrebne prefikse na osnovu podešavanja kompatibilnosti sa pretraživačima. Ovo pojednostavljuje razvoj i smanjuje verovatnoću grešaka povezanih sa ručnim dodavanjem i upravljanjem prefiksima.