# 071: CSS no rodapé, parte 1 - CSS-Tricks

Índice

Com a estrutura HTML para o rodapé no lugar, temos o que precisamos para começar a estilizar e fazer com que o rodapé se pareça com o que desenhamos no Photoshop.

Criamos um novo arquivo SCSS apenas para o rodapé, porque faz sentido mantê-lo modularizado e é isso que temos feito para todo o resto. Nós o importamos para a folha de estilo principal na parte inferior.

Escurecemos o rodapé usando apenas um pouco de fundo RGBa. Sass nos ajuda um pouco porque você pode fazer isso no Sass que é super legal rgba(black, 0.5):; Usamos uma sombra de caixa embutida para criar o efeito de prateleira.

Empurramos o conteúdo para longe das bordas com preenchimento esquerdo e direito. Precisamos ajustar imediatamente a quantidade desse preenchimento com base no ponto de interrupção atual.

Nós estilizamos o rodapé inferior da mesma maneira. É apenas um pouco mais escuro para parecer outro nível abaixo.

Artigos interessantes...