1
resposta

Meu CSS não está funcionando

Boa noite, comecei tentando mudar o tamanho da minha imagem, a partir disso continue mexendo no meu CSS e nada es´ta acontecendo. O que pode ser? meu html:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title> Fisioterapia</title>

    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <header>
        <div class="caixa">
            <h1><img src="logodoandre.jpg">

                <nav>
                    <ul>
                        <li><a href=home.html>Home</a></li>
                        <li><a href=serviços.html>Serviços</a></li>
                        <li><a href=contatos.html>Contatos</a></li>
                    </ul>
                </nav>
            </div>
    </header>

    <img class="banner" src="banner.jpg">

    <main>
        <section class="principal">
            <h2 class="titulo-principal">Sobre a nossa fisioterapia</h2>

            <p>Localizada no coração da cidade a nossa <strong>fisioterapia</strong>traz para o mercado o que há de melhor para seu corpo e mente.</p>

            <p id="missao"><em>Nossa missão é:<strong>
            Proporcionar saúde e qualidade de vida aos nossos clientes com excelência e resolutividade em todos os atendimentos, fortalecendo os laços de relacionamento através da ética e confiança em nossos serviços</strong>.</em></p>

            <p>Oferecemos atendimento com padrão de excelência, volatilidade e agilidade, garantindo qualidade e saisfação de nossos clientes. </p>
        </section>

        <div class="beneficios">
            <h3 class="titulo-centralizado">Benefícios</h3>

            <ul>
                <li class="itens">Atendimento aos clientes</li>
                <li class="itens">Espaço diferenciado</li>
                <li class="itens">Localização</li>
            </ul>
        </div>
    </main>

    <footer>
        <p class="copyright">© Copyright Dr. André Borasci - 2021</p>
    </footer>
</body>

meu css: /css da pag inicial/

.banner {
    width: 100px;
    /*o tamanho da img n está funcionando(?)*/

}

.titulo-principal {
    text-align: center;
    font-size: 2em;
}

vale lembrar q quando copiei meu "home, serviços e contatos" na parte superior, ele voltou pra display block, sem cor, sem nenhum estilo!

1 resposta

Olá, Amanda. Tudo bem?

Muito bom implementar o conteúdo passado no curso em um projeto de sua autoria, isso ajuda muito a fixar o conhecimento! Parabéns! =D

Sobre sua dúvida, o width altera apenas a largura da imagem. Para alterar a altura, é necessário utilizar o comando height. Eu copiei o seu código html e css e consegui alterar normalmente. Segue abaixo instrução de como fazer:

.banner {
    width: 700px;
    height: 300px; /* assim você consegue alterar a altura como desejar */

}

.titulo-principal {
    text-align: center;
    font-size: 2em;
}

Consegui ajudar em sua dúvida?