Jadual Kandungan
Apakah beberapa awalan vendor biasa?
Bagaimana menggunakan awalan vendor dalam kod CSS saya?
Apakah kelemahan menggunakan awalan pengeluar?
Bagaimana untuk mengelakkan masalah awalan pengeluar?
Adakah terdapat alternatif untuk menggunakan awalan pengeluar?
Apakah masa depan awalan pengeluar di CSS?
Bagaimanakah awalan vendor mempengaruhi prestasi laman web?
Bagaimana untuk bersaing dengan perkembangan terkini dalam awalan pengeluar?
Rumah hujung hadapan web tutorial css Ia masa untuk memikirkan semula awalan vendor dalam CSS

Ia masa untuk memikirkan semula awalan vendor dalam CSS

Feb 23, 2025 am 08:58 AM

It's Time to Rethink Vendor Prefixes in CSS

mata utama

Penggunaan prefix
    yang meluas dalam
  • dalam CSS menyebabkan sesetengah laman web gagal berfungsi dengan baik tanpa itu, memaksa Mozilla untuk menyokong prefix tidak standard untuk meningkatkan keserasian Firefox dengan halaman web menggunakan -webkit- awalan, Ini konsisten dengan pendekatan Microsoft Edge dan Opera. -webkit -webkit- pemaju dinasihatkan untuk memikirkan semula penggunaan awalan mereka dan menguji keserasian laman web mereka, terutama yang menghilangkan awalan
  • , kerana perubahan baru boleh menjejaskan laman web mereka di Firefox 46 atau 47 prestasi.
  • -moz- Sebagai pasukan Chrome/Blink, Firefox dan Microsoft Edge mencari penyelesaian yang lebih baik, awalan vendor secara beransur -ansur hilang. Memberi awalan vendor bermakna menggunakannya untuk penurunan yang elegan bukan pendekatan yang berdaya maju, dan pemaju harus memastikan penggunaan awalan mereka tidak menghasilkan hasil yang tidak dijangka dalam pelayar bukan webkit.
  • Oleh kerana prefix
menguasai CSS pada rangkaian, sesetengah laman web tidak berfungsi dengan betul tanpa ia. Walaupun ini jelas merupakan tanda bahawa pendekatan pemaju tidak sesuai dalam beberapa tahun yang lalu, ia telah membawa kepada langkah yang agak malang tetapi hampir diperlukan oleh Mozilla. Sehingga Firefox 46 atau 47 (dikeluarkan pada bulan April atau Mei 2016, masing-masing), Mozilla merancang untuk melaksanakan sokongan untuk pelbagai prefix

untuk meningkatkan Firefox dan menggunakan Prefixes (biasanya mudah alih) keserasian laman web. -webkit- -webkit- Ini bukan idea baru, dan Microsoft Edge juga menyokong pelbagai -webkit awalan untuk keserasian. Opera mula melaksanakan awalan

seawal tahun 2012 dan sejak itu telah berpindah ke enjin Blink berasaskan Webkit.

-webkit- w3c dan pengeluar penyemak imbas tidak berhasrat menggunakan awalan pengeluar di laman web pengeluaran: -webkit-

"Kenyataan dasar rasmi W3C, anda tidak boleh menggunakan atribut eksperimen dalam kod pengeluaran, tetapi orang ramai lakukan kerana mereka mahu membuat laman web kelihatan sejuk dan tinggal di barisan hadapan teknologi."

Walau bagaimanapun, pemaju di mana -mana mahu menggunakannya secepat mungkin untuk mengakses ciri -ciri terkini. Walaupun awalan telah menyebabkan kekeliruan kerana dominasi Webkit, saya fikir mereka telah berjaya membantu rangkaian berkembang pesat. Pendekatan Mozilla dan Microsoft mungkin tidak berbahaya kepada kebanyakan laman web. Kebanyakan laman web dalam talian mungkin telah memasukkan awalan
, atau anda akan mendapati bahawa kemas kini Mozilla tidak memerlukan tindakan untuk meningkatkan keserasian laman web mereka. Walau bagaimanapun, sebagai pemaju web profesional, kita perlu teliti dan memahami bahawa beberapa reka bentuk mungkin mempunyai hasil yang tidak normal. Anda mungkin sudah tahu yang mana karya anda mungkin terganggu oleh kemas kini.

pemaju, sudah tiba masanya untuk memikirkan semula bagaimana anda menggunakan awalan dan menguji laman web ini.

