Css кодировка: @charset | htmlbook.ru

Leave a Comment / Css / By /

@charset | WebReference

Команда @charset применяется для задания кодировки внешнего CSS-файла. Это имеет значение в том случае, если в CSS-файле используются символы национального алфавита.

Для внешней таблицы стилей браузер последовательно просматривает следующие пункты для определения кодировки таблицы стилей:

  1. кодировка, которую отдает сервер;
  2. правило @charset;
  3. атрибут charset элемента <link> (данный атрибут устарел, не используйте его).

Приведённый список имеет чётко выраженную иерархию — чем выше находится пункт, тем выше его приоритет. Если ни один из пунктов не найден, будет установлена кодировка UTF-8.

Синтаксис

@charset "<кодировка>";
Синтаксис
ОписаниеПример
<тип>Указывает тип значения.<размер>
A && BЗначения должны выводиться в указанном порядке.
<размер> && <цвет>
A | BУказывает, что надо выбрать только одно значение из предложенных (A или B).normal | small-caps
A || BКаждое значение может использоваться самостоятельно или совместно с другими в произвольном порядке.width || count
[ ]Группирует значения.[ crop || cross ]
*Повторять ноль или больше раз.[,<время>]*
+Повторять один или больше раз.<число>+
?Указанный тип, слово или группа не является обязательным.inset?
{A, B}Повторять не менее A, но не более B раз.<радиус>{1,4}
#
Повторять один или больше раз через запятую.		<время>#

Значения

Для русского языка обычно указывается кодировка windows-1251 или utf-8. Значение кодировки обязательно должно быть взято в кавычки.

Пример

@charset "windows-1251";
body {
 font: 11pt Arial, Helvetica, sans-serif;
 margin: 0;
 color: #000;
}
p.new:after {
 content: " Новье!";
}

Примечание

В браузере Internet Explorer до версии 7 включительно название кодировки допускается писать без кавычек, что противоречит спецификации CSS.

Спецификация

СпецификацияСтатус
CSS Level 2 (Revision 1)Рекомендация
Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации) — первая черновая версия стандарта.

Браузеры

5.512
2		941.5
2.11104
Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

@-правила

Кодировка — Учебник HTML — schoolsw3.com

❮ Назад Далее ❯

Чтобы правильно отобразить HTML страницу, веб браузер должен знать, какой набор символов использовать.

Что такое кодировка символов?

ASCII была первая стандартная кодировка символов (также называется набор символов). ASCII определенны 128 различных буквенно-цифровых символов, которые могут быть использованы в интернете: числа от (0-9), английские буквы (A-Z), и некоторые специальные символы, такие как ! $ + — ( ) @ < > .

ANSI (Windows-1252) был оригинальным Windows набор символов, с поддержкой 256 различных кодов символов.

ISO-8859-1 была кодировка по умолчанию для HTML 4. Этот набор символов тоже поддерживается 256 различных кодов символов.

Потому что ANSI и ISO-8859-1 были настолько ограничены, что HTML 4 также поддерживает UTF-8.

UTF-8 (Юникод) охватывает практически все знаки и символы в мире.

Кодировка по умолчанию для HTML5 является UTF-8.

HTML Атрибут charset

Для корректного отображения HTML страницы веб браузер должен знать набор символов, используемый на этой странице.

Это указано в теге

<meta>:

<meta charset=»UTF-8″>

Если браузер обнаруживает ISO-8859-1 на веб странице, он по умолчанию использует ANSI.

Различия между наборами символов

В следующей таблице показаны различия между наборами символов, описанными выше:

