Pessoal, bom dia!
Espero que estejam bem!
A dúvida que eu tenho é: Se eu inserir uma imagem no html, eu consigo alterar o tamanho dessa imagem depois de importada? Se for possível, como seria feito?
Desde já obrigado!
Pessoal, bom dia!
Espero que estejam bem!
A dúvida que eu tenho é: Se eu inserir uma imagem no html, eu consigo alterar o tamanho dessa imagem depois de importada? Se for possível, como seria feito?
Desde já obrigado!
Olá Vinicius, tudo bem com você?
A resposta para sua pergunta é sim! Conseguimos modificar o tamanho das imagens importadas no HTML, agora vamos ver algumas formas de fazer isso.
Primeiramente, podemos realizar essa modificações na mesma tag que importamos a imagem, que no caso a tag img
. Abaixo deixarei um exemplo:
<img src="https://avatars.githubusercontent.com/u/4975968?s=280&v=4" height="400px" width="400px">
No código acima, além da propriedade src
que precisamos para adicionar o caminho ou link para chegar a imagem, temos também outras duas, sendo elas: height
que vai definir a altura da nossa imagem e a outra é o width
que a partir dele podemos definir a largura da imagem.
Uma outra forma de se fazer isso, seria em um arquivo CSS que posteriormente seria importado no nosso projeto HTML. Logo abaixo tem um exemplo.
img {
height: 100px;
width: 100px;
}
Neste exemplo acima, em um arquivo CSS, deve ser adicionado à sua tag img
ou a classe que você definiu para a sua imagem, as mesmas propriedades que eu comentei anteriormente, height
para a altura e width
para a largura.
Porém, nos exemplos que eu coloquei acima, eu defini que as propriedades de altura teriam certos tamanhos em "Pixels", que são uma unidade de medida para a página, caso queira entender mais sobre essa e outra unidades de medidas do mundo CSS, vou estar deixando um artigo da Alura que conta detalhadamente sobre.
Espero que eu tenha lhe ajudado, caso ainda tenha dúvidas com relação a este tópico, estarei à disposição. Abraços e bons estudos!