-moz- awalan yang terlibat

Mozilla mungkin perlu memasukkan satu siri -webkit- awalan. Setakat yang saya faham, Mozilla tidak akan memadankan senarai awalan -webkit- yang disokong oleh Edge, kerana tidak semua ini mungkin memerlukan memastikan enjin susun atur Gecko Mozilla serasi dengan rangkaian yang lebih luas.

Menurut pernyataan mereka di halaman wiki pada keserasian/keserasian mudah alih/tidak standard, awalan yang boleh diterima oleh Mozilla termasuk:

  • -webkit-flexbox
  • kecerunan awalan -webkit-
  • -webkit-transforms
  • -webkit-transitions
  • -webkit-appearance
  • -webkit-background-clip
  • -webkit-device-pixel-ratio
  • Beberapa ciri lain juga boleh terjejas, seperti
  • . -webkit-animation
  • Ujian silang penyemak imbas adalah penting -webkit-border*
Jika anda adalah pemaju web yang menghilangkan awalan

untuk mengelakkan keperluan untuk menguji ciri CSS yang lebih baru di Firefox -mari anda menganggap anda tergesa -gesa dan pelanggan anda memaksa anda untuk berbuat demikian -anda akan memerlukan retest Tapak di Firefox 46 atau 47. Versi Firefox ini akan dikeluarkan pada bulan April atau Mei, jadi anda mempunyai sedikit masa untuk merancang lebih awal. @-webkit-keyframes

Untuk menguji laman web anda sebelum perubahan ini tiba di Firefox 46/47, anda boleh mengakses status semasa perubahan dalam Firefox setiap malam melalui pilihan

dalam . Jika anda mempunyai versi malam terkini yang dipasang, ia harus ditetapkan ke secara lalai. Tidak semua

perubahan awalan telah muncul di Firefox setiap malam, tetapi ini adalah di mana anda boleh menguji penampilan semasa anda. Saya cadangkan menunggu sehingga sekitar bulan Mac untuk menggunakan Firefox setiap malam untuk ujian yang lebih teliti.

-moz- Lebih segera, Microsoft Edge telah menafsirkan dan mempamerkan awalan

dengan cara ini. Ini bermakna bahawa mana -mana gaya khusus WebKit yang termasuk dalam laman web anda mungkin telah dipaparkan dalam penyemak imbas yang anda tidak jangkakan. Jika anda belum melakukannya, lawati Microsoft Edge di Windows 10 dan uji laman web ini!

about:config layout.css.prefixes.webkit awalan pengeluar hilang true -webkit-

bernasib baik, awalan vendor nampaknya hilang apabila pasukan penyemak imbas mencari penyelesaian yang lebih baik. Pasukan Chrome/Blink tweaked pendekatan mereka:

-webkit-

"Looking forward, kami tidak akan lagi menggunakan awalan vendor untuk membolehkan ciri lalai, tetapi sebaliknya meninggalkan ciri (unprefixed) di belakang membolehkan platform web eksperimen mempunyai bendera dalam

sehingga ciri itu siap untuk lalai sehingga diaktifkan. " - Chrome/Blink Team

Pasukan Firefox bergerak ke arah pendekatan yang sama:

"dengan syaratnya sendiri, trend semasa dalam Mozilla adalah untuk mengelakkan awalan vendor dengan mematikan ciri -ciri sebelum pelepasan atau penerbitan ciri tanpa awalan jika mereka cukup stabil. Sekurang -kurangnya sebagai strategi umum; pengecualian mungkin diperlukan untuk kes -kes tertentu . " - Boris dari Mozilla

Microsoft Edge bertujuan untuk menghapuskan sepenuhnya sokongan untuk awalan:

"Microsoft juga menyingkirkan awalan vendor Edge. Ini bermakna agar para pemaju memanfaatkan ciri -ciri HTML5 atau CSS khas, mereka tidak perlu menggunakan awalan kelebihan tertentu. kepada piawaian web

tidak ada lagi downgrade yang elegan melalui awalan

Pindah dari awalan pengeluar bermaksud satu aspek - penurunan yang elegan melalui awalan pengeluar jelas tidak dapat dilaksanakan.

