Desenvolvimento Front End minicurso UNIDERP 2012
-
Upload
anderson-de-castro -
Category
Technology
-
view
1.053 -
download
1
Transcript of Desenvolvimento Front End minicurso UNIDERP 2012
Desenvolvimento Front End
Por: Anderson de Castro
Cronograma
• O que é CSS• Tableless• Referenciando!• Seletores– Intervalo :: 10 minutos
• Elementos e Atributos• Classes– Intervalo :: 10 minutos
• Posicionamento• Encerramento 1º Dia
O que é CSS
Cascading Style Sheets-Folha de Estilos em Cascata
Objetivo: Separar CONTEÚDO(HTML) do LAYOUT(formatação)
TableLess
“Sem Tabela!” CERTO???
Não utilizar tabelas <table>para estruturar o layout do site. NÃO é BANIRo uso de <table>
Referenciando CSS
• Inline– <p style=“color: green;”> Aqui paragráfo </p>
• No próprio arquivo– <style> p { color: green; } </style>
• Arquivo Externo– <link rel=“stylesheet” href=“estilos.css” />
Seletores
Elementos e Atributos
Vamos à PRÁTICA!
Classes
Usadas para formatar um ou vários elementos, atribuindo-lhes mesma características.
p.cor_azu { color: #09F; }
<p class=“cor_azul”>Parágrafo com cor azul </p>
Posicionamento
Positions, Floats, Z-indexes , etc ....
Por HOJE é só!
... No próxima semana :
O tão esperado 960 Grid System
E mais dicas e técnicas para agilizar o desenvolvimento Front-End