A estrutura básica de um arquivo CSS3 inclui as seguintes seções:
/* Comentários */
/* Seletores */
selector {
/* Declarações */
property: value;
property: value;
}
/* @Regras */
@media screen and (min-width: 480px) {
selector {
property: value;
property: value;
}
}
Os comentários são adicionados entre as tags /* e */ e são usados para fornecer informações adicionais sobre o código.
Os seletores são usados para selecionar o elemento HTML ao qual você deseja aplicar as regras. Os seletores podem ser baseados em nomes de tag, classes, identificadores, entre outros.
As declarações são compostas por propriedades e valores. Cada propriedade define uma característica do elemento selecionado, como cor, tamanho, espaçamento, etc., e o valor da propriedade especifica como essa característica deve ser aplicada.
As regras @ são usadas para definir estilos baseados em condições, como largura da tela. Neste exemplo, a regra @media especifica que as declarações dentro dela só serão aplicadas quando a largura da tela for 480 pixels ou mais.
Esta é a estrutura básica de um arquivo CSS3. A partir daqui, você pode adicionar mais seletores, declarações e regras @ para personalizar a aparência do seu site.
