Capítulo 3 ■ CSS
55
3.1.1 Introdução Uma aplicação desenvolvida com Bootstrap deve estar em conformidade com algumas premissas mandatórias conforme descritas a seguir. • Estar contida em um elemento div container geral que recebe a classe de nome container conforme mostrado a seguir. ... <body> <div class="container"> <!-- Aplicação criada com Bootstrap --> </div> <!-- /.container --> <body> <html>
Opcionalmente, para obter um layout fluido (layout que preencha toda a largura da tela) o nome de classe container deve ser substituído por container-fluid. Não se preocupe com este nome, adiante neste livro, veremos como usar e quais são os efeitos de se usar, alternativamente, este nome.
3.1.2 Breakpoints As CSS do Bootstrap foram desenvolvidas seguindo as premissas da filosofia “mobile first”. Isto significa que as regras de estilo iniciais foram criadas para contemplar um layout de uma coluna no qual os blocos de conteúdos vão sendo posicionados na vertical um após outro e suas larguras ocupam todo o espaço disponível em dispositivos móveis, com viewports de largura menor do que 768px. Para fins didáticos denominaremos, neste livro, as regras CSS para dispositivos com viewport menor do que 768px de regras CSS iniciais. Os criadores do Bootstrap estabeleceram que por padrão o primeiro breakpoint fosse em 768px. A partir da largura de viewport igual a 768px, usando-se media queries foi criado um conjunto de regras CSS a serem aplicadas juntamente com as regras CSS iniciais. Os criadores do Bootstrap estabeleceram que por padrão o segundo breakpoint fosse em 992px e usando-se media queries foi criado um conjunto de regras CSS a serem aplicadas juntamente com as regras CSS anteriores.
Conheça os livros do Maujor: http://livrosdomaujor.com.br