3
respostas

Imagem não amplia 100%

Olá acredito que esta parte do curso esta deixando muita gente com dúvida, seria bom vocês adicionarem uma breve orientação que fique mais clara. Só uma dica. Porque eu li muitos comentários parecidos parece uma dúvida geral da galera.

<!DOCTYPE html>
<html lang="pt-br">

    <head>
        <meta charset=UTF-8>
        <title>Barbearia Alura</title>
        <link rel="stylesheet" href="style.css">

    </head>

    <body>

    <img id="banner" src="banner.jpg">
    <h1>Sobre a barbearia Alura</h1>
    <p>Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>
    <p id="missao"><em>Nossa missão é: <strong>"Proporcionar auto-estima e qualidade de vida aos clientes"</strong>.</em></p>
    <p>Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>
</html>
body {
    background: #CCCCCC
} 
#banner{
    width: 100%
}
h1 {
    text-align: center
}

p {
    text-align: center; font-size: 20px
}
#missao{
    font-size: 20px
}

em strong {
    color: red;
}

(Mesmo seguindo todas as orientações e salvando dentro da pasta específica para o projeto e salvando quando esta no HTML E CSS a imagem não ampliou, e aí o que fazer? Pode ser a imagem? Pode ser o Note? Ou Operacional?

3 respostas

Olá Alessandra, tudo bem?

Rodei o código exatamente como está e a imagem está ampliada 100%, da forma que é esperado. Isso indica que não é nenhum erro de sintaxe no código então teremos que investigar o que pode estar ocorrendo!

  • Primeiro, a imagem simplesmente não está ampliada ou ela também não está aparecendo?

  • Alguma outra propriedade CSS também não está sendo aplicada ou somente a width: 100% do banner?

  • Qual navegador você está utilizando?

Além disso, talvez o navegador não esteja acompanhando as mudanças, tente fechar e abrir o index.html novamente após as modificações para ver se atualiza com a imagem ampliada.

Obs: caso a imagem não esteja aparecendo e as outras propriedades CSS não estiverem sendo aplicadas, certifique que o o style.css e a imagem estejam juntos na mesma pasta que o index.html (isso é muito importante).

Aguardo para saber mais, abraços!

checa a referencia com o CSS, se estiver ok, aperta Ctrl + F5 para recarregar a pagina sem chache pois as vezes da problemas

Olá Kaio boa noite! Olha meu operacional não estava buscando a informação na pasta correta. Consegui enfim fazer a imagem ficar 100% após redirecionar todas as informações do projeto. Quando eu salvava no CSS dentro da pasta do CSS o arquivo não atualizava, mas agora consegui. Agradeço sua ajuda, muito obrigada.