Мы знаем, что существует два способа ссылки на внешний CSS на веб-страницах, а именно: @import и link. Мы часто слышим, как люди говорят, что для представления CSS лучше использовать ссылку, но знаете ли вы, почему?
связь 
Пример исходного кода
[www.downcodes.com] Ссылка предназначена для подключения внешнего CSS к веб-странице. Конкретная форма: <link href="http://www.downcodes.com/styles.css" type="text/css" />.
Пример исходного кода
[www.downcodes.com] Разница между импортом и ссылкой заключается в том, что он может включать несколько других файлов CSS в один файл CSS. Конкретная форма — <style type="text/css">@import url("http://www.downcodes.com/styles. .css");</style>
Зачем использовать @import
Большинство людей используют @import, потому что старые браузеры не поддерживают @import, а это означает, что мы можем использовать @import для введения стилей CSS, которые могут анализировать только современные браузеры.
Используйте следующий код, чтобы запретить браузерам IE6 и ниже анализировать CSS (методы ниже IE6 находятся в нерабочем состоянии и здесь будут опущены)
экран @import url(../style.css);
Другая основная причина заключается в том, что на вашей веб-странице необходимо добавить несколько внешних файлов CSS. Вам нужно использовать ссылку, чтобы представить CSS, а затем использовать метод @import, чтобы добавить несколько других файлов CSS в этот файл CSS.
Зачем использовать ссылку
Одна из основных причин использования метода ссылки заключается в том, что вы можете разрешить пользователям переключать стили CSS. Современные браузеры, такие как Firefox, Opera и Safari, поддерживают атрибут rel="alternate stylesheet" (то есть вы можете выбирать разные стили). в браузере). Конечно, вы также можете использовать Javascript, чтобы IE поддерживал изменение стилей пользователями.
Небольшие проблемы с @import. Если заголовок вашей веб-страницы очень простой и содержит только атрибут @import. Когда пользователь просматривает Интернет с низкой скоростью, он увидит страницу без стилей, а затем файл CSS. загружено. Вы можете увидеть правильный стиль. Чтобы избежать этой проблемы, вам необходимо убедиться, что в заголовке есть хотя бы один тег сценария или ссылки.
Какой метод следует использовать? В настоящее время кажется, что для небольших веб-сайтов более уместно (или более популярно) использовать ссылку. Конечно, если в будущем нам понадобится модульность CSS, мы обязательно будем использовать @import.
Статья частично переведена из книги «В чем разница между @import и ссылкой для CSS» в учебных целях, добро пожаловать!