Число ASCII ANSI 8859 UTF-8 Описание
32Пространство
33!!!!Восклицательный знак
34««««Кавычки двойные
35####Знак числа
36$$$$Знак доллара
37%%%%Знак процента
38&&&&Амперсанд
39‘‘‘‘Кавычки одинарные
40((((Левая собка
41))))Правая скобка
42****Звездочка
43++++Плюс
44,,,,Запятая
45————Дефис-минус
46....Точка
47////Косая черта
480000Число нуль
491111Число один
50		2222Число два
513333Число три
524444Число четыре
535555Число пять
546666Число шесть
557777Число семь
568888Число восемь
579999Число девять
58::::Двоеточие
59;;;;Точка с запятой
60<<<<Знак меньше чем
61====Знак равенства
62>>>>Знак больше чем
63????Знак вопроса
64@@@@Коммерческая в
65AAAAЛатинская буква A
66BBBBЛатинская буква B
67CCCCЛатинская буква C
68DDDDЛатинская буква D
69EEEEЛатинская буква E
70FFFFЛатинская буква F
71GGGGЛатинская буква G
72HHHHЛатинская буква H
73IIIIЛатинская буква I
74JJJJЛатинская буква J
75KKKKЛатинская буква K
76LLLLЛатинская буква L
77MMMMЛатинская буква M
78NNNNЛатинская буква N
79OOOOЛатинская буква O
80PPPPЛатинская буква P
81QQQQЛатинская буква Q
82RRRRЛатинская буква R
83SSSSЛатинская буква S
84TTTTЛатинская буква T
85UUU
U		Латинская буква U
86VVVVЛатинская буква V
87WWWWЛатинская буква W
88XXXXЛатинская буква X
89YYYYЛатинская буква Y
90ZZZZЛатинская буква Z
91[[[[Левая квадратная скобка
92\\\\Обратный солидус
93]]]]Правая квадратная скобка
94^^^^Циркумфлекс ударение
95____Низкая линия
96````Знак ударения
97aaaaЛатинская строчная буква a
98bbbbЛатинская строчная буква b
99ccccЛатинская строчная буква c
100ddddЛатинская строчная буква d
101eeeeЛатинская строчная буква e
102ffffЛатинская строчная буква f
103ggggЛатинская строчная буква g
104hhhhЛатинская строчная буква h
105iiiiЛатинская строчная буква i
106jjjjЛатинская строчная буква j
107kkkkЛатинская строчная буква k
108llllЛатинская строчная буква l
109mmmmЛатинская строчная буква m
110nnnnЛатинская строчная буква n
111ooooЛатинская строчная буква o
112ppppЛатинская строчная буква p
113qqqqЛатинская строчная буква q
114rrrrЛатинская строчная буква r
115ssssЛатинская строчная буква s
116ttttЛатинская строчная буква t
117uuuuЛатинская строчная буква u
118vvvvЛатинская строчная буква v
119wwwwЛатинская строчная буква w
120xxxxЛатинская строчная буква x
121yyyyЛатинская строчная буква y
122zzzzЛатинская строчная буква z
123{{{{Левая фигурная скобка
124||||Вертикальная линия
125}}}}Правая фигурная скобка
126~~~~Тильда
127DEL    
128 €  Знак евро
129 НЕ ИСПОЛЬЗУЕТСЯ
130 ‚  Одинарная 9 низкая кавычка
131 ƒ  Латинская строчная буква f с крючком
132 „  Двойная 9 низкая кавычка
133 …  Горизонтальное многоточие
134 †  Кинжал
135 ‡  Двойной кинжал
136 ˆ  Письмо модификатор облеченным ударением
137 ‰  Знак промилле
138 Š  Латинская буква S с caron
139 ‹  Одинарный угол влево низкая кавычка
140 Œ  Латинская заглавная лигатура OE
141 НЕ ИСПОЛЬЗУЕТСЯ
142 Ž  Латинская буква Z с caron
143 НЕ ИСПОЛЬЗУЕТСЯ
144 НЕ ИСПОЛЬЗУЕТСЯ
145 ‘  Левая одинарная низкая кавычка
146 ’  Правая одинарная низкая кавычка
147 “  Левая двойная низкая кавычка
148 ”  Правая двойная низкая кавычка
149 •  Маркер
150 –  Тире
151 —  Длинное тире
152 ˜  Маленькая тильда
153 ™  Знак торговой марки
154 š  Латинская строчная буква s с caron
155 ›  Одинарный угол вправо низкая кавычка
156 œ  Латинская строчная лигатура oe
157 НЕ ИСПОЛЬЗУЕТСЯ
158 ž  Латинская строчная буква z с caron
159 Ÿ  Латинская буква Y с diaeresis
160    Неразрывный пробел
161 ¡¡¡Перевернутый восклицательный знак
162 ¢¢¢Знак цента
163 £££Знак фунта
164 ¤¤¤Знак валюты
165 ¥¥¥Знак иены
166 ¦¦¦Прерывистая полоса
167 §§§Знак раздела
168 ¨¨¨Трема
169 ©©©Знак авторского права
170 ªªªЖенский порядковый индикатор
171 «««Двойной угол влево
172 ¬¬¬Знак нет
173 ­­­Мягкий дефис
174 ®®®Зарегистрированный знак
175 ¯¯¯Макрон
176 °°°Знак степени
177 ±±±Плюс-минус
178 ²²²Верхний индекс два
179 ³³³Верхний индекс три
180 ´´´Острый знак ударения
181 µµµМикро знак
182 Знак абзаца
183 ···Точка посередине
184 ¸¸¸Седиль
185 ¹¹¹Верхний индекс один
186 ºººМужской порядковый индикатор
187 »»»Двойной угол вправо
188 ¼¼¼Грубая дробь одна четвертая
189 ½½½Грубая дробь одна вторая
190 ¾¾¾Грубая дробь три четвертых
191 ¿¿¿Перевернутый вопросительный знак
192 ÀÀÀЛатинская буква A с grave
193 ÁÁÁЛатинская буква A с acute
194 ÂÂÂЛатинская буква A с circumflex
195 ÃÃÃЛатинская буква A с tilde
196 ÄÄÄЛатинская буква A с diaeresis
197 ÅÅÅЛатинская буква A с ring above
198 ÆÆÆЛатинская буква AE
199 ÇÇÇЛатинская буква C с cedilla
200 ÈÈÈЛатинская буква E с grave
201 ÉÉÉЛатинская буква E с acute
202 ÊÊÊЛатинская буква E с circumflex
203 ËËËЛатинская буква E с diaeresis
204 ÌÌÌЛатинская буква I с grave
205 ÍÍÍЛатинская буква I с acute
206 ÎÎÎЛатинская буква I с circumflex
207 ÏÏÏЛатинская буква I с diaeresis
208 ÐÐÐЛатинская буква Eth
209 ÑÑÑЛатинская буква N с tilde
210 ÒÒÒЛатинская буква O с grave
211 ÓÓÓЛатинская буква O с acute
212 ÔÔÔЛатинская буква O с circumflex
213 ÕÕÕЛатинская буква O с tilde
214 ÖÖÖЛатинская буква O с diaeresis
215 ×××Знак умножения
216 ØØØЛатинская буква O с stroke
217 ÙÙÙЛатинская буква U с grave
218 ÚÚÚЛатинская буква U с acute
219 ÛÛÛЛатинская буква U с circumflex
220 ÜÜÜЛатинская буква U с diaeresis
221 ÝÝÝЛатинская буква Y с acute
222 ÞÞÞЛатинская буква thorn
223 ßßßЛатинская строчная буква sharp s
224 àààЛатинская строчная буква a с grave
225 áááЛатинская строчная буква a с acute
226 âââЛатинская строчная буква a с circumflex
227 ãããЛатинская строчная буква a с tilde
228 äääЛатинская строчная буква a с diaeresis
229 åååЛатинская строчная буква a с ring above
230 æææЛатинская строчная буква ae
231 çççЛатинская строчная буква c с cedilla
232 èèèЛатинская строчная буква e с grave
233 éééЛатинская строчная буква e с acute
234 êêêЛатинская строчная буква e с circumflex
235 ëëëЛатинская строчная буква e с diaeresis
236 ìììЛатинская строчная буква i с grave
237 íííЛатинская строчная буква i с acute
238 îîîЛатинская строчная буква i с circumflex
239 ïïïЛатинская строчная буква i с diaeresis
240 ðððЛатинская строчная буква eth
241 ñññЛатинская строчная буква n с tilde
242 òòòЛатинская строчная буква o с grave
243 óóóЛатинская строчная буква o с acute
244 ôôôЛатинская строчная буква o с circumflex
245 õõõЛатинская строчная буква o с tilde
246 öööЛатинская строчная буква o с diaeresis
247 ÷÷÷division sign
248 øøøЛатинская строчная буква o с stroke
249 ùùùЛатинская строчная буква u с grave
250 úúúЛатинская строчная буква u с acute
251 ûûûЛатинская строчная буква с circumflex
252 üüüЛатинская строчная буква u с diaeresis
253 ýýýЛатинская строчная буква y с acute
254 þþþЛатинская строчная буква thorn
255 ÿÿÿЛатинская строчная буква y с тремой

