16. O HTML5 - Nova estrutura de TAGS:
<header> -> ele é usado para estruturar um cabeçalho,
geralmente de informações, de uma página, como o nome do
site, slogan, marca, títulos etc.
<nav> -> se refere à navegação de um site, que geralmente
é composta por links com as principais páginas ou
seções(MENU).
17. O HTML5 - Nova estrutura de TAGS:
<article> -> define e estrutura uma região do seu site, de
modo a deixar ela mais independente.
<footer> -> rodapé, geralmente, trechos de um site que
aparecem ao fim de cada página.
<section> -> uma seção, ele define e estrutura diversas
partes de uma página
18. O HTML5 - Nova estrutura de TAGS:
<aside> -> para definir elementos, ou agrupá-los, para
definir regiões para publicidade, links laterais, banners e tudo
mais que não for conteúdo principal.
19. Novas tags x CSS
O CSS faz referência direta aos novos elementos:
21. Além de deixar o código mais elegante, a nova
estrutura HTML5 trás um grande retorno frente
aos motores de buscas como Google, Bing e
Yahoo.
22. OK entendi a estrutura, mas o
que mais tem de novidade?
23. Tag audio: Define um conteúdo de
audio.
- Exemplo (audio.html)
- http://www.univates.br/radio/ao-vivo# (um exemplo mais
elaborado)
24. Tag vídeo: Define um conteúdo de
vídeo.
- Exemplo1 (video1.html)
- Exemplo2 (video2.html)
25. TODO SITE PRECISA DE UM BOM
FORMULÁRIO :)
O HTML5 introdoziu diversas novidades para formulários, o
campo INPUT recebeu novos tipos e facilidades de
validação.
30. CANVAS
O HTML <canvas> elemento é usado para desenhar gráficos, em tempo real,
através de scripting (normalmente JavaScript).
O elemento <canvas> é apenas uma recipiente para gráficos. Você deve usar um
script para realmente desenhar os gráficos.
Canvas tem vários métodos para desenhar caminhos, caixas, círculos, texto, e
adicionar imagens.
53. Transforms - 3D
- translate3d(x,y,z)
- scale3d(x,y,z)
- rotate3d(x,y,z,angle)
54. Transforms - 3D
- Exemplos (rotate3D.html, transfor3D.html,
flip3D.html)
55.
56. CSS - SELETORES
Nossa gama de seletores foi ampliada e cada vez
menos é necessário criar classes e ids para estilizar
nosso site.
57. CSS - SELETORES
E[att=”val”] - seleciona o elemento com atributo = a val ex
(input[type=”submit”])
E:last-child - seleciona último filho E do elemento pai
E:first-child - seleciona último filho E do elemento pai
E:nth-child(n) - seleciona elemento E que seja o n-th
(enésimo) filho do elemento pai.
E:not(<seletor>) - Seleciona elemento cujo não contenha
expressão
...
