Brunobarreto02
-
Posts
1 -
Cadastrado em
-
Última visita
-
Estou programando e treinando HTML nessa página, porém estou com uma dúvida no CSS porém nas class figure.foto-legenda figcaption e figure.foto-legenda:hover, a atributo opacity não estão funcionando, que funcionaria como um fade-in e fade-out. Como resolver isso? <!doctype html> <html lang="en"> <head> <meta charset="Ansi"> <style> p { text-align: center; } body{ background-color: #6513; color: rgba(0,0,0,0.5); /*meu ******/ } figure.foto-legenda{ border: 8px solid white; box-shadow: 1px 1px 4px black; position:relative; } figure.foto-legenda img{ width: 40%; height: 30%; } figure.foto-legenda figcaption{ opacity: 0%; position: absolute; top: 0px; background-color: rgba(0,0,0,.5); color: white; width:100%; height:100%; padding: 10px; box-sizing: border-box; transition: opacity 1s; } figure.foto-legenda:hover figcaption{ opacity: 1; } nav#menu{ display: block; } nav#menu li{ list-style:none; text-transform: uppercase; display: inline-block; background-color: #2156; color: white; padding: 10px; margin: 2px; top: -20px; left: 100px; } </style> <script src="script.js"> </script> <title>minha página</title> </head> <body> <script> alert("Bem vindo a jobs software"); </script> <div> <header> <nav id="menu"> <li>Inicio</li> <li>contatos</li> <li>Quem somos</li> <li>Metas da empresa</li> <li>projetos</li> </nav> </header> <hgroup> <h1> Bem vindo a Empreza Jobs software </h1> <h2> uma filial dos irmaos elmers </h2> <h3> leia o texto de boas vindas </h3> </hgroup> <figure class="foto-legenda"> <img src="https://blog.pmweb.com.br/wp-content/uploads/boas-vindas-email.jpg" width= 300> <figcaption> <h3> nossa mensagem de boas vindas </h3> <p> <h4> o melhor serviço em desenvolvimento de programas </h4> </p> </figcaption> </figure> <h2> <p> <i>O que é Lorem Ipsum?</i></h2> Lorem Ipsum é simplesmente uma simulação de texto da indústria tipográfica e de impressos, e vem sendo utilizado desde o século XVI, quando um impressor desconhecido pegou uma bandeja de tipos e os embaralhou para fazer um livro de modelos de tipos. Lorem Ipsum sobreviveu não só a cinco séculos, como também ao salto para a editoração ele<wbr>trô<wbr>nica, permanecendo essencialmente inalterado. Se popularizou na década de 60, quando a Letraset lançou decalques contendo passagens de Lorem Ipsum, e mais recentemente quando passou a ser integrado a programas de editoração eletrônica como Aldus PageMaker. </p> <h3> simbolos especiais </h3> € £ $ ≥ √ <p> essa é a era de ouro da nova tecnologia. Logo logo serãp lançadas no espaço grandes naves para colonizar novos planetas. x<sup>2</sup>+14x+log<sub>3</sub>70 </p> </div> </body> </html>
Sobre o Clube do Hardware
No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais
Direitos autorais
Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais