Caixas com imagens e textos

4 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Caixas com imagens e textos

Mensagem por #d0C 13.01.15 12:45

Detalhes da dúvida

Versão do fórum : PunBB
Nível de acesso : Fundador
Navegador usado : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Imagem :
Imagem da minha dúvida:

Membros afetados : Todos os membros do fórum
Endereço do fórum : http://corrente-grafica.forumeiro.com/

Descrição do problema

Bom dia a todos.
No fórum KROMUS DESIGN tem la umas caixas abaixo do menu com texto e umas imagens, e eu gostaria se pososivel de obter esse mesmo código para poder colocar no meu fórum.
As caixas das quais eu estou falando sao as caixas que estao com uma borda vermelha na imagem disponivel.

Obrigado desde já.
#d0C

#d0C
Super Membro

Membro desde : 13/09/2013
Mensagens : 1118
Pontos : 1536

http://vortextips.wix.com/vortex

Ir para o topo Ir para baixo

Tópico resolvido Re: Caixas com imagens e textos

Mensagem por EuficoLoko 13.01.15 13:01

Olá!

Faça esse procedimento:
Painel de Controle Seta Visualização Seta Página inicial Seta Geral Seta Conteúdo da mensagem
Código:
<div id="news-bloco">
                              
   <div class="news-bloco-1">
                    <a href="http://kromusdesign.forumais.com/t7980-a-importancia-de-colocar-as-ideias-em-pratica-assim-que-surgem#93843"><img id="hover_effect" src="http://revistagalileu.globo.com/Revista/Galileu2/foto/0,,43897463,00.jpg" /></a>             
      <h1 style="background-color:#bd5d45;" class="h1-titulo-1">
          A importância de colocar as ideias em prática assim que surgem. Fiz o teste e deu certo!<br />           
      </h1>
                                 
   </div>
                              
   <div class="news-bloco-2">
                    <a href="http://kromusdesign.forumais.com/t7939-arte-x-design"><img id="hover_effect" src="http://i1185.photobucket.com/albums/z356/EskilloBR/1779264_590810701003436_1306851565_n_zps809d2000.jpg" /></a>             
      <h1 style="background-color:#82735c;" class="h1-titulo-1">
                       Arte x Design: discussões. <br />Para você, são a mesma coisa?             
      </h1>
                                 
   </div>
                              
   <div class="news-bloco-3">
                    <a href="http://kromusdesign.forumais.com/t7977-inspiracao-metazz-metal-album-covers-redesigned"><img id="hover_effect" src="http://www.brainstorm9.com.br/wp-content/uploads/2015/01/metazz-960x539.jpg" /></a>             
      <h1 style="background-color:#a42f37;" class="h1-titulo-1">
                     Inspiração: Metazz - Já imaginou os álbuns atuais de bandas de metal em um estilo retrô?           
      </h1>
                                 
   </div>
                              
</div>
                                <style>#news-bloco  {width:860px;height:290px;}
   .news-bloco-1 {width:500px; height:285px; float:left;}
   .news-bloco-1 img {width:500px; height:285px;}
   
   .news-bloco-2 {width:345px; height:140px; float:left; margin-left:5px;}
   .news-bloco-2 img {width:345px; height:140px;}
   
   .news-bloco-3 {width:345px; height:140px; float:left; margin-left:5px; margin-top:5px;}
   .news-bloco-3 img {width:345px; height:140px;}
   
   .h1-titulo-1 {padding: 6px 6px 6px 6px; margin: 0px 0px 0px 5px; margin-right:10px; width: auto; height: auto;
              font-family: "Myriad Pro", sans-serif; font-size: 16px; font-weight: lighter; color: white !important; position:relative; top: -60px; left: 0px;}
#pun-announcement {background-color: transparent;border-style: solid;border-width: 0px;padding: 0px 0px 0px 0px;}

   #hover_effect{
       -webkit-transition: opacity 0.5s; /* For Safari 3.1 to 6.0 */
          transition: opacity 0.5s; 
        opacity:1;
   }
   #hover_effect:hover{
        opacity:0.5;
    }
</style>                               

Abraços!
EuficoLoko

EuficoLoko
Membro

Membro desde : 12/01/2015
Mensagens : 996
Pontos : 1286

http://lokoscripts.forumeiros.com/ https://www.facebook.com/people/Eufico-Forumeiros/10000903544610

Ir para o topo Ir para baixo

  • 0

Tópico resolvido Re: Caixas com imagens e textos

Mensagem por [K]oke 13.01.15 13:13

Olá,

Coloque na pagina inicial
Código:
<div class="main"><div id="pun-announcement"><p></p><div id="news-bloco">
                            
   <div class="news-bloco-1">
                    <a href="http://kromusdesign.forumais.com/t7980-a-importancia-de-colocar-as-ideias-em-pratica-assim-que-surgem#93843"><img src="http://revistagalileu.globo.com/Revista/Galileu2/foto/0,,43897463,00.jpg" id="hover_effect"></a>             
      <h1 class="h1-titulo-1" style="background-color:#bd5d45;">
         A importância de colocar as ideias em prática assim que surgem. Fiz o teste e deu certo!<br>           
      </h1>
                               
   </div>
                            
   <div class="news-bloco-2">
                    <a href="http://kromusdesign.forumais.com/t7939-arte-x-design"><img src="http://i1185.photobucket.com/albums/z356/EskilloBR/1779264_590810701003436_1306851565_n_zps809d2000.jpg" id="hover_effect"></a>             
      <h1 class="h1-titulo-1" style="background-color:#82735c;">
                     Arte x Design: discussões. <br>Para você, são a mesma coisa?           
      </h1>
                               
   </div>
                            
   <div class="news-bloco-3">
                    <a href="http://kromusdesign.forumais.com/t7977-inspiracao-metazz-metal-album-covers-redesigned"><img src="http://www.brainstorm9.com.br/wp-content/uploads/2015/01/metazz-960x539.jpg" id="hover_effect"></a>             
      <h1 class="h1-titulo-1" style="background-color:#a42f37;">
                     Inspiração: Metazz - Já imaginou os álbuns atuais de bandas de metal em um estilo retrô?           
      </h1>
                               
   </div>
                            
</div><p></p></div></div>

Até Mais!
[K]oke

[K]oke
Membro

Membro desde : 26/04/2014
Mensagens : 897
Pontos : 1628

http://bestskins.net/forum https://www.facebook.com/davis.natsu

Ir para o topo Ir para baixo

Tópico resolvido Re: Caixas com imagens e textos

Mensagem por #d0C 16.01.15 13:20

Muito obrigado aos dois! <3
#d0C

#d0C
Super Membro

Membro desde : 13/09/2013
Mensagens : 1118
Pontos : 1536

http://vortextips.wix.com/vortex

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Caixas com imagens e textos

Mensagem por nikka 19.01.15 15:55

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
nikka

nikka
Principal Contribuidor
Principal Contribuidor

Membro desde : 17/12/2008
Mensagens : 15620
Pontos : 19897

https://ajuda.forumeiros.com/ https://www.facebook.com/forumeirospt https://twitter.com/Forumeiros_PT

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos