[css] @charset“UTF-8”을 지정해야하는 이유; CSS 파일에?

나는이 지시를 내게 넘겨진 수많은 CSS 파일의 첫 번째 줄로 보았습니다.

@charset "UTF-8";

그것은 무엇을하며,이 규칙이 필요합니까?

또한이 메타 태그를 “head”요소에 포함 시키면 CSS 파일에도이 메타 태그가 없어도됩니까?

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



답변

브라우저에 CSS 파일을 UTF-8로 읽도록 지시합니다. CSS에 ASCII뿐만 아니라 유니 코드 문자도 포함되어 있으면 편리합니다.

메타 태그에 사용하는 것이 좋지만 해당 메타 태그가 포함 된 페이지에만 해당됩니다.

CSS 2 의 w3c 스펙 에서 CSS 파일의 문자 세트 분석 규칙에 대해 읽으십시오 .


답변

이는 HTTP 헤더 또는 다른 메타 데이터 (예 : 로컬 파일 시스템)별로 인코딩이 알려지지 않은 상황에서 유용합니다.

다음 스타일 시트를 상상해보십시오.

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

판독기가 파일을 하드 드라이브에 저장하고 @charset규칙 을 생략하면 대부분의 브라우저는 파일을 OS의 로캘 인코딩 (예 : Windows-1252)으로 읽고 화살표 대신 —를 삽입합니다.

불행히도, 지원은 다소 드물기 때문에이 메커니즘에 의존 할 수 없습니다. 그리고 인터넷에서 HTTP 헤더는 항상 @charset규칙을 무시합니다 .

스타일 시트의 문자 세트를 판별하는 올바른 규칙 은 우선 순위입니다.

  1. HTTP 문자셋 헤더.
  2. 바이트 주문 마크.
  3. 첫 번째 @charset규칙.
  4. UTF-8.

마지막 규칙은, 가장 약한입니다 것입니다 일부 브라우저에서 실패합니다. 의 속성 에서 사용되지 않습니다 HTML 5 .
서로 다른 선언 사이의 충돌에주의하십시오. 디버깅하기 쉽지 않습니다.
charset<link rel='stylesheet' charset='utf-8'>

추천 독서


답변

텍스트를 포함하는 모든 페이지에 항상 문자 집합 사양을 포함시키는 한 가지 이유는 사이트 간 스크립팅 취약점을 피하기 위해서입니다. 대부분의 경우 HTML 페이지를 포함하여 UTF-8 문자 세트가 텍스트에 가장 적합합니다.


답변

CSS 파일에 <meta> 태그를 넣으면 문제가 있습니다. <meta> 태그는 html 파일에 속하며 브라우저에 html 인코딩 방법을 알려주며 별도의 파일 인 CSS에 대해서는 아무 것도 말하지 않습니다. html과 CSS에 대해 완전히 다른 인코딩을 가질 수는 있지만 이것이 좋은 생각이라고는 생각할 수 없습니다.


답변