Construtor de grade CSS
Crie trilhas e áreas com uma grade local e exporte em HTML e CSS.
- Funciona no navegador
- Sem upload
- Confira antes de baixar
Os dados de entrada ficam nesta aba, sem envio nem salvamento automático. As contagens agregadas de uso e os diagnósticos gerais de processamento são opcionais e só são enviados com o seu consentimento, sem conteúdo nem nomes de arquivos. Limpar ou fechar apaga os dados; salve antes os resultados de que precisar.
Limites de recursos
Grade: fr de 0,01 a 100, px de 0 a 2000, % de 0 a 100 ou auto; nomes no formato [a-z][a-z0-9_-]{0,19}. De 1 a 8 trilhas por eixo (fr, px, % ou auto), espaçamento de 0 a 100 px e até 64 células. Cada área precisa formar um retângulo. O ponto indica uma célula vazia. A prévia corresponde aos itens exportados. A prévia é local e limitada, sem garantia de funcionar igual em todos os navegadores e layouts. Suas entradas nunca são executadas. Baixe o HTML e o CSS juntos. Limite de tempo: 8 segundos.
Como usar
- Configure o exemplo
Adicione colunas e linhas e escolha unidades, tamanhos e espaçamento. Preencha as células com nomes de áreas retangulares repetidos ou com um ponto. Gere e confira as posições antes de exportar o HTML e o CSS.
- Verifique antes de usar
Os dados de entrada ficam nesta aba, sem envio nem salvamento automático. As contagens agregadas de uso e os diagnósticos gerais de processamento são opcionais e só são enviados com o seu consentimento, sem conteúdo nem nomes de arquivos. Limpar ou fechar apaga os dados; salve antes os resultados de que precisar. Grade: fr de 0,01 a 100, px de 0 a 2000, % de 0 a 100 ou auto; nomes no formato [a-z][a-z0-9_-]{0,19}. De 1 a 8 trilhas por eixo (fr, px, % ou auto), espaçamento de 0 a 100 px e até 64 células. Cada área precisa formar um retângulo. O ponto indica uma célula vazia. A prévia corresponde aos itens exportados. A prévia é local e limitada, sem garantia de funcionar igual em todos os navegadores e layouts. Suas entradas nunca são executadas. Baixe o HTML e o CSS juntos. Limite de tempo: 8 segundos.
- Exporte o resultado verificado
Baixar resultado; Baixar original
Perguntas e limites
Limites de recursos
Grade: fr de 0,01 a 100, px de 0 a 2000, % de 0 a 100 ou auto; nomes no formato [a-z][a-z0-9_-]{0,19}. De 1 a 8 trilhas por eixo (fr, px, % ou auto), espaçamento de 0 a 100 px e até 64 células. Cada área precisa formar um retângulo. O ponto indica uma célula vazia. A prévia corresponde aos itens exportados. A prévia é local e limitada, sem garantia de funcionar igual em todos os navegadores e layouts. Suas entradas nunca são executadas. Baixe o HTML e o CSS juntos. Limite de tempo: 8 segundos.
Design offline
Os dados de entrada ficam nesta aba, sem envio nem salvamento automático. As contagens agregadas de uso e os diagnósticos gerais de processamento são opcionais e só são enviados com o seu consentimento, sem conteúdo nem nomes de arquivos. Limpar ou fechar apaga os dados; salve antes os resultados de que precisar.
Verifique antes de usar
Adicione colunas e linhas e escolha unidades, tamanhos e espaçamento. Preencha as células com nomes de áreas retangulares repetidos ou com um ponto. Gere e confira as posições antes de exportar o HTML e o CSS.