menggunakan awalan vendor untuk mencari pelayar tertentu (contohnya, kandungan khusus untuk Chrome sahaja) bukanlah niat awalan vendor; Jika anda menggunakan ciri yang bergantung pada atribut prefix, dan anda dengan elegan menurunkan reka bentuk pada pelayar lain menggunakan awalan, ini tidak akan berfungsi lagi.

-webkit- -o- Kesimpulan

masa berubah. Penguasaan WebKit secara tidak sengaja membawa kepada perpecahan rangkaian dan ketidakserasian, dan pelayar lain cuba meningkatkan keserasian mereka untuk mengikuti kadar dengan melaksanakan awalan . Walaupun masalah ini harus hilang kerana awalan vendor dihentikan, pemaju perlu memeriksa bahawa penggunaan awalan mereka tidak menghasilkan hasil yang tidak dijangka dalam pelayar bukan webkit.

-webkit- pautan berguna

dokumentasi niat mozilla mengenai perubahan ini

    penjejakan pepijat Mozilla untuk isu ini di Bugzilla
  • Versi terbaru Microsoft Edge menyokong WebKit API
  • Dokumentasi untuk memperkenalkan awalan
  • ke dalam standard hayat dalam talian
  • Laporan Daftar mengenai Perubahan Keserasian WebKit Firefox -webkit-
  • soalan yang sering ditanya mengenai awalan pengeluar dalam CSS

Apakah awalan vendor dalam CSS dan mengapa anda menggunakannya?

awalan vendor adalah cara untuk pengeluar pelayar menambah ciri CSS baru sebelum mereka menjadi sebahagian daripada spesifikasi CSS rasmi. Mereka digunakan untuk memastikan bahawa ciri -ciri baru ini tidak mengganggu ciri -ciri sedia ada dalam pelayar lain. Ini membolehkan pemaju untuk bereksperimen dengan ciri -ciri baru dan memberi maklum balas kepada proses spesifikasi CSS.

Adakah awalan vendor masih diperlukan dalam pembangunan web moden?

Keperluan awalan vendor selalu menjadi topik perdebatan di kalangan pemaju web. Walaupun mereka pernah menjadi penting untuk memastikan keserasian penyemak imbas, Web moden telah menyaksikan penyeragaman yang signifikan keupayaan CSS di kalangan pelayar yang berbeza. Oleh itu, permintaan untuk awalan vendor dikurangkan, tetapi dalam beberapa kes ia masih digunakan untuk fungsi eksperimen.

Apakah beberapa awalan vendor biasa?

Beberapa awalan vendor biasa termasuk -webkit- (Chrome, safari, versi opera yang lebih baru), -moz- (Firefox), -o- (lama, versi opera pra-webkit), dan -ms- (Internet Explorer dan Microsoft Tepi).

Bagaimana menggunakan awalan vendor dalam kod CSS saya?

Untuk menggunakan awalan vendor, tambahkannya sebelum harta CSS dalam lembaran styleshe. Sebagai contoh, untuk menggunakan atribut border-radius dengan awalan vendor Firefox, anda boleh menulis -moz-border-radius: 10px;.

Apakah kelemahan menggunakan awalan pengeluar?

Kelemahan utama menggunakan awalan vendor ialah mereka membuat kod CSS anda lebih kompleks dan lebih sukar untuk dikekalkan. Setiap penyemak imbas mempunyai awalan vendor sendiri, jadi anda mungkin perlu menulis beberapa baris kod untuk harta CSS tunggal. Di samping itu, awalan vendor boleh menyebabkan isu pengesahan kod kerana mereka bukan sebahagian daripada spesifikasi CSS rasmi.

Bagaimana untuk mengelakkan masalah awalan pengeluar?

Satu cara untuk mengelakkan isu awalan vendor adalah menggunakan preprocessor CSS seperti SASS atau kurang, yang secara automatik menambah awalan vendor ke kod anda. Pilihan lain ialah menggunakan postprocessor seperti AutoPrefixer, yang boleh menambah awalan vendor berdasarkan penyemak imbas yang ingin anda sokong.

Adakah terdapat alternatif untuk menggunakan awalan pengeluar?

Ya, ada alternatif untuk menggunakan awalan vendor. Alternatifnya ialah menggunakan perpustakaan pengesanan ciri seperti ModernIZR, yang membolehkan anda menguji ciri CSS tertentu dan menyediakan penyelesaian sandaran untuk penyemak imbas yang tidak menyokongnya. Alternatif lain ialah menggunakan grid CSS atau Flexbox, yang kini disokong secara meluas dan tidak memerlukan awalan vendor.

