shoelace.io – ferramenta de aprendizado Bootstrap

O que Shoelace? Para que serve Shoelace?

Shoelace é um construtor de grade Bootstrap. Super simples, fácil de usar e não tenta ser uma ferramenta WYSIWYG. Na verdade, o oposto.

Ele tinha 3 propósitos:

  1. Construir o HTML de grade, para mostrar como ele vai funcionar e mudar responsivamente
  2. Ensinar-lhe como Bootstrap funciona, tornando impossível fazer grades quebradas ou não conformes
  3. Descobrir como sua grade se relaciona com o original

como usar shoelace

Ficou claro que o Shoelace pode ser uma grande ferramenta pública para projetar e aprender como funciona o Bootstrap responsivo. O desenvolvedor se esforça para ele ser infalível e não contribuir para a confusão, mas torná-lo cristalino sobre o que está acontecendo em uma página html responsiva.

shoelace-4

shoelace-3

Sistema de grid fixo e responsivo

Profound-Grid-Responsive-Grid-System-For-Fixed-and-Fluid-Layouts

Faça grades fluidas ou fixas e adicione layouts sob-media, conforme necessário. Alterar as larguras das colunas e das margens e remover ou adicionar colunas conforme necessário.

A grade mantém sua marcação semântica e funciona sem classes “gridx”. A menos que você queira usá-los, então basta incluídos.

Profoundgrid ou Grade Profunda, usa margens negativas para calcular colunas. Ao contrário de outros sistemas, layouts fluidos serão exatamente os mesmos em todos os navegadores.