ASCII Набор символов

ASCII используются значения от 0 до 31 (и 127) для управляющих символов.

ASCII используются значения от 32 до 126 для букв, цифр и символов.

ASCII не используйте значения от 128 до 255.

ANSI Набор символов (Windows-1252)

ANSI идентичен ASCII для значений от 0 до 127.

ANSI имеет собственный набор символов для значений от 128 до 159.

ANSI идентична кодировке utf-8 для значений от 160 до 255.

ISO-8859-1 Набор символов

8859-1 идентичен ASCII для значений от 0 до 127.

8859-1 не используйте значения от 128 до 159.

8859-1 идентична кодировке utf-8 для значений от 160 до 255.

UTF-8 Набор символов

UTF-8 идентичен ASCII для значений от 0 до 127.

UTF-8 не используйте значения от 128 до 159. 

UTF-8 идентичен ANSI и 8859-1 для значений от 160 до 255.

UTF-8 продолжается от значение 256 с более чем 10 000 различных символов.

Для более близкого взгляда, изучите наш Полный набор символов HTML справочник.

Правило CSS @charset

Вы можете использовать CSS правило @charset для указания кодировки символов, используемой в таблице стилей:

Пример

Установите кодировку таблицы стилей в Юникод UTF-8:

@charset «UTF-8»;

