HTML - Imagens
Click here to load reader
-
Upload
guto-xavier -
Category
Documents
-
view
332 -
download
0
Transcript of HTML - Imagens
![Page 1: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/1.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
HTMLHTML
![Page 2: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/2.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
ImagensImagens
• Tipos de imagens• Inserindo uma imagem na página• Inserindo uma imagem no fundo da
página
![Page 3: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/3.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
Tipos de ImagensTipos de Imagens
• JPG• GIF• PNG• BMP• ICO
![Page 4: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/4.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
Inserindo uma imagem na Inserindo uma imagem na
ppááginagina
• Com o comando img podemos inserir uam imagem na página.
• <img src=“caminho\da\imagem”>• Existem parâmetros para:
• Alterar altura e largura: height / width , os valores devem ser em pixel(não utiliza nenhum simbolo) ou porcentagem (%)
• <img src=“foto.jpg” width=“10%”>• <img src=“foto.jpg” width=“100”>
• No primeiro exemplo a imagem será exibida com álargura de 10% de seu tamanho original, já no segundo a imagem será exibida com á largura de 100 pixels.
![Page 5: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/5.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
Inserindo uma imagem na Inserindo uma imagem na
ppááginagina
• ALT– O parâmetro alt é utilizado para quando a
imagem não for carregada exibir um texto(no mesmo local da imagem) ALTernativo, este texto também é exibido quando o cursor estiver sobre a imagem.
<img src=“bat.jpg” alt=“Cartaz do Batman”>
![Page 6: HTML - Imagens](https://reader037.fdocumentos.tips/reader037/viewer/2022100602/558b0c55d8b42aae2d8b4576/html5/thumbnails/6.jpg)
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
Inserindo uma imagem no Inserindo uma imagem no
fundo da pfundo da pááginagina
• Para inserir um imagem como fundo de nossa página web, devemos alterar a tagbody acrescentando o parametrobackground.
<body background=“fundo.jpg”>
Cada documento deve ter apenas uma tagBODY