Logo e descrição

2 participantes

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

Tópico resolvido Logo e descrição

Mensagem por Tiaguu 16.03.18 19:41

Detalhes da questão


Endereço do fórum: http://alterlove.forumeiros.com/
Versão do fórum: ModernBB

Descrição


Gostaria de deixar a logotipo e a descrição do fórum igual a imagem abaixo;
https://i.servimg.com/u/f62/15/86/28/62/2018-011.png

Coloquei uma logo na "Logo do fórum" no painel mas não funciona, apenas "Imagem de fundo do menu de navegação" Triste

avatar

Tiaguu
Membro

Membro desde : 28/08/2011
Mensagens : 658
Pontos : 1001

http://wscgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por virus 17.03.18 2:22

Olá, adicione ao final de sua folha de estilo CSS
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores
Código:
@import url('https://fonts.googleapis.com/css?family=Bowlby+One+SC');
.headerbar {
    background-color: #ffff00;
}
.headerbar:after {
    content: 'Alter Love';
    margin: 90px 0 0 90px;
    position: absolute;
    font-size: 110px;
    font-weight: bolder;
    color: black;
    letter-spacing: 6px;
    width: 418px;
    line-height: 106px;
    font-family: 'Bowlby One SC', cursive;
}
div#site-desc {
    border-left: 1px solid black;
    height: 150px;
    padding: 0 0 50px 50px;
    margin-left: 500px;
    top: 105px;
    overflow-x: auto;
    box-sizing: content-box;
}
div#site-desc p {
    font-size: 3em;
    font-weight: bolder;
    color: black;
    font-family: 'Trebuchet MS',sans-serif;
}

Até mais.
virus

virus
Membro

Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por Tiaguu 17.03.18 17:55

virus escreveu:Olá, adicione ao final de sua folha de estilo CSS
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores
Código:
@import url('https://fonts.googleapis.com/css?family=Bowlby+One+SC');
.headerbar {
    background-color: #ffff00;
}
.headerbar:after {
    content: 'Alter Love';
    margin: 90px 0 0 90px;
    position: absolute;
    font-size: 110px;
    font-weight: bolder;
    color: black;
    letter-spacing: 6px;
    width: 418px;
    line-height: 106px;
    font-family: 'Bowlby One SC', cursive;
}
div#site-desc {
    border-left: 1px solid black;
    height: 150px;
    padding: 0 0 50px 50px;
    margin-left: 500px;
    top: 105px;
    overflow-x: auto;
    box-sizing: content-box;
}
div#site-desc p {
    font-size: 3em;
    font-weight: bolder;
    color: black;
    font-family: 'Trebuchet MS',sans-serif;
}

Até mais.


Opa, funcionou, mas teria como adicionar uma imagem na logo? E retirar o nome do fórum. O tamanho seria mais ou menos o que está na imagem de exemplo.


avatar

Tiaguu
Membro

Membro desde : 28/08/2011
Mensagens : 658
Pontos : 1001

http://wscgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por virus 17.03.18 23:47

Boa noite.
Você quer que eu retire o texto da logo e deixe apenas a imagem?
... O problema que trabalhar com imagem dessa forma é muito ruim. Por a caso você tem uma imagem com apenas o texto?

Se também você me dizer qual fonte você usou talvez eu possa encontrar uma forma de obter o mesmo resultado da imagem sem precisar utilizar uma imagem.

Até a próxima.
virus

virus
Membro

Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por Tiaguu 18.03.18 15:55

virus escreveu:Boa noite.
Você quer que eu retire o texto da logo e deixe apenas a imagem?
... O problema que trabalhar com imagem dessa forma é muito ruim. Por a caso você tem uma imagem com apenas o texto?

Se também você me dizer qual fonte você usou talvez eu possa encontrar uma forma de obter o mesmo resultado da imagem sem precisar utilizar uma imagem.

Até a próxima.

Pode ser também Feliz
Aqui o link da fonte que usei; http://www.fontspace.com/fz/skam-font
avatar

Tiaguu
Membro

Membro desde : 28/08/2011
Mensagens : 658
Pontos : 1001

http://wscgames.forumeiros.com/

Ir para o topo Ir para baixo

  • 0

Tópico resolvido Re: Logo e descrição

Mensagem por virus 18.03.18 20:48

Boa tarde. Troque o código anterior por este:
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores
Código:
.headerbar:after {
    content: '';
    background: yellow url(https://i.imgur.com/AUwJWXy.png);
    background-position: center center;
    margin-top: 110px;
    margin-left: 4vw;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    height: 88px;
    width: 469px;
}
.headerbar {
    background-image: none;
    background-color: #ffff00;
}
div#site-desc {
    border-left: 1px solid #000;
    box-sizing: content-box;
    height: 150px;
    margin-left: 500px;
    overflow-x: auto;
    padding: 10px 0 50px 50px;
    top: 105px;
}
div#site-desc p {
    font-size: 3em;
    font-weight: bolder;
    color: black;
    font-family: 'Trebuchet MS',sans-serif;
}

A imagem utilizada foi esta: https://i.imgur.com/AUwJWXy.png

Até mais.
virus

virus
Membro

Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por Tiaguu 19.03.18 0:50

virus escreveu:Boa tarde. Troque o código anterior por este:
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores
Código:
.headerbar:after {
    content: '';
    background: yellow url(https://i.imgur.com/AUwJWXy.png);
    background-position: center center;
    margin-top: 110px;
    margin-left: 4vw;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    height: 88px;
    width: 469px;
}
.headerbar {
    background-image: none;
    background-color: #ffff00;
}
div#site-desc {
    border-left: 1px solid #000;
    box-sizing: content-box;
    height: 150px;
    margin-left: 500px;
    overflow-x: auto;
    padding: 10px 0 50px 50px;
    top: 105px;
}
div#site-desc p {
    font-size: 3em;
    font-weight: bolder;
    color: black;
    font-family: 'Trebuchet MS',sans-serif;
}

A imagem utilizada foi esta: https://i.imgur.com/AUwJWXy.png

Até mais.

Perfeito.
Muito obrigado. Muito feliz
avatar

Tiaguu
Membro

Membro desde : 28/08/2011
Mensagens : 658
Pontos : 1001

http://wscgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Logo e descrição

Mensagem por virus 19.03.18 0: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.
virus

virus
Membro

Membro desde : 03/03/2013
Mensagens : 695
Pontos : 910

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