Подробнее о компании читайте здесь CSS Правило @charset.

❮ Назад Далее ❯


Объявление кодировок символов в CSS

Объявление кодировок символов в CSS

Вопрос

Как объявить кодировку символов таблицы стилей CSS ?

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

Быстрый ответ

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

Другие подходы необходимы только в том случае, если ваша таблица стилей содержит символы, отличные от ASCII, и по какой-то причине вы не можете полагаться на то, что кодировка HTML и связанная таблица стилей будут одинаковыми. В этом случае вы должны использовать @charset или заголовки HTTP для объявления кодировки. (Если ваши файлы HTML и CSS используют одну и ту же кодировку, последние версии основных браузеров будут применять кодировку файла HTML к таблице стилей CSS.)

Детали

Использование

@charset

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

Важно понимать, что хотя @charset 9Объявление 0010 выглядит как at-правило CSS, оно не анализируется как таковое для определения кодировки символов. Только точная последовательность байтов , начинающаяся с самого первого байта в таблице стилей, будет эффективной. Вариации, даже те, которые допустимы для обычного at-правила с таким же синтаксисом, просто игнорируются.

Чтобы установить кодировку символов внутри таблицы стилей, используйте следующую последовательность байтов, кроме имени набора символов , в самом начале файла, по одному байту на символ.

@charset " имя-кодировки ";

Имя набора символов нечувствительно к регистру, но всегда должно быть utf-8 для новых таблиц стилей. Если вы действительно не можете использовать UTF-8 для своей таблицы стилей, см. раздел Работа с кодировками, отличными от UTF-8, ниже.

Только одна последовательность байтов @charset может отображаться во внешней таблице стилей, и она должна находиться в самом начале документа. Это не должно быть перед любыми символами, даже комментариями.

Внимание! Недостаточно просто указать @charset "utf-8"; в верхней части таблицы стилей — вам также необходимо сохранить вашу таблицу стилей в кодировке символов UTF-8. (См. Применение кодировки к вашему содержимому.)

Важно: Поскольку заголовок HTTP имеет более высокий приоритет, чем объявление @charset в документе, всегда следует учитывать, объявлена ​​ли уже кодировка символов в заголовке HTTP. Если да, то @charset должен быть установлен для объявления той же кодировки и будет иметь эффект только тогда, когда таблица стилей читается в контексте, где нет заголовков HTTP (например, с локального диска).

Указатель методов содержит набор ссылок, помогающих определить, отправляется ли объявление в заголовке HTTP.

Как насчет метки порядка байтов?

Спецификация синтаксиса CSS3 говорит, что если у вас есть метка порядка байтов UTF-8 в начале вашего файла, это должно привести к тому, что браузер будет читать таблицу стилей как UTF-8, независимо от любого другого объявления. К сожалению, на момент написания этой статьи это не поддерживалось функциональной совместимостью — Internet Explorer 10 и 11 по-прежнему отдают более высокий приоритет заголовку HTTP и 9.0009 @charset объявлений.

Так что пока вам следует полагаться на @charset или объявления заголовков HTTP. У первого есть дополнительное преимущество: оно помогает людям, просматривающим исходный код, установить, какова кодировка таблицы стилей. Метка порядка байтов невидима.

Подробнее о метке порядка байтов.

Использование HTTP

Сервер может уже отправить декларацию кодировки символов по умолчанию в HTTP Заголовок Content-Type , когда ваш браузер извлекает таблицу стилей, а может и нет. Эта строка в ответе HTTP будет означать, что файл закодирован в UTF-8.

Content-Type: text/css; charset=utf-8

Индекс методов содержит набор ссылок, которые помогут вам определить, отправляется ли объявление в заголовке HTTP. Для получения дополнительной информации о том, как установить кодировку в HTTP, см. Настройка параметра набора символов HTTP .

Возможно, сервер обслуживает таблицу стилей с объявлением кодировки, которое вам не нужно, из-за общесерверных значений по умолчанию или конкретных настроек, или обслуживает без объявления кодировки, когда вы этого хотите. Вы можете изменить ситуацию как для сервера в целом, так и для конкретного файла или набора файлов, изменив настройки сервера (глобально или локально) или используя код в скриптах типа PHP.

Объявление в заголовке HTTP всегда будет переопределять объявление в документе, если есть конфликт, за исключением тех браузеров, где отметка порядка байтов переопределяет его.

Однако мы рекомендуем, если вам нужно использовать объявление HTTP для установки правильной кодировки, вы также должны включить объявление @charset в таблицу стилей. Это гарантирует, что кодировка по-прежнему известна, если таблица стилей используется локально или перемещается, например. для тестирования или редактирования.

Дополнительная информация

Большинству людей не нужно знать информацию в этом разделе. Он предоставлен для полноты.

Работа с кодировками, отличными от UTF-8

Этот раздел следует читать только в том случае, если вы действительно не можете сохранить свою таблицу стилей в кодировке UTF-8.

Обратите внимание, что хотя имена, встречающиеся в упомянутых здесь документах, обычно называются именами с кодировкой , на самом деле они относятся к кодировкам, а не к наборам символов. Например, набор символов Unicode или «репертуар» может быть закодирован тремя различными схемами кодирования.

До недавнего времени реестр IANA был местом, где можно было найти имена для кодировок. Реестр IANA обычно включает несколько имен для одной и той же кодировки. В этом случае вы должны использовать имя, обозначенное как «предпочтительный».

Новая спецификация Encoding теперь содержит список, протестированный на реальных реализациях браузеров. Список можно найти в таблице в разделе Кодировки. Лучше всего использовать имена из левого столбца этой таблицы.

Обратите внимание , однако наличие имени в любом из этих источников не обязательно означает, что можно использовать эту кодировку. Некоторые из кодировок проблематичны. Если вы действительно не можете использовать UTF-8, вам следует внимательно изучить совет из статьи Выбор и применение кодировки символов .

Атрибут

charset в элементе link

Спецификация HTML 4. 01 описывает атрибут charset, который можно добавить к элементу ссылки, чтобы указать кодировку документа, на который вы ссылаетесь. Однако использование этого атрибута в элементе ссылки в настоящее время устарело по спецификации HTML5, поэтому его не следует использовать.

Дальнейшее чтение

  • Начать? Знакомство с наборами символов и кодировками

  • Tutorial, Обработка кодировок символов в HTML и CSS

  • Ссылки по теме, Создание HTML и CSS

    • символов
    • Объявление кодировки символов в таблице стилей CSS

  • Ссылки по теме, Настройка сервера

    • символов

кодировка символов — зачем указывать @charset «UTF-8»; в вашем файле CSS?

спросил

Изменено 4 года, 2 месяца назад

Просмотрено 137 тысяч раз

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

 @charset "UTF-8";

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

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

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

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

 [rel="external"]::after
{
    содержание: ' ↗';
}

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

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

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

  1. Заголовок HTTP Charset.
  2. Метка порядка байтов.
  3. Первое правило @charset .
  4. UTF-8.

Последнее правило самое слабое, оно будет не работать в некоторых браузерах.
Атрибут charset в устарел в HTML 5.
Следите за конфликтом между различными декларациями. Их нелегко отлаживать.

Рекомендуем прочитать

  • Расс Рольф: Объявление кодировок символов в CSS
  • IANA: официальные имена для наборов символов — другие имена не допускаются; используйте предпочтительное имя для @charset , если для одной и той же кодировки зарегистрировано более одного имени.
  • MDN: @charset . Есть опорный стол. Я не верю в это. 🙂
  • Тестовый пример от CSS WG.

4

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

Использовать его в метатеге можно, но только для страниц, содержащих этот метатег.

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

1

Одной из причин всегда включать спецификацию набора символов на каждую страницу, содержащую текст, является избежание уязвимостей межсайтового скриптинга.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *