Upload
others
View
6
Download
0
Embed Size (px)
Citation preview
Aula 3Html - 2
Prof. Paulo Cesar F. De Oliveira, BSc, PhD
05/08/16 © P C F de Oliveira 2015 1
05/08/16 © P C F de Oliveira 2015 2
Elemento = Tag Abertura + Conteúdo +
Tag Fechamento
Lembrete
05/08/16 © P C F de Oliveira 2015 3
<p> Um parágrafo </p>
Exemplo
05/08/16 © P C F de Oliveira 2015 4
Atributo
Tag Tag
URL (Uniform Resource Locator)
05/08/16 © P C F de Oliveira 2015 5
Absoluta: Página
Remota (URL) Relativa: diretório corrente
Relativa: subdiretório
Âncora
05/08/16 © P C F de Oliveira 2015 6
Atributo href
URL Absoluta
URL Relativa
href="http://www.an.com.br"
href=”recipes/salmon.html"
URL Relativa
href=”index.html"
05/08/16 © P C F de Oliveira 2015 7
05/08/16 © P C F de Oliveira 2015 8
① Crie um link em salmon.html para tapenade.html
② Crie um link em couscous.html para salmon.html
③ Crie um link em tapenade.html para linguine.html
④ Crie um link em linguine.html para about.html
⑤ Crie um link em tapenade.html parawww.allrecipes.com
05/08/16 © P C F de Oliveira 2015 9
① Crie um link em salmon.html para tapenade.html<a href=“tapenade.html”>Vá para receita Tapenade</a>② Crie um link em couscous.html para salmon.html<a href=“../salmon.html”>Vá para receita Salmon</a>③ Crie um link em tapenade.html para linguine.html<a href=“pasta/linguine.html”>Vá para receitaLinguine</a>④ Crie um link em linguine.html para about.html<a href=“../../about.html”>Vá para pagina About</a>⑤ Crie um link em tapenade.html para
www.allrecipes.com<a href=“http://www.allrecipes.com”>Vá para site All Recipes</a>
05/08/16 © P C F de Oliveira 2015 10
<img src=“logo.jpg” alt=“logo do IFC” />
Atributo
Tag Tag
Atributo
URLTexto
Alternativo
05/08/16 © P C F de Oliveira 2015 11
Inserindo imagens
Imagem Simples
ImageMap
<img src=“logo.jpg” alt=“” />
Link
05/08/16 © P C F de Oliveira 2015 12
1 2 3jpg(Joint
PhotographicExperts Group)
png(PortableNetwork Graphics)
gif(Graphics
InterchangeFormat)
05/08/16 © P C F de Oliveira 2015 13
jpg
<=16 milhões cores
Perda de informação
Transparência (não)
Arquivos pequenos
Fotografias
Animação (não)
1
05/08/16 © P C F de Oliveira 2015 14
png
Milhões cores (8, 24, 32)
Sem perda informação
Transparência (sim)
Arquivos maiores
Logos
Animação (não)
2
05/08/16 © P C F de Oliveira 2015 15
gif
<= 256 cores
Sem perda informação
Transparência (sim)
Arquivos > jpg
Logos
Animação (sim)
3
05/08/16 © P C F de Oliveira 2015 16