Ferramentas para desenvolvedores

Formatador de CSS

Ferramenta online para organizar e formatar folhas de estilo CSS, com ajuste de indentação ou minificação de código.

Executar ferramenta

Este formatador de CSS organiza e estrutura folhas de estilo para facilitar a leitura e a manutenção do código. O utilizador pode colar as suas regras de estilo no campo principal e definir o nível de indentação pretendido, entre 0 e 8 espaços, sendo o valor padrão de 2 espaços. A ferramenta suporta dois modos de funcionamento: a formatação legível, que aplica quebras de linha e alinhamento visual, e a minificação, que remove comentários em bloco e espaços desnecessários junto a chavetas e dois pontos. Textos compostos apenas por espaços em branco produzem um resultado vazio imediato. Para ficheiros extensos, o limite de processamento situa-se em 1000000 de bytes em codificação UTF-8. O sistema preserva a estrutura das declarações sem avaliar conformidade com normas externas de validação. Caso escolha uma opção inválida de espaçamento, o sistema repõe a contagem de 2 unidades, garantindo um aspeto limpo e uniforme no ecrã.

Instruções

  1. Insira ou cole as declarações CSS na caixa de texto inicial.
  2. Indique o número de espaços para a indentação, escolhendo um valor inteiro entre 0 e 8.
  3. Selecione o modo pretendido para formatar com quebras de linha ou compactar a estrutura.
  4. Inicie a operação para visualizar o código transformado no painel de saída.

Exemplos

  • Entrada com declarações compactas como body{margin:0;padding:0;} e indentação de 2 espaços no modo de formatação. O painel apresenta o seletor body seguido de chaveta aberta, propriedades em novas linhas com avanço de dois espaços e chaveta de fecho.
  • Entrada com regras espaçadas e comentários no modo de minificação. O painel devolve uma linha única contínua, com comentários suprimidos e espaços adjacentes a chavetas e dois pontos removidos.

Perguntas frequentes

Como funciona o ajuste do número de espaços?

Pode escolher um número inteiro entre 0 e 8. Se introduzir um valor não numérico ou fora desse limite, a ferramenta utiliza automaticamente o valor padrão de 2 espaços.

O que faz o modo de minificação?

O modo de minificação elimina comentários em bloco e suprime espaços em branco desnecessários em torno de chavetas, dois pontos e pontos e vírgulas, reduzindo o volume do ficheiro.

A ferramenta verifica a validade técnica do código CSS?

Não. O processamento organiza a apresentação visual do texto fornecido, sem validar compatibilidade com normas W3C ou verificar erros de propriedades inexistentes.

Qual é a dimensão máxima suportada por pedido?

O texto de entrada não deve exceder 1 000 000 de bytes em codificação UTF-8 para que a formatação ocorra sem interrupções.

Incorporar esta ferramenta

Adicione esta ferramenta funcional da SmartPlusLab ao seu site com o código abaixo.