Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

mover imagem.

não to conseguindo mover essa logo na header da home page do site

<!DOCTYPE html>
<html lang="pt-BR">
    <head>    
        <meta charset="UTF-8">
        <link rel="stylesheet" href="reset.css">
        <link rel="stylesheet" href="estilo_isac.css">
        <title>Herpetologia-Isac</title>    
    </head>
    <body>
        <header>
            <div class="caixa">
                <img src="lagarto2.png" class="logoheader">
                <p><h1 class="titulo">Chunb - </h1></p>
                <p class="subtitulo">Coleção Herpetologica da UNB</p>
                    <nav>
                        <ul>
                            <li> <a href="Inicio.html "> Início </a></li>
                            <li> <a href="anficios.html "> Anfíbios </a></li>
                            <li> <a href="repteis.html "> Répteis </a> </li>
                            <li> <a href="contato.html "> Contato </a></li> 
                        </ul>
                    </nav> 
                </p>
            </div>
        </header>
        <main>
            <h2>Conceitos</h2>
            <ul>
                <li class="mainlist">
                    <p><h3>O quê é herpetologia ?</h3></p>
                    <br> 
                    <p class="descricao">A herpetologia é um ramo da zoologia dedicado ao estudo dos répteis e anfíbios: sua classificação, ecologia, comportamento, fisiologia e paleontologia.</p> 
                    <p class="descricao">Em geral os animais desse grupo não produzem o próprio calor, ou seja são chamados de animais de sangue frio.</p> 
                    <p class="descricao">O controle térmico nesse grupo de vertebrados é feito por termorregulação.</p> 
                    <p class="descricao">O Brasil está entre os países com maior diversidade, com 773 répteis e 1.026 anfíbios, segundo a Sociedade Brasileira de Herpetologia.</p>
                    <img src="sapo3.png" class="descricao">
            </ul>     
        </main>
    </body>
    <footer>
        <p class="Cobrinha"> &#128013;<p>Campus Universitário Darcy Ribeiro, Brasília-DF | CEP 70910-900 Telefones UnB Copyright © 2022 Universidade de Brasília.</p> 
        <p>Todos os direitos reservados.</p> 
        <p>Melhor visualizado nos navegadores Google Chrome e Mozilla Firefox &#129422;</p>
    </footer>    
</html>

` header{ background: url(verde2.jpg); padding: 10px 10px; } .logoheader{ height: 100px; width: 100px; }

.caixa{ position: relative; width: 1050px; margin: 0 auto; }

.titulo{ vertical-align: top; font-size:40px; text-transform: uppercase; color: #FFFFFF; font-family:Verdana; }

.subtitulo{ font-size:20px; color: #FFFFFF; font-family: Verdana;

} nav { position: absolute; top: 112.5px; right: 0; }

nav li{ display: inline; margin: 15px ; border-color: #FFFFFF ;

} nav a { text-transform:uppercase; text-decoration:none; font-size:22px; color:#FFFFFF; font-family: Verdana; }

nav li a:hover { text-decoration: underline; }

main{ display: inline-block; margin-left: 30px; } main img{ height: 100px; width: 100px; } main h2{ display: inline-block; font-size: 24px; margin: 20px 0; text-transform: uppercase; font-weight: bold; }

h3{ font-size: 25px; text-transform:uppercase; font-weight: bold; } Insira aqui a descrição dessa imagem para ajudar na acessibilidade .mainlist{ display: inline-block; width: 50%; padding: 20px 20px; box-sizing: border-box; border-color:#000000 ; border-style: solid ; border-radius: 10px; border-width:1px; margin-bottom: 20px; } .mainlist:hover{ background-color: royalblue; } .descricao{ font-family: Verdana;

footer{ color: #FFFFFF; text-align: center; background: url(bg.jpg); padding: 50px 0; } `

2 respostas
solução!

Olá, Davi.

Tudo bem?

No HTML tira a tag <img src="lagarto2.png" class="logoheader"> de dentro da <div class="caixa"> assim:

<header>
             <img src="lagarto2.png" class="logoheader">  //Aqui
            <div class="caixa">
                <p><h1 class="titulo">Chunb - </h1></p>
                <p class="subtitulo">Coleção Herpetologica da UNB</p>
                    <nav>
                        <ul>
                            <li> <a href="Inicio.html "> Início </a></li>
                            <li> <a href="anficios.html "> Anfíbios </a></li>
                            <li> <a href="repteis.html "> Répteis </a> </li>
                            <li> <a href="contato.html "> Contato </a></li> 
                        </ul>
                    </nav> 
                </p>
            </div>
        </header>

Ela vai ficar no início do <header> ai você vai conseguir movimentar ela. Espero ter ajudado. Qualquer dúvida manda aqui de novo. Valeu!

Obrigado Renan Bezerra de Lima. Ajudou demais cara