Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Estrutura do post

4 participantes

Houdini Houdini  • Sáb 17 Ago 2013 - 16:32

Estrutura do post Empty Estrutura do post Sáb 17 Ago 2013 - 16:32

Qual é minha questão:
Gostaria de uma estrutura de post da seguinte maneira.

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Teria como?

Endereço do meu fórum:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Versão:
PunBB

Legolas Legolas  • Sáb 17 Ago 2013 - 16:55

Estrutura do post Empty Re: Estrutura do post Sáb 17 Ago 2013 - 16:55

Reputação da mensagem: 100% (1 votos)
Nome
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]Preço
Peso
Descriçãoeeeeeeeeeeeeeeeeeeeeeeeeeeee


Última edição por Cris Varella em Sáb 17 Ago 2013 - 19:11, editado 2 vez(es)

Houdini Houdini  • Sáb 17 Ago 2013 - 17:01

Estrutura do post Empty Re: Estrutura do post Sáb 17 Ago 2013 - 17:01

Gostaria que ficasse mais com a imagem.....Sei que este efeito dar para fazer por CSS.

Legolas Legolas  • Sáb 17 Ago 2013 - 17:16

Estrutura do post Empty Re: Estrutura do post Sáb 17 Ago 2013 - 17:16

Me manda a imagem

Houdini Houdini  • Sáb 17 Ago 2013 - 17:27

Legolas Legolas  • Sáb 17 Ago 2013 - 19:10

Estrutura do post Empty Re: Estrutura do post Sáb 17 Ago 2013 - 19:10

Eu não consegui visualizar a imagem que você mandou, então coloquei a do seu avatar. Basta você trocar a imagem e editar o texto a seu gosto. Espero ter ajudado.

Nome
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]Preço
Peso
Descriçãoeeeeeeeeeeeeeeeeeeeeeeeeeeee
O code é esse:
Código:
[table style="text-align: left; width: 100%;" border="1" cellpadding="0" cellspacing="0"][tr][td style="text-align: center;" colspan="3" rowspan="1"]Nome[/td]
[/tr]
[tr][td style="text-align: center;" width: 75px; height: 100px;" colspan="1" rowspan="3"]<img src="http://r17.imgfast.net/users/1717/45/34/10/avatars/752-66.jpg" style="width: 75px; height: 100px;">[/td]
[td style="text-align: center; background-color: rgb(0, 0, 0);"]Preço[/td]
[td][/td]
[/tr]
[tr][td style="text-align: center; background-color: rgb(0, 0, 0);"]Peso[/td]
[td][/td]
[/tr]
[tr][td style="text-align: center; background-color: rgb(0, 0, 0);"]Descrição[/td]
[td]eeeeeeeeeeeeeeeeeeeeeeeeeeee[/td]
[/tr]
[/table]

Houdini Houdini  • Dom 18 Ago 2013 - 8:17

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 8:17

Não ficou elegante......

Queria algo mais parecido com este abaixo...

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

veja o exemplo aqui:

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Só que gostaria que o mesmo fosse menor.....

Target Target  • Dom 18 Ago 2013 - 9:55

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 9:55

Olá amigo,
Tome:

Código para o tópico
Código:

<div id='caixa_principal'><div id='titulo_principal'><b>NOME_DO_EQUIPAMENTO_AQUI</b></div><img id='imagem_left' src='LINK_DA_IMAGEM AQUI'>
<div id='desc_right'><b>Descrição: </b>
DIGITE_A_SUA_DESCRIÇÃO_AQUI!</div>
<div id='bons_right'>
<b>Bônus: </b>
DIGITE_O_SEU_BÔNUS_AQUI!</div>
</div>

NOTA: Os seus HTML's devem estar ATIVADOS.

CSS
AdminCP >> Visualização >> Imagens e Cores >> Cores >> Aba " Folha de estilo CSS "

Código:

#titulo_principal {
    margin-bottom: 10px;
    background: #000;
    color: #fff;
    padding: 10px;
    text-align: center;
    border-radius: 10px 10px 2px 2px;
  -moz-border-radius: 10px 10px 2px 2px;
  -webkit-border-radius: 10px 10px 2px 2px;
}
#desc_right {
    margin-left: 10px;
    float: right;
    width: 290px;
    height: 115px;
    overflow: auto;
    border: 1px solid rgb(0, 0, 0);
    border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
    -webkit-border-radius: 20px 20px 20px 20px;
    padding: 10px;
    margin-bottom: 8px;
}
#bons_right {
    margin-left: 10px;
    float: right;
    width: 290px;
    height: 85px;
    overflow: auto;
    border: 1px solid #000;
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    padding: 10px;
}
#imagem_left {
    border: 1px solid #000;
    float: left;
    padding: 5px;
    width: 250px;
    height: 250px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
#caixa_principal {
    margin: 2px;
    min-height: 305px;
    border: 2px solid;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    width: 585px;
    padding: 10px;
}
Até mais.

Houdini Houdini  • Dom 18 Ago 2013 - 10:10

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 10:10

Não meu caro, este já e do meu fórum, só que gostaria de um novo, na mesma elegância, como esta imagem:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Entendeste?

Legolas Legolas  • Dom 18 Ago 2013 - 11:09

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 11:09

Reputação da mensagem: 100% (1 votos)
Acho que entendi o que você quer fazer. Bom eu consegui somente isso, aí você edita as cores no css:

Esse aqui é para os tópicos:
Código:
[table class="forumbg" style="width: 98%; margin: 0 auto; padding: 5px 3px 3px 3px;" cellspacing="0"][tr][td style="padding-bottom: 3px;"][color=white][b]Texto[/b][/color][/td]
[/tr]
[tr][td][table class="row2" style="width: 100%;"][tr][td][table class="table1" style="width: 100%;"][tr][td][b]Texto:[/b][/td]
[td]Texto[/td]
[/tr]
[tr][td][b]Texto:[/b][/td]
[td]Texto[/td]
[/tr]
[tr][td][b]Texto:[/b][/td]
[td]Texto[/td]
[/tr]
[tr][td][b]Texto:[/b][/td]
[td]Texto[/td]
[/tr]
[tr][td][b]Texto:[/b][/td]
[td]Texto[/td]
[/tr]
[/table]
[/td]
[/tr]
[/table]
[/td]
[/tr]
[/table]
E aqui o css:
Código:
.forumbg {
background-color: #1775bd;
background-image:url(http://2img.net/i/fa/fdf3/bg_cat.png);
background-position: 0 0;
background-repeat:repeat-x;
border: 2px solid #fff;
clear:both;
margin-bottom:4px;
padding:0 5px
}* html .forumbg {height:1%}*+ html .forumbg{min-height:1px}.forumbg table.table1{margin:0 -2px -1px -1px}

.row2 {
background-color: #f5f5f5
border-radius: 1px !important;
}

Houdini Houdini  • Dom 18 Ago 2013 - 11:46

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 11:46

Já consegui resolver, consegui editar e criar uma, resolvido.......

Target Target  • Dom 18 Ago 2013 - 11:56

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 11:56

Reputação da mensagem: 100% (1 votos)
Olá senhor,
Agora que entendi, pude fazer umas modificações no css para funcionar, não ficou muito igual.

CSS:
Código:

#titulo_principal {
    background: #000;
    color: #fff;
    padding: 10px;
    text-align: center;
}
#peso_right {
    overflow: auto;
    background: #000;
    padding: 5px;
    margin-right: 77px;
    margin-bottom: -15px;
}
#desc_right {
    overflow: auto;
    background: #000;
    padding: 5px;
    margin-bottom: -10px;
}

#preco_right {
    margin-top: -14px;
    overflow: auto;
    background: #000;
    padding: 5px;
    margin-right: 77px;
    margin-bottom: -15px;
}

#imagem_left {
    border: 1px solid #000;
    float: left;
    padding: 5px;
    width: 75px;
    height: 100px;
}
#caixa_principal {
    margin: 2px;
    border: 2px solid;
    width: 300px;
}
Código para o post:
Código:

<div id='caixa_principal'><div id='titulo_principal'><b>NOME_DO_EQUIPAMENTO_AQUI</b></div><img id='imagem_left' src='LINK_DA_IMAGEM AQUI'>
<div id='preco_right'><b>Preço: </b>
</div>
0,0000
<div id='peso_right'><b>Peso: </b>
</div>
00000
<div id='desc_right'>
<b>Descrição: </b>
</div>
descrição_aqui_
</div>

Houdini Houdini  • Dom 18 Ago 2013 - 12:11

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 12:11

Já consegui criar uma, mais veja como ficou..

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Queria que as mesma ficassem lado a lado, mas note que ficam uma abaixo da outra, como ajustar isso?

Daemon Daemon  • Dom 18 Ago 2013 - 12:12

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 12:12

Reputação da mensagem: 100% (2 votos)
Adicione ao css:
Código:
#caixa_principalsm {display: inline-block;}
Até mais!

Houdini Houdini  • Dom 18 Ago 2013 - 12:26

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 12:26

Funcionou direitinho Daemon, valeu.

Resolvido e pode também fechar o outro tópico que criei.........

Daemon Daemon  • Dom 18 Ago 2013 - 12:41

Estrutura do post Empty Re: Estrutura do post Dom 18 Ago 2013 - 12:41

[sucesso=Tópico Resolvido; e Bloqueado][/sucesso]Movido para: Arquivo - Pedido de código

Conteúdo patrocinado  • 

Estrutura do post Empty Re: Estrutura do post

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