Daniel Röhers Moura - FACCATfpereira/pagina/autoria/apostilas/aula2... · Daniel Röhers Moura...
-
Upload
nguyenkhanh -
Category
Documents
-
view
218 -
download
0
Transcript of Daniel Röhers Moura - FACCATfpereira/pagina/autoria/apostilas/aula2... · Daniel Röhers Moura...
+
< font >
</ font >
2
3
CSSCascading Style Sheet
4
Algumas vantagens…
• Separação HTML -> Estilo
• Reaproveitamento de estilo (código)
• Carregamento mais rápido => Performance
• Animações e muito mais
5
Onde se aplica
• Tags HTML
• ID’s
• Classes
6
Class
“As classes são uma forma de identificar um grupo de elementos. Através delas, pode-se atribuir formatação a vários elementos de uma vez.”
8
ID
9
“As ids são uma forma de identificar um elemento, e devem ser únicas.”
Sintaxe
seletor {
propriedade: valor;
}
10
Mas como iniciar?
11
index.html style.css
Exemplo básico
12
Efeito cascata / prioridade
index.html style.css
13
Agrupamento de seletores
14
Seletor Classe/ID
15
Comentário
16
Como funciona?
17
http://goo.gl/Ea5fcD18
http://css-tricks.com20
http://www.w3schools.com21
http://css-weekly.com22
23
Media Queries
24
BEM Block Element Modifier
https://goo.gl/lrNsnE http://getbem.com
.block
.block__element
.block__element—modifier
25
Vamos codar?Não… Prototipar ;)
26
https://wireframe.cc27
Protótipo pronto=
codar
28
29
30