Apakah masa depan awalan pengeluar di CSS?

Masa depan awalan pengeluar di CSS tidak pasti. Walaupun mereka masih digunakan dalam beberapa kes, trend ini adalah untuk bergerak ke arah penyeragaman dan penggunaan pengesanan fungsi dan bukannya awalan vendor. Walau bagaimanapun, mereka mungkin kekal sebagai sebahagian daripada persekitaran CSS untuk masa depan yang boleh dijangka.

Bagaimanakah awalan vendor mempengaruhi prestasi laman web?

awalan vendor boleh menjejaskan prestasi laman web kerana mereka meningkatkan saiz kod CSS. Walau bagaimanapun, kesannya biasanya kecil, terutamanya jika anda menggunakan pemampat CSS untuk memampatkan kod anda.

Bagaimana untuk bersaing dengan perkembangan terkini dalam awalan pengeluar?

kerana sifat pembangunan web yang pesat berubah, menjaga perkembangan terkini dalam awalan vendor boleh mencabar. Walau bagaimanapun, ia boleh membantu mengikuti blog, forum, dan akaun media sosial yang berkaitan dengan CSS. Di samping itu, laman web Kumpulan Kerja CSS dan Rangkaian Pemaju Mozilla adalah sumber yang sangat baik untuk mengikuti maklumat terkini.

Atas ialah kandungan terperinci Ia masa untuk memikirkan semula awalan vendor dalam CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1662
14
Tutorial PHP
1261
29
Tutorial C#
1234
24
Fon Font Google Fon Fon Font Google Fon Apr 09, 2025 am 10:42 AM

Saya melihat Font Google melancarkan reka bentuk baru (tweet). Berbanding dengan reka bentuk besar yang terakhir, ini terasa lebih berulang. Saya hampir tidak dapat memberitahu perbezaannya

Cara membuat pemasa undur animasi dengan HTML, CSS dan JavaScript Cara membuat pemasa undur animasi dengan HTML, CSS dan JavaScript Apr 11, 2025 am 11:29 AM

Pernahkah anda memerlukan pemasa undur dalam projek? Untuk sesuatu seperti itu, mungkin semula jadi untuk mencapai plugin, tetapi sebenarnya lebih banyak lagi

Panduan Atribut Data HTML Panduan Atribut Data HTML Apr 11, 2025 am 11:50 AM

Semua yang anda ingin tahu mengenai atribut data dalam HTML, CSS, dan JavaScript.

Bukti konsep untuk menjadikan sass lebih cepat Bukti konsep untuk menjadikan sass lebih cepat Apr 16, 2025 am 10:38 AM

Pada permulaan projek baru, kompilasi SASS berlaku dalam sekejap mata. Ini terasa hebat, terutamanya apabila ia dipasangkan dengan BrowserSync, yang dimuat semula

Bagaimana Kami Membuat Tapak Statik yang Menjana Corak Tartan Di SVG Bagaimana Kami Membuat Tapak Statik yang Menjana Corak Tartan Di SVG Apr 09, 2025 am 11:29 AM

Tartan adalah kain berpola yang biasanya dikaitkan dengan Scotland, terutamanya kilt bergaya mereka. Di Tartanify.com, kami mengumpulkan lebih dari 5,000 Tartan

Cara Membina Komponen Vue dalam Tema WordPress Cara Membina Komponen Vue dalam Tema WordPress Apr 11, 2025 am 11:03 AM

Arahan template inline membolehkan kita membina komponen Vue yang kaya sebagai peningkatan progresif ke atas markup WordPress yang sedia ada.

PHP adalah A-OK untuk templat PHP adalah A-OK untuk templat Apr 11, 2025 am 11:04 AM

Templat PHP sering mendapat rap buruk untuk memudahkan kod subpar - tetapi itu tidak perlu berlaku. Mari kita lihat bagaimana projek PHP dapat menguatkuasakan asas

Pengaturcaraan sass untuk mencipta kombinasi warna yang boleh diakses Pengaturcaraan sass untuk mencipta kombinasi warna yang boleh diakses Apr 09, 2025 am 11:30 AM

Kami sentiasa mencari untuk menjadikan web lebih mudah diakses. Kontras warna hanya matematik, jadi Sass dapat membantu menutup kes -kes kelebihan yang mungkin dilewatkan oleh para pereka.

See all articles