Kita tahu bahwa ada dua cara untuk mereferensikan CSS eksternal di halaman web, yaitu: @import dan link. Kita sering mendengar orang mengatakan lebih baik menggunakan link untuk memperkenalkan CSS, tapi tahukah Anda alasannya?
link 
Contoh Kode Sumber
[www.downcodes.com] Tautan untuk menghubungkan CSS eksternal ke halaman web. Bentuk spesifiknya adalah <link href="http://www.downcodes.com/styles.css" type="text/css" />
Contoh Kode Sumber
[www.downcodes.com] Perbedaan antara import dan link adalah dapat memasukkan beberapa file CSS lain ke dalam satu file CSS. Bentuk spesifiknya adalah <style type="text/css">@import url("http://www.downcodes.com/ style. .css");</gaya>
Mengapa menggunakan @import
Kebanyakan orang menggunakan @import karena browser lama tidak mendukung @import, yang berarti kita dapat menggunakan @import untuk memperkenalkan gaya CSS yang hanya dapat diurai oleh browser modern.
Gunakan kode berikut untuk mencegah browser IE6 dan di bawahnya menguraikan CSS (metode di bawah IE6 dalam keadaan rusak dan akan dihilangkan di sini)
@import url(../style.css) layar;
Alasan utama lainnya adalah ketika halaman web Anda perlu memasukkan beberapa file CSS eksternal. Anda perlu menggunakan link untuk memperkenalkan CSS, dan kemudian menggunakan metode @import untuk memasukkan beberapa file CSS lainnya ke dalam file CSS ini.
Mengapa menggunakan tautan
Salah satu alasan utama menggunakan metode link adalah Anda dapat mengizinkan pengguna untuk mengganti gaya CSS. Browser modern seperti Firefox, Opera, dan Safari semuanya mendukung atribut rel="alternate stylesheet" (yaitu, Anda dapat memilih gaya yang berbeda. di browser). Tentu saja, Anda juga dapat menggunakan Javascript untuk mengaktifkan IE guna mendukung perubahan gaya pengguna.
Masalah kecil dengan @import. Jika tag head halaman web Anda sangat sederhana, hanya dengan atribut @import. Saat pengguna menjelajah dengan kecepatan Internet yang lambat, dia akan melihat halaman tanpa gaya, dan kemudian file CSS akan muncul diunduh. Anda dapat melihat gaya yang tepat. Untuk menghindari masalah ini, Anda perlu memastikan bahwa setidaknya ada satu skrip atau tag tautan di kepala.
Metode mana yang harus digunakan? Saat ini, sepertinya untuk website kecil lebih tepat (atau lebih populer) menggunakan link. Tentu saja, jika kita perlu memodulasi CSS di masa mendatang, kita pasti akan menggunakan @import.
Artikel ini sebagian diterjemahkan dari Apa Perbedaan Antara @import dan tautan untuk CSS untuk tujuan pembelajaran, selamat menambahkan.
