Estou inciando na progração a um pouco menos de um mês, e estou estudando HTML e CSS e queria pedir ajuda pois estou com dificuldade de deixar a imagem e texto no centro da tela sendo que o texto tem que estar alinhado no topo da imagem, espero que alguem possa me ajudar.
Uma simples e boa forma de conseguir isso de forma geral é utilizando o atributo align das tags.
Este atributo pode ser utilizado com os seguintes parametros:
align="left"
align="right"
align="middle"
align="top"
align="bottom"
exemplo:
Estou na esquerda!
Estou no centro!
Estou na direita!
<p align="left">Estou na esquerda!<br>
<img align="left" src="/favicon-light.png" height="32" width="32" />
</p>
<p align="middle">Estou no centro!<br>
<img align="middle" src="/favicon-light.png" height="32" width="32" />
</p>
<p align="right">Estou na direita!<br>
<img align="right" src="/favicon-light.png" height="32" width="32" />
</p>
Podendo também utilizar o css text-align, para melhor organizar o texto com a imagem:
Estou no centro!
<p align="middle" style="text-align: center;">Estou no centro!<br>
<img src="/favicon-light.png" height="32" width="32" />
</p>
muito obrigado pela explicaçao, deu certinho aqui
Para centralizar o texto use text-align: center;
Para centralizar a imagem ao meio pode utilizar margin: auto;
Se não resolver, recomendo dar uma olhada aqui:
https://www.freecodecamp.org/news/how-to-center-anything-with-css-align-a-div-text-and-more/
Olá Caio!
Eu particularmente gosto de usar flexbox nos meus layouts fiz um pequeno exemplo que acho que seja o que voce quer fazer.
<div style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; width: 100%">
<span>Texto</span>
<img src="" style="width: 50px; height: 50px" />
</div>
O essêncial quando você estiver fazendo uma pergunta é postar seu código junto, para eu entender o que você precisa, tudo bem?
Mas vamos lá, vou tentar te ajudar mesmo assim... Acredito que você só deseja centralizar o texto, é isso? Se for, você precisa usar a propriedade text-align: center; do css, só aplicar ao texto que você quer que seja centralizado.
Se não for, me avisa e manda mais detalhes pra eu entender o que você realmente precisa 🤙