Ir para conteúdo

Recommended Posts

Olá pessoal

 

Estou com problema ao utilizar o hover, criei um botão que tem uma imagem como background, queria que toda vez que eu passar o mouse, o botão ficaria escuro, ou seja, diminuiria a transparência do mesmo. Já tentei colocar um segundo background com opacidade de 0, e quando passasse o mouse, opacidade ficaria 1, mas não deu certo. Poderiam me ajudar?

 

HTML

 

<!DOCTYPE html>
<html lang="pt-br" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>--.--</title>
    <link rel="stylesheet" type="text/css" href="--..--.css">
    <!--<link href="css/hover.css" rel="stylesheet" media="all">-->
  </head>
  <body>
    <h1 id="pcp"> 選べ </h1>
    <button class="first">
    </button>


  </body>
</html>

 

CSS 

 

.first {
    background-image: url(001-T.png);
  }

 

Tudo que eu tentei não deu certo, já criei até um subclass com :before, mas em vão, então só restou isso do css, pois é o background.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por petrochinski
      Eu tive uma ideia muito boa, mas não consegui fazer ainda.
       
      A ideia é simples, eu tenho um botão escrito 'Contato', quando passar o mouse gostaria que ele "abrisse" uma div logo abaixo (dropdown), como por exemplo aparecer o telefone somente se passar o mouse.
       
      Não achei nenhum tópico com essa ideia... é que gostaria de fazer sem utilizar nav, pois nav é o menu, e a ideia inicial é de fato ser um botão que aparece as informações quando se passa o mouse.
       
      Grato :)
    • Por Gabriel Barros Santana
      Oi, estou com uma duvida. Estava criando um meno de categorias para um site e-commerce na tray.
      Porém estou lutando para editar na plataforma da tray. Tenho um menu horizontal com os subníveis vertical porém queria editar para alterar o estilo e conteúdo mas a tray ta sendo bem estranha para mim alguma ajuda ? 
       
      Queria mudar desse menu hover normal de lista do site "JP" pra esse mais dinâmico com um caixa maior e com foto de produtos como exemplo do site "casas bahia".
       


    • Por xDenisX
      Olá pessoal tudo bem ?
       
      Gostaria de adicionar uma borda a um objeto passando o mouse em cima do mesmo usando o parâmetro hover sem que alterasse a posição dos outros ao lado ( sem ficar tremendo o layout)
       
      abaixo está o código. Alguém consegue me dar uma ajuda ?
       
      <html> <head> <title></title> <style type="text/css"> .quadrado{ width: 100px; height: 100px; background-color: grey; display: inline-block; margin:2px; } #container{ width: 320px; } .quadrado:hover{ border: 4px solid black; box-sizing: border-box; } </style> </head> <body> <div id="container"> <div class="quadrado">Primeiro</div> <div class="quadrado">Segundo </div> <div class="quadrado">Terceiro </div> <div class="quadrado">Quarto</div> <div class="quadrado">Quinto</div> <div class="quadrado">Sexto</div> <div class="quadrado">Sétimo</div> <div class="quadrado">Oitavo</div> <div class="quadrado">Nono</div> </div> </body> </html>  
    • Por Clovis Alberto Block
      Olá amigos,
       
      Baixei o código de um "mega menu" e passei a adapta-lo às minhas necessidades. O problema que não consigo resolver é acertar os tamanhos do hover, nos menus secundários está ok, porem no menu principal o hover está maior do que cada item de menu, executando o código é fácil perceber, basta navegar no menu principal que o problema já é percebido. Tenho a impressão que o menu principal "herdou" dos menus secundários o tamanho do hover. Gostaria de deixar o tamanho do hover no menu principal proporcional ao comprimento de cada texto. Estou anexando os arquivos, inclusive nos mesmos deixei minhas tentativas de acerto em forma de comentários. Sou novo em HTML/CSS, então se virem código ruim, fiquem à vontade para opinar. Por favor, expliquem como se eu tivesse 08 anos rsrsrsr...
       
      P.S: Como faço para anexar meus arquivos fonte html e css3?
       
      Desde já agradeço.
       
      Clovis Alberto Block
    • Por FabianoSouza
      Toda 1ª TD da TR tem um checkbox.
      Quero que, ao passar o mouse sobre a TR (ou qualquer TD da TR) o checkbox seja exibido.
      E depois, ao sair da TR, o checkbox volte o seu estado original (oculto).
      Isso não está funcionando...
      input[type=checkbox] fieldset[id="atividades-candidato"]table tr td:hover{ display:inline; }  
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.