The brafe from rhuanbello

View Code? Open in Web Editor NEW

Brafé - Cafés Brasileiros é um projeto desenvolvido utilizando quatro métodos diferentes de posicionamento, à fim de dominar a partir dos fundamentos a criação de Layouts com CSS.

HTML 52.58% CSS 47.42%

brafe's Introduction

Você pode acessar o projeto clicando aqui.

📖 Sobre

Projeto desenvolvido durante o curso de CSS Avançado da Origamid, com duração de 9 horas.

Ao longo do curso colocamos em prática de forma exaustiva os principais métodos de posicionamento no CSS, desenvolvendo a mesma página de quatro formas diferentes:

A primeira partindo dos fundamentos do CSS para determinar de forma pura a posição dos elementos da página, definindo width's, height's e utilizando float, uma propriedade que se tornou obsoleta depois do surgimento de layouts como Flexbox e CSS Grid mas que é fundamental entender seu funcionamento, tanto para agradecer a evolução tecnológica (ainda bem que não preciso declarar clear both nos containers hoje em dia) quanto para trabalhar em browsers mais antigos.
A segunda utilizando Flexbox, que agora posso dizer com propriedade que é minha forma favorita de posicionar elementos (não fica muito atrás do Grid Layout). Aqui, se torna muito simples definir o tamanho e o alinhamento de itens na página, além da responsividade automática dos contêiners.
A terceira com um arquivo de grid, onde divimos a tela em 12 colunas e definimos os tamanhos máximos em porcentagens, facilitando na hora de aplicar as classes e na adaptação das telas.
E por último usando Bootstrap, o famoso framework de CSS, onde temos diversas classes pré-prontas com estilos definidos, uma forma de reduzir o código escrito e facilitar na hora de construir páginas. Posso dizer que foi o método mais simples de utilizar, pois depois que você entende o funcionamento do CSS, se torna fácil entender como o Bootstrap age.