Sintaxe CSS

A importância da sintaxe CSS

Historinha 1:

Em uma aula de português o professor escreveu uma definição para ditongo conforme mostrado a seguir:

Dirtongo é a reuniaum de duas ou mais vogais pronunçiadas de uma só vêiz. Uma destas vogais soa mais curta ou mais fraka que a outra e se chama-se cemivogal.

A definição está rigorosamente correta, mas o “prufessor” cometeu 6 erros de português. Escreveu certo de maneira errada.

…como você classificaria este professor?

Chegou mais perto quem marcou a última opção, embora as outras não estejam erradas. O cara que escreveu a frase, pode ser tudo na vida, menos professor de português.

Historinha 2:

Em uma lista de discussão sobre web standards o “disenvolvedor” escreveu o seguinte:

A regra CSS margin:0; é muito usada para estilizar o parâmetro BODY. Aqui o uso do atributo CSS margin, que normalmente aparece logo no início de uma folha de estilos define um parâmetro zero para as margens do documento. Na folha de estilos deverá ser declarada a função CSS: body { margin:0;}.

A definição está rigorosamente correta, mas o “disenvolvedor” cometeu 5 erros de sintaxe CSS. Escreveu certo de maneira errada.

…como você classificaria este “disenvolvedor”?

Chegou mais perto quem marcou a última opção, embora as outras não estejam erradas. O colega que escreveu a frase, pode ser tudo na vida, menos desenvolvedor web standards.

---

O emprego equivocado da terminologia CSS é muito mais comum do que se possa imaginar. E não são somente os recém-chegados às CSS que cometem estes tipos de erros.
A terminologia CSS compreende apenas 5 termos, repito, 5 termos. É uma lástima a quantidade de erros que se comente por desconhecimento do significado de 5 termos, repito, 5 termos somente.

Não existe atributo CSS, função CSS, comando CSS, parâmetro CSS, tag CSS, elemento CSS, e tantas outros termos inadequados que se escreve por aí

As especificações do W3C para as CSS define claramente que uma regra CSS é composta de um seletor e uma declaração e que a declaração compreende uma propriedade e um valor.

Na regra CSS a seguir:

h1 { color: blue }

a terminologia correta é:

• h1 {color: blue} – regra CSS;
• h1 – seletor;
• { color: blue } – declaração;
• color: blue – declaração;
• color – propriedade;
• blue – valor.

Estes são os 5 termos, repito, 5 termos normatizados da sintaxe CSS e ponto final. Não existe “atributo CSS” ou “tag CSS” ou “elemento CSS” ou “função CSS” ou tantos outros equivocadamente escritos.

Atualização: As CSS3 criaram valores CSS expressos por funções, tais como calc(), rgb(), hsl(), etc.

A frase acima escrita erroneamente deve ser corrigida para:

A declaração CSS margin:0; é muito usada para estilizar o seletor (ou elemento) BODY. O uso da propriedade CSS margin nesta regra CSS normalmente aparece no início de uma folha de estilos com a finalidade de definir um valor zero para as margens do documento. Na folha de estilos deverá ser declarada a regra CSS: body { margin:0;}.

Ao escrever seu próximo post em fórum, comentário em rede social, blog, lista de discussão e principalmente ao escrever um artigo, tutorial ou matéria sobre CSS, empregue a terminologia correta. Escrever atributo no lugar de propriedade está errado e no mínimo demonstra um conhecimento primário da sintaxe CSS.

Atualização: As CSS3 criaram valores CSS expressos por funções, tais como rgb(), hsl(), etc. Tutorial sobre a função CSS calc().