Cansado de HTML chato, simples e CSS para sempre longo? Conheça o Skeleton, a adição perfeita, leve, de CSS ao resto do código da placa de caldeira que você já inclui como um ponto de partida de qualquer projeto.
Código da placa de caldeira é qualquer código repetitivo que aparece repetidamente para obter algum resultado que parece que deveria ser muito mais simples. E simples, o estilo básico do HTML deveria ser muito mais simples.
>
>
A maior parte das bibliotecas ou frameworks de estilo front-end operam definindo estilos em classes que requerem que o usuário lembre os nomes das classes para adicionar estilo aos elementos HTML. O esqueleto funciona através da aplicação da maioria dos estilos diretamente nas tags HTML. Tabelas, Formulários, Listas, Botões, você dá um nome, eles dão um estilo.
Próximo Início
Skeleton recomenda que você vá ao site deles e baixe o arquivo CSS convenientemente anotado, não-instalado, pronto para ir ao CSS para que você mesmo possa dar uma olhada debaixo do capô. O esqueleto totaliza menos de 400 linhas de código! Há também um conveniente link CDN para uma configuração ainda mais rápida quando a personalização não é crítica para o seu projeto. No entanto você escolhe incluí-lo, uma vez que você tenha a folha de estilo ligada na cabeça do seu documento, você está pronto para ir!
A grade de 12 colunas
O sucesso do esqueleto está em pegar os atributos que outros frameworks CSS fornecem e torná-lo muito simples. Ao usar o sistema de grade, o layout do seu navegador permanece fluido e se ajusta automaticamente ao tamanho da janela. Para utilizar as colunas, use um número e uma classe de ‘coluna’ ou ‘colunas’, ou um método de ‘um terço,’ ‘metade,’ etc.
> >
>
>
Esqueletograma define a largura máxima para 960px, que se ajusta automaticamente a telas grandes, pequenas e médias. Se desejar, você pode alterar a largura máxima com uma linha de CSS, e todas as colunas serão redimensionadas de acordo!
> >
Tipografia
>
Tipo em Skeleton é definido para rems para ser dimensionado de forma responsiva com base em uma única propriedade <html> tamanho da fonte. A base da fonte é Raleway, definida para 15rem sobre uma altura de linha de 1,6 (15px e 24px respectivamente).
>
>
Os cabeçotes têm seu tamanho distinto com espaçamento de letras específico, altura de linha e margens.
>
>
Buttons vêm em duas opções. O estilo padrão de botões existe inerentemente para a tag <button> (e quaisquer outros elementos de formulário apropriados), enquanto a segunda opção, mais vibrante, de botões pode ser aplicada com uma classe ‘.button-primary’.
Quando devo usar Skeleton?
Skeleton é uma biblioteca CSS leve, responsiva e altamente personalizável construída com o móvel em mente. Não é necessário compilar ou instalar, e funciona bem com folhas de estilo CSS adicionais e Frameworks front-end. Use o esqueleto para um CSS rápido e funcional que é ótimo para demonstrações ou MVPs. E por ser menos de 12kb para a versão minificada, também é perfeito para quando a velocidade é mais importante. Lembre-se, o Skeleton é, em sua essência, um esqueleto de componentes e estilo puros. Com apenas um link, você pode transformar o HTML sem graça em uma página totalmente estilizada sem a necessidade de sacrificar a velocidade ou memorizar uma biblioteca de nomes de classe.
>
>>