Arquivo da tag: CSS / CSS3

CSS Grid Layout – Criando layouts CSS profissionais

Nota do livro: 7.

Conteúdo

A criação de Layout CSS sempre foi uma tarefa trabalhosa, mas agora os profissionais têm uma ferramenta poderosa ao seu alcance, o CSS Grid Layout, uma nova especificação do W3C, que veio para resolver praticamente todos os problemas de posicionamento na tela. Utilizando um novo método de layout CSS, bidimensional, com linhas e colunas, mais simples e muito mais fácil de usar, permite controlar o tamanho e a posição dos componentes da interface e seus conteúdos. Não será mais necessário inflar a marcação HTML com elementos desnecessários para a criação de layouts CSS.

Explicações teóricas são abordadas em linguagem didática, dispensando, sempre que possível, o jargão técnico avançado, além de serem acompanhadas de exemplos práticos explicados passo a passo e complementados por arquivos HTML, disponíveis online para consulta e download.

Neste livro, Maujor, o dinossauro das CSS, mostra de forma didática os recursos e as funcionalidades dessa nova ferramenta. Com auxílio de exercícios práticos, você aprenderá todas as potencialidades dessa nova tecnologia para criar layouts extremamente profissionais, que antes somente eram possíveis com a utilização de frameworks.

Este livro é indicado para desenvolvedores front-end, web designers e estudantes com alguma experiência em CSS.

Refatoração de CSS – Organize suas folhas de estilo com sucesso

Nota do livro: 7.

Conteúdo
Revisar seu código a fim de remover redundâncias e inconsistências – processo conhecido como refatoração – é uma prática comum quando usamos linguagens de programação. Com este guia prático, o autor Steve Lindstrom mostra não só como estruturar o CSS para construir sites responsivos e fáceis de usar, mas também como utilizar a refatoração e criar um CSS mais legível e possível de manter.
Um bom CSS é essencial para a aparência dos sites modernos – é tão importante quanto o HTML que determina a apresentação do site e o JavaScript que executa a aplicação. Não importa se você está iniciando seu primeiro projeto de CSS ou se está organizando um código existente, este livro apresenta estratégias para construir uma base de código CSS que esteja de acordo com os princípios de uma boa arquitetura.

  • Saiba o que é refatoração de código e como ela se relaciona com o CSS
  • Explore como os navegadores web usam a cascata para determinar os estilos a serem aplicados a cada elemento
  • Escreva um CSS previsível, extensível e possível de manter, além de possibilitar a reutilização de código
  • Classifique os estilos de CSS e utilize-os de acordo com seus propósitos
  • Faça a manutenção do CSS definindo quais navegadores e dispositivos devem ser testados
  • Conheça estratégias para organizar seus estilos, refatorando o CSS e avaliando o seu sucesso

CSS – Image Full Page

Perfect Full Page Background Image

[code type=css]
img.bg {
/* Set rules to fill background */
min-height: 100%;
min-width: 1024px;

/* Set up proportionate scaling */
width: 100%;
height: auto;

/* Set up positioning */
position: fixed;
top: 0;
left: 0;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
img.bg {
left: 50%;
margin-left: -512px; /* 50% */
}
}