-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathAula04.html
64 lines (63 loc) · 2.05 KB
/
Aula04.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<title>Aula04 - Imagens</title>
</head>
<body>
<h1 align="center">Aula 04 - Imagens</h1>
<hr>
<h2>Imagem</h2>
<ul>
<li>Para inserir uma imagem utilizamos a tag "img"</li>
<li>A tag img deve ter pelo menos dois atributos definidos: "src" e "alt"</li>
</ul>
<h2>Atributos mais usados da Tag de Imagem</h2>
<ul type="circle">
<li>src: especifica o caminho da imagem</li>
<li>alt: define um texto alternativo para a imagem</li>
<li>height: especifica a altura da imagem</li>
<li>width: especifica a largura da imagem</li>
</ul>
<h2>Atributos não suportados da Tag de Imagens no HTML 5</h2>
<ul type="square">
<li>align: era usado para definir o alinhamento da imagem</li>
<li>border: era usado para definir a largura da borda em volta da imagem</li>
<li>hspace: era usado para definir o espaço em branco do lado esquerdo e direito de uma imagem</li>
<li>vspace: era usado para definir o espaço em branco em cima e em baixo de uma imagem</li>
</ul>
<h2>Exemplos</h2>
<!--
Sempre usar nome do arquivo completo e com a extensão
Se a imagem estiver no mesmo diretório - apenas nome do arquivo:
<img src="html5.jpg" alt="Logo HTML 5">
Se a imagem estiver em um diretório anterior:
<img src="../html5.jpg" alt="Logo HTML 5">
-->
<ul>
<li>
Imagem:<br>
<img src="img/html5.jpg">
</li>
<li>
Imagem com texto alternativo:<br>
<img src="img/html5.jpg" alt="Logo HTML5">
</li>
<li>
Imagem com definição de altura:<br>
<img src="img/html5.jpg" height="50" alt="Logo HTML5">
</li>
<li>
Imagem com definição de largura:<br>
<img src="img/html5.jpg" width="700" alt="Logo HTML5">
</li>
<li>
Imagem com definição de altura e largura:<br>
<img src="img/html5.jpg" height="500" width="200" alt="Logo HTML5">
</li>
Imagem de URL:<br>
<img src="http://elearning.iseresearch.com/wp-content/uploads/2013/02/logo_CSS3.png" alt="Imagem de site externo">
</li>
</ul>
</body>
</html>