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!
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
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!