Imagem em volta do fórum
+2
MateusV.
@Chazy
6 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Imagem em volta do fórum
Qual é minha questão:
Eu postei em outra categoria pelos simples fato de que eu não estava conseguindo
postar aqui, sendo que onde eu postei não tinha formulario.
Pois bem, criei outro tópico e minha questão é:
Como fazer para colocar um efeito de acordo com essas imagens, e como colocar
adcionar um corpo ao forum? :
https://i.servimg.com/u/f46/16/76/83/34/art-bo10.png
https://i.servimg.com/u/f67/16/17/34/47/middle10.png
Link do fórum onde eu encontrei tal efeito: http://tester.forumeiros.com/
Colocar uma espécie de estrutura, ou melhor, um contorno no fórum.
Como colocar ?
Meus Agradecimentos desde já.
Medidas que eu tomei para corrigir o problema:
..
Links e imagens do meu problema:
https://i.servimg.com/u/f46/16/76/83/34/art-bo10.png
https://i.servimg.com/u/f67/16/17/34/47/middle10.png
Como meu forum está sem o "corpo" :
https://i.imgur.com/eO1yp.png
Endereço do meu fórum:
http://kingarts.forumeiros.com/
Versão do meu fórum:
PUNBB
Eu postei em outra categoria pelos simples fato de que eu não estava conseguindo
postar aqui, sendo que onde eu postei não tinha formulario.
Pois bem, criei outro tópico e minha questão é:
Como fazer para colocar um efeito de acordo com essas imagens, e como colocar
adcionar um corpo ao forum? :
https://i.servimg.com/u/f46/16/76/83/34/art-bo10.png
https://i.servimg.com/u/f67/16/17/34/47/middle10.png
Link do fórum onde eu encontrei tal efeito: http://tester.forumeiros.com/
Colocar uma espécie de estrutura, ou melhor, um contorno no fórum.
Como colocar ?
Meus Agradecimentos desde já.
Medidas que eu tomei para corrigir o problema:
..
Links e imagens do meu problema:
https://i.servimg.com/u/f46/16/76/83/34/art-bo10.png
https://i.servimg.com/u/f67/16/17/34/47/middle10.png
Como meu forum está sem o "corpo" :
https://i.imgur.com/eO1yp.png
Endereço do meu fórum:
http://kingarts.forumeiros.com/
Versão do meu fórum:
PUNBB
Última edição por @Chazy em 02.05.12 22:27, editado 1 vez(es)
Re: Imagem em volta do fórum
Olá, o tal efeito são imagens posicionadas no corpo do forum, coloca-las irá poder bugar o corpo de seu forum, ainda deseja o efeito?
Até mais.
Até mais.
Re: Imagem em volta do fórum
Olá,
Pois Bem, eu queria pelo menos testar
para ver como ficaria,
teria como me passar um breve tutorial ?
Até Mais.
Pois Bem, eu queria pelo menos testar
para ver como ficaria,
teria como me passar um breve tutorial ?
Até Mais.
Re: Imagem em volta do fórum
Olá,
Para colocar o corpo no fórum eu preciso ajustar um pouco de seu CSS.
Primeiramente, me mande um fórum que tenha este estilo (o corpo) que lhe agrada.
Até mais.
Para colocar o corpo no fórum eu preciso ajustar um pouco de seu CSS.
Primeiramente, me mande um fórum que tenha este estilo (o corpo) que lhe agrada.
Até mais.
Convidad- Convidado
Re: Imagem em volta do fórum
Olá Touks,
Ai que está o problema, eu coloquei um novo
tema ao meu fórum, sendo que, esse novo tema
veio sem CSS algum, o pouco de CSS que tem
foi eu mesmo que implementei, para personalizar a
aparencia do fórum.
porém aqui está caso precise:
CSS:
E enquanto ao forum de exemplo que voce pediu, eu queria como a desse forum:
http://tester.forumeiros.com/
Agradeço a Atenção.
Chazy[/b]
Ai que está o problema, eu coloquei um novo
tema ao meu fórum, sendo que, esse novo tema
veio sem CSS algum, o pouco de CSS que tem
foi eu mesmo que implementei, para personalizar a
aparencia do fórum.
porém aqui está caso precise:
CSS:
- Código:
/*MUDAR COR DOS LINKS AO PASSAR O MOUSE E TIRAR SUBLINHAÇÃO */
#pun-navlinks a:active,#pun-navlinks a:focus,#pun-navlinks a:hover,.pun .main-foot .options a,.pun .main-foot .options a:link,.pun .main-foot .options a:visited,.atnt a:hover,.pun a:hover,a:active{color:#20B2AA;text-decoration:none}
/*Tirar Sublinhado dos links*/
a {
text-decoration: none;
}
/*Equipe Fundo*/
.postmain, .postbody{background: none !important;}
.topic{background: #fff;}
/*QUOTE FDF*/
blockquote,blockquote blockquote,blockquote blockquote blockquote{-moz-border-radius:5px;-moz-box-shadow:0 1px 5px rgba(0,0,0,.15);-webkit-border-radius:5px 5px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);background:none;background-color:#F9F9F9;background-image:-webkit-gradient(linear,lefttop,leftbottom,from(#F9F9F9), to(#F0F0F0));border:1px solid #DEDEDE;border-radius:5px 5px;box-shadow:0 1px 5px rgba(0,0,0,.15);padding:10px 20px}
/*CAIXA DE CODE E SPOILER FDF*/
dl.codebox dt {
background: transparent url(http://cdn1.iconfinder.com/data/icons/silk2/script_code.png) no-repeat scroll 0px 0px;
color: #0372BE;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
padding-bottom: 0px;
padding-left: 22px;
padding-right: 0px;
padding-top: 0px;
text-transform: none;
}
/*CURSOR PERSONALIZADO*/
body {
cursor: url('http://img24.imageshack.us/img24/7129/glovecursor.png'), url('http://img24.imageshack.us/img24/7129/glovecursor.png'), auto;
}
a:hover {
cursor: url('http://img24.imageshack.us/img24/7129/glovecursor.png'), url('http://img24.imageshack.us/img24/7129/glovecursor.png'), auto;
}
/*BARRA DE ROLAGEM PERSONALIZADA*/
/* ---------------- Barra de rolagem Google Chrome---------------- */
::-webkit-scrollbar {
width: 15px;
height: 5px; }
::-webkit-scrollbar-track-piece {
background: #ffffff;
}
::-webkit-scrollbar-thumb:vertical {
height: 5px;
background: #13B8D5;
border-radius: 10px;
}
::-webkit-scrollbar-thumb:horizontal {
width: 5px;
background-color: #000000;
}
/*BOTÃO NEON*/
az, bl, azul, blue, .az {text-shadow: 0px 0px 5px blue;color: blue;}
v, vermelho, red, .v {text-shadow: 0px 0px 5px red;color: red;}
rx, roxo, purple, rox, .rx {text-shadow: 0px 0px 5px #b300ff;color: #b300ff;}
am, amarelo, yelow, .am {text-shadow: 0px 0px 5px #fbff00;color: #fbff00;}
c, ciano, cyan, .c {text-shadow: 0px 0px 5px #00e6ff;color: #00e6ff;}
r, rosa, pink, .r {text-shadow: 0px 0px 5px #ff7fee;color: #ff7fee;}
vr, verde, green, .vr {text-shadow: 0px 0px 5px #11ff00;color: #11ff00;}
l, laranja, orange, naruto, .l {text-shadow: 0px 0px 5px #ff9500;color: #ff9500;}
m, marron, brown, .m {text-shadow: 0px 0px 5px #7d4f0f;color: #7d4f0f;}
w, branco, white, .w {text-shadow: 0px 0px 5px #ffffff;}
pr, preto, black, .pr {text-shadow: 0px 0px 5px #000000;}
sp, .sp {text-shadow: 0px 0px 5px #0072ff;color: #0072ff !important;}
#text_editor_controls, .left-box{position:relative !important}
/*Reputação*/
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}
.vote .vote-no-bar {
display: none;
}
.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}
.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}
.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}
.vote .vote-button a[href $="plus"] {
background:url('http://i42.servimg.com/u/f42/17/32/13/00/plus_110.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
.vote .vote-button a[href $="minus"] {
background-image:url('http://i42.servimg.com/u/f42/17/32/13/00/-10.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
/*Responsaveis pela seçao*/
#modo {
display: none;
}
.table tbody.statused tr td.tcl:hover #modo {
display: block;
}
span.Administrador {
color: #FF6600;
font-weight: 700;
}
E enquanto ao forum de exemplo que voce pediu, eu queria como a desse forum:
http://tester.forumeiros.com/
Agradeço a Atenção.
Chazy[/b]
Re: Imagem em volta do fórum
Olá,
As versões são diferentes, então tive que reformular tudo.
Veja se fica bom:
Adicione em sua folha CSS.
Até mais.
As versões são diferentes, então tive que reformular tudo.
Veja se fica bom:
- Código:
#pun-foot {
display: inline-block !important;
height: 150px;
width: 1200px;
position: relative;
z-index: 999;
background: url(http://i46.servimg.com/u/f46/16/76/83/34/art-bo10.png) no-repeat bottom center;
margin-left: -41px;
}
body {
display: inline-block;
width: 1100px;
margin-top: -10px;
background: url(http://i67.servimg.com/u/f67/16/17/34/47/middle10.png) repeat-y center;
}
#content-container div#container {
width: 1100px;
margin-left: 130px;
padding: 15px;
padding-top: -65em;
}
#pun-about {display:none;}
#pun-intro {margin-left: 400px;}
#pun-head #pun-navlinks {margin-left: 150px;}
.module .main-content {margin-left:150px;}
.pun .main, .pun .main-category {margin-left: 110px;
width: 960px;}
Adicione em sua folha CSS.
Até mais.
Convidad- Convidado
Re: Imagem em volta do fórum
Olá Touks,
Funcionar funcionou,
mais olhe como ficou:
https://i.imgur.com/1Buyu.png
https://i.imgur.com/ktpCo.png
Funcionar funcionou,
mais olhe como ficou:
https://i.imgur.com/1Buyu.png
https://i.imgur.com/ktpCo.png
Re: Imagem em volta do fórum
Boa tarde!
Adicionei esse codigo no Seu CSS:
Aqui funcionou perfeitamente!
Ele tem umas funções a mais!
Se ajudei agradeça
Adicionei esse codigo no Seu CSS:
- Código:
#content #main #main-content .main{background: url(http://i27.servimg.com/u/f27/16/17/34/47/shape_10.png);padding: 10px;
-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
#content #main .main-content{border: 1px dashed #CCC;
-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.main .main-head .page-title h2 {padding-bottom: 5px;
font-family: Trebuchet MS,Tahoma;font-style: italic;color: #686767;
text-shadow: 1px 1px 1px white;text-transform: none;
display: inline;font-size: 1.2em;font-weight: normal;}
.main .main-head{border: 1px dashed #CCC;background: none !important;
-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.statused tr {background: white url(http://i27.servimg.com/u/f27/16/17/34/47/body-b13.png);}
.statused tr:hover {background-color: #F6F4D0;}
.pun table td.tcl {height: 45px !important;background: none;}
.pun .main table td.tc2, .pun .main table td.tc3, .pun .main table td.tcr {background: none;}
Aqui funcionou perfeitamente!
Ele tem umas funções a mais!
Se ajudei agradeça
Re: Imagem em volta do fórum
Olá @Chazy!
Primeiramente peço-lhe desculpas, mas eu fiz uma pequena tentativa para resultar em um efeito que deseja chegar.
Primeiramente peço-lhe desculpas, mas eu fiz uma pequena tentativa para resultar em um efeito que deseja chegar.
O trecho em vermelho modifica a imagem do footer, no caso você pode aumentar o valor (positivo para direita e negativo para esquerda). O termo em azul, determina a largura das categorias e fóruns, o quanto mais aumentar, mais largo fica.#pun-foot {
display: inline-block !important;
height: 150px;
width: 1200px;
position: relative;
z-index: 999;
background: url(https://i.servimg.com/u/f46/16/76/83/34/art-bo10.png) no-repeat bottom center;
margin-left: 21px;
}
body {
display: inline-block;
width: 1100px;
margin-top: -10px;
background: url(https://i.servimg.com/u/f67/16/17/34/47/middle10.png) repeat-y center;
}
#content-container div#container {
width: 1100px;
margin-left: 130px;
padding: 15px;
padding-top: -65em;
}
#pun-about {display:none;}
#pun-intro {margin-left: 400px;}
#pun-head #pun-navlinks {margin-left: 150px;}
.module .main-content {margin-left:150px;}
/*** Posição das categorias e fóruns ***/
.pun .main, .pun .main-category {
margin-left: 110px;
width: 960px;
}
Convidad- Convidado
Re: Imagem em volta do fórum
Olá @Chazy, substitua sua CSS por esta:
Até mais.
- Código:
/*MUDAR COR DOS LINKS AO PASSAR O MOUSE E TIRAR SUBLINHAÇÃO */
#pun-navlinks a:active,#pun-navlinks a:focus,#pun-navlinks a:hover,.pun .main-foot .options a,.pun .main-foot .options a:link,.pun .main-foot .options a:visited,.atnt a:hover,.pun a:hover,a:active{color:#20B2AA;text-decoration:none}
/*Tirar Sublinhado dos links*/
a {
text-decoration: none;
}
/*Equipe Fundo*/
.postmain, .postbody{background: none !important;}
.topic{background: #fff;}
/*QUOTE FDF*/
blockquote,blockquote blockquote,blockquote blockquote blockquote{-moz-border-radius:5px;-moz-box-shadow:0 1px 5px rgba(0,0,0,.15);-webkit-border-radius:5px 5px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);background:none;background-color:#F9F9F9;background-image:-webkit-gradient(linear,lefttop,leftbottom,from(#F9F9F9), to(#F0F0F0));border:1px solid #DEDEDE;border-radius:5px 5px;box-shadow:0 1px 5px rgba(0,0,0,.15);padding:10px 20px}
/*CAIXA DE CODE E SPOILER FDF*/
dl.codebox dt {
background: transparent url(http://cdn1.iconfinder.com/data/icons/silk2/script_code.png) no-repeat scroll 0px 0px;
color: #0372BE;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
padding-bottom: 0px;
padding-left: 22px;
padding-right: 0px;
padding-top: 0px;
text-transform: none;
}
/*CURSOR PERSONALIZADO*/
body {
cursor: url('http://img24.imageshack.us/img24/7129/glovecursor.png'), url('http://img24.imageshack.us/img24/7129/glovecursor.png'), auto;
}
a:hover {
cursor: url('http://img24.imageshack.us/img24/7129/glovecursor.png'), url('http://img24.imageshack.us/img24/7129/glovecursor.png'), auto;
}
/*BARRA DE ROLAGEM PERSONALIZADA*/
/* ---------------- Barra de rolagem Google Chrome---------------- */
::-webkit-scrollbar {
width: 15px;
height: 5px; }
::-webkit-scrollbar-track-piece {
background: #ffffff;
}
::-webkit-scrollbar-thumb:vertical {
height: 5px;
background: #13B8D5;
border-radius: 10px;
}
::-webkit-scrollbar-thumb:horizontal {
width: 5px;
background-color: #000000;
}
/*BOTÃO NEON*/
az, bl, azul, blue, .az {text-shadow: 0px 0px 5px blue;color: blue;}
v, vermelho, red, .v {text-shadow: 0px 0px 5px red;color: red;}
rx, roxo, purple, rox, .rx {text-shadow: 0px 0px 5px #b300ff;color: #b300ff;}
am, amarelo, yelow, .am {text-shadow: 0px 0px 5px #fbff00;color: #fbff00;}
c, ciano, cyan, .c {text-shadow: 0px 0px 5px #00e6ff;color: #00e6ff;}
r, rosa, pink, .r {text-shadow: 0px 0px 5px #ff7fee;color: #ff7fee;}
vr, verde, green, .vr {text-shadow: 0px 0px 5px #11ff00;color: #11ff00;}
l, laranja, orange, naruto, .l {text-shadow: 0px 0px 5px #ff9500;color: #ff9500;}
m, marron, brown, .m {text-shadow: 0px 0px 5px #7d4f0f;color: #7d4f0f;}
w, branco, white, .w {text-shadow: 0px 0px 5px #ffffff;}
pr, preto, black, .pr {text-shadow: 0px 0px 5px #000000;}
sp, .sp {text-shadow: 0px 0px 5px #0072ff;color: #0072ff !important;}
#text_editor_controls, .left-box{position:relative !important}
/*Reputação*/
.vote {
padding: 4px 1px 4px 1px;
text-align: center;
width:20px;
background-color: #eaeaea;
border: 1px solid #d4d6d5;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
}
.vote .vote-no-bar {
display: none;
}
.vote .vote-bar {
border-left: 0px;
border-right: 0px;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #d4d6d5;
font-size: 0px;
height: 50px;
margin: 0px;
width: 20px;
padding: 3px 0px 3px 0px;
}
.vote .vote-bar-plus {
margin-left: 7px;
width: 6px;
}
.vote .vote-bar-minus {
margin-left: 7px;
width: 6px;
}
.vote .vote-button a[href $="plus"] {
background:url('http://i42.servimg.com/u/f42/17/32/13/00/plus_110.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
.vote .vote-button a[href $="minus"] {
background-image:url('http://i42.servimg.com/u/f42/17/32/13/00/-10.png');
background-repeat: no-repeat;
color:transparent;
display:block;
height:21px;
width:22px;
}
/*Responsaveis pela seçao*/
#modo {
display: none;
}
.table tbody.statused tr td.tcl:hover #modo {
display: block;
}
span.Administrador {
color: #FF6600;
font-weight: 700;
}
#pun-foot {
display: inline-block !important;
height: 150px;
width: 1200px;
position: relative;
z-index: 999;
background: url(http://i46.servimg.com/u/f46/16/76/83/34/art-bo10.png) no-repeat bottom center;
margin-left: 21px;
}
body {
display: inline-block;
width: 1100px;
margin-top: -10px;
background: url(http://i67.servimg.com/u/f67/16/17/34/47/middle10.png) repeat-y center;
}
#content-container div#container {
width: 1100px;
margin-left: 130px;
padding: 15px;
padding-top: -65em;
}
#pun-about {display:none;}
#pun-intro {margin-left: 400px;}
#pun-head #pun-navlinks {margin-left: 150px;}
.module .main-content {margin-left:150px;}
/*** Posição das categorias e fóruns ***/
.pun .main, .pun .main-category {
margin-left: 110px;
width: 960px;
}
Até mais.
Tópicos semelhantes
» Imagem acende com mouse em cima e volta ao normal quando ele sai
» Forum volta para versões anteriores
» Adicionar sombra em volta do fórum
» Colocar um quadro em volta do fórum
» Colocar Negrito Volta Do Forum
» Forum volta para versões anteriores
» Adicionar sombra em volta do fórum
» Colocar um quadro em volta do fórum
» Colocar Negrito Volta Do Forum
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos