Зачем указывать @charset "UTF-8"; в вашем файле CSS?

Я видел эту инструкцию как самую первую строку многочисленных файлов CSS, которые были переданы мне:

@charset "UTF-8";

что он делает, и это правило нужно?

кроме того, если я включу этот мета-тег в свой элемент "head", это устранит необходимость его присутствия в моих CSS-файлах?

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
161
character-encoding css

4 ответов

Он сообщает браузеру прочитать файл css как UTF-8. Это удобно, если CSS содержит символы юникода, а не только ASCII.

использование его в метатеге нормально, но только для страниц, которые включают этот мета-тег.

прочитайте о правилах разрешения набора символов CSS-файлов в спецификация W3C для CSS 2.

116

это полезно в контекстах, где кодировка не указана в заголовке HTTP или других метаданных, например в локальной файловой системе.

представьте себе следующую таблицу:

[rel="external"]::after
{
    content: ' ↗';
}

если читатель сохраняет файл на жесткий диск и опустить @charset правило, большинство браузеров будут читать его в кодировке языкового стандарта ОС, например Windows-1252, и вставлять â†- вместо стрелки.

к сожалению, вы не можете полагаться на этот механизм в качестве поддержки довольно ... редко. И помните, что в сети HTTP-заголовок всегда будет переопределить @charset правило.

правильный правила для определения набора символов таблицы стилей в порядке приоритета:

  1. заголовок кодировки HTTP.
  2. Метку Порядка Следования Байтов.
  3. первый @charset правило.
  4. UTF-8.

последнее правило самое слабое, оно будет не работает в некоторых браузерах.
The в <link rel='stylesheet' charset='utf-8'> устарел в HTML 5.
Следите за конфликтом между различными декларациями. Их нелегко отлаживать.

рекомендуемая литература

142

одна из причин всегда включать спецификацию набора символов на каждой странице, содержащей текст, - избегать уязвимостей межсайтовых сценариев. В большинстве случаев набор символов UTF-8 является лучшим выбором для текста, включая HTML-страницы.

2

Если вы помещаете тег в свои css-файлы, вы делаете что-то неправильно. Тег принадлежит вашему HTML-код файлы и сообщает браузеру, как кодируется html, он ничего не говорит о css, который является отдельным файлом. Вы могли бы иметь совершенно разные кодировки для вашего html и css, хотя я не могу себе представить, что это была бы хорошая идея.

2