O que é o formato de ficheiro CSS?
Arquivos .css são usados para formatar conteúdo e descrever a apresentação de um site.
Arquivos com a extensão .css contêm regras que definem como os elementos .html devem ser exibidos em uma determinada página. Essas regras abrangem áreas como:
- configurações de fonte (tipo de letra, tamanho, cor e estilo),
- espaçamento entre linhas e recuo,
- regras de layout para elementos incorporados e posicionados,
- referências de recursos, animações e breakpoints responsivos via consultas
@media.
CSS - Cascading Style Sheets - é a linguagem de folhas de estilo usada para criar arquivos .css. Ela foi projetada para permitir a separação do conteúdo do site da sua apresentação, tornando muito mais fácil modificar a aparência de um site sem afetar o conteúdo. Arquivos .css também permitem que as páginas sejam renderizadas de forma diferente dependendo do dispositivo usado para acessá-las - seja um dispositivo móvel, PC desktop ou tablet - para uma experiência de usuário muito melhor. A parte «em cascata» significa que múltiplas regras podem atingir o mesmo elemento simultaneamente, com a especificidade e a ordem de origem resolvendo qual delas vence.
O CSS não é um formato de versão única: desde o CSS3, ele se desenvolveu como módulos independentes (Seletores, Flexbox, Grid, Cor, Animações e outros), cada um avançando em seu próprio ritmo. Pré-processadores como .scss e .less estendem a sintaxe de autoria do CSS, mas sempre compilam para o .css simples que os navegadores consomem diretamente.
Arquivos .css armazenam dados em formato de texto simples e, portanto, podem ser editados usando qualquer editor de texto. Recomenda-se, no entanto, que os arquivos .css sejam editados usando ferramentas dedicadas para evitar erros potenciais - tais ferramentas destacam automaticamente palavras-chave, corrigem erros de sintaxe e oferecem recursos de preenchimento automático. Um arquivo .css não carrega assinatura binária; ele pode opcionalmente começar com uma declaração @charset, uma regra @import ou um /* comentário */.
Segurança e proteção
RISCO: LOWO CSS é texto simples e não executa código, portanto, um arquivo .css é de baixo risco para abrir. Casos isolados: historicamente, o CSS podia carregar recursos remotos (fontes/imagens) e navegadores antigos tinham peculiaridades de expression()/behavior (há muito tempo obsoletas); o CSS moderno não pode executar scripts. A verdadeira cautela é baixar softwares «editores/visualizadores de CSS gratuitos» de portais cheios de anúncios que agrupam PUPs - use os editores respeitáveis listados acima.
Detalhes do formato
em resumoProgramas que abrem arquivos CSS
Windows4 apps
Visual Studio Code
Gratuito Abra o .css para editar com realce de sintaxe, IntelliSense e extensões de visualização ao vivo. 
Web browser (Chrome/Firefox/Edge)
Gratuito Os navegadores aplicam o CSS automaticamente ao carregar uma página; use o DevTools (F12) para inspecionar/editar estilos ao vivo. 
macOS2 apps
Visual Studio Code
Gratuito Abra o .css para editar com realce de sintaxe, IntelliSense e extensões de visualização ao vivo. 
Linux1 app
VS Code / gedit / GNU Emacs
Gratuito Abra o .css em qualquer editor de texto/código para visualizar ou editar.
CodePen / JSFiddle
Gratuito Cole o CSS em um playground online para editar e visualizar em relação ao HTML ao vivo. Detalhes técnicos
especificação profunda| Tipo MIME | text/css |
| Codificação de arquivo | Texto simples, UTF-8 por padrão; o conjunto de caracteres pode ser declarado explicitamente com uma regra `@charset` no topo do arquivo |
| Assinatura binária | Nenhuma - arquivos `.css` não possuem magic bytes; a identificação depende da extensão do arquivo ou do tipo MIME |
| Tamanho de arquivo típico | 1 KB a 500 KB; pacotes de frameworks de terceiros minificados (Bootstrap, Tailwind) podem atingir o limite superior |
| Estrutura principal | Conjuntos de regras: um seletor ou lista de seletores seguido por um bloco de declaração de pares `propriedade: valor` entre chaves |
| At-rules | `@media` (breakpoints responsivos), `@import`, `@font-face`, `@keyframes`, `@supports` e `@layer` controlam carregamento condicional, fontes personalizadas, animações e detecção de recursos |
| Algoritmo de cascata | Regras conflitantes são resolvidas pela especificidade, origem da cascata (autor / usuário / navegador) e ordem de origem; os valores se propagam para elementos filhos via herança |
| Modelo de versionamento | Modular desde o CSS3; módulos individuais como Seletores, Flexbox, Grid e Cor avançam através dos estágios de Recomendação Candidata do W3C de forma independente |
| Propriedades personalizadas | Variáveis CSS nativas declaradas como `--nome: valor` e consumidas via `var(--nome)`, permitindo tokens de design reutilizáveis sem um pré-processador |
| Interoperabilidade de pré-processadores | Arquivos `.scss`, `.sass` e `.less` compilam para `.css` simples; o PostCSS transforma a fonte `.css` no momento da compilação; os navegadores consomem apenas o `.css` final |
| Compressão de transferência | Comumente servido com compressão gzip ou Brotli via HTTP para economia de largura de banda; o arquivo é texto simples não compactado no disco |
| Integridade de Sub-recursos | Um hash SHA-256/384/512 pode ser colocado no atributo `<link integrity="…">` do HTML para verificar o arquivo buscado; nenhum hash é armazenado dentro do próprio arquivo `.css` |
| Prefixos de fornecedor | Prefixos `-webkit-`, `-moz-` e `-ms-` historicamente protegiam propriedades experimentais; a maioria agora é obsoleta, pois as propriedades subjacentes foram padronizadas |
| Modelo de objeto do navegador | Analisado pelo mecanismo do navegador no CSSOM (CSS Object Model), que é combinado com a árvore DOM para calcular os estilos finais e pintar a página |
| Mantedor do padrão | W3C CSS Working Group; as especificações são publicadas como documentos de módulos independentes, cada um com seus próprios rascunhos de editor e Recomendações Candidatas |
| Lançado | CSS Level 1, December 1996 (W3C Recommendation) |
| Versão mais recente | CSS is now modular (CSS3+); modules like Selectors, Flexbox, Grid, Color advance independently |
| Padrão aberto | Sim · livre de royalties |
| Especificação | www.w3.org |
Conversões de CSS
Perguntas e Respostas da Comunidade
perguntado por usuáriosAinda não há perguntas - seja o primeiro a perguntar sobre arquivos CSS.
