Declaração de codificação de caracteres em CSS

No dia a dia é improvável que seja necessário declarar codificação de caracteres em CSS, principalmente se você desenvolve projetos comuns e corriqueiros. Ou seja, você não precisa de uma cozinha industrial se você precisa apenas fritar um ovo. De qualquer maneira fica registrado aqui como declarar codificação de caracteres em CSS.

A informação sobre codificação de caracteres é muito importante em folhas de estilos externas quando nomes de atributos, nomes de seletores, ou valores de atributos não são em texto ASCII (American Standard Code for Information Interchange). E ainda, se você utilizar valores não ASCII para propriedades CSS tais como content ou font-family, certifique-se de ter declarado a codificação de caracteres.

Para declarar um encoding na sua folha de estilos se necessário utilize a seguinte regra:


@charset "UTF-8";

Quando você cria uma folha de estilos externa, você também pode especificar nas configurações do seu servidor para enviar através do header HTTP, o encoding mais apropriado. Lembre-se que as informações enviadas pelo header precedem sempre aquelas declaras na regra de CSS.

Para as declarações de CSS escritas dentro do próprio documento HTML, a regra @charset não precisa e não deve ser declarada. Esta regra serve apenas para folhas de estilos externas linkadas em um documento. Esta regra deve aparecer apenas uma única vez na folha de estilos, no incío do documento, e não deve ser precedida por nenhum outro caracter, nem mesmo comentários.

  • Pingback: Charsets e encodings » Revolução Etc()

  • wendel

    Essa técnica é especialmente interessante quando se trabalhar com templates diversificados. Onde a interface geral de apresentação e a folha de estilo não faz parte do sistema em si.

    Um exemplo é o WordPress que permite que você tenha o template com o arquivo de CSS separado do Framework (código) do sistema. O WordPress trabalhar com UTF-8, e se você usar o Windows você irá codificar sua folha de estilo normalmente em um mapa caractere local do windows que é normalmente ISO-8859-1.

    Nesse caso você pode declarar na sua CSS:

    @charset "ISO-8859-1";

    Sendo assim, você evita diversos problemas de codificação e interpretação incorreta da folha de stilo.

  • http://www.pinceladasdaweb.com.br Pedro Rogério

    O Dreamweaver 8 por padrão já faz isso na criação dos seus documentos CSS.

  • ERINELCIO STANDT

    Quero uma explicação sobre o assunto 'CODIFICAÇÃO DE CARACTÉRES EM CSS'.

  • http://www.comocriarsites.com.br Natanael

    A dica é pequena, mas pra quem esta aprendendo é uma 'mão na roda'. Dica interessante.

  • Macalha

    Existe algo que faça o mesmo com arquivos JavaScript ?