Logo e descrição

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

Resolvido Logo e descrição

Mensagem por Tiaguu em 16/03/18, 04:41 pm

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


Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 658
Pontos Ativos : 1001

Ver perfil do usuário http://wscgames.forumeiros.com/

Resolvido Re: Logo e descrição

Mensagem por virus em 16/03/18, 11:22 pm

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.
avatar

virus
Usuário destaque

Masculino
Inscrito dia : 03/03/2013
Mensagens : 697
Pontos Ativos : 908

Ver perfil do usuário

Resolvido Re: Logo e descrição

Mensagem por Tiaguu em 17/03/18, 02:55 pm

@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.



Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 658
Pontos Ativos : 1001

Ver perfil do usuário http://wscgames.forumeiros.com/

Resolvido Re: Logo e descrição

Mensagem por virus em 17/03/18, 08:47 pm

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.
avatar

virus
Usuário destaque

Masculino
Inscrito dia : 03/03/2013
Mensagens : 697
Pontos Ativos : 908

Ver perfil do usuário

Resolvido Re: Logo e descrição

Mensagem por Tiaguu em 18/03/18, 12:55 pm

@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

Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 658
Pontos Ativos : 1001

Ver perfil do usuário http://wscgames.forumeiros.com/
  • 0

Resolvido Re: Logo e descrição

Mensagem por virus em 18/03/18, 05:48 pm

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.
avatar

virus
Usuário destaque

Masculino
Inscrito dia : 03/03/2013
Mensagens : 697
Pontos Ativos : 908

Ver perfil do usuário

Resolvido Re: Logo e descrição

Mensagem por Tiaguu em 18/03/18, 09:50 pm

@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

Tiaguu
Usuário destaque

Masculino
Inscrito dia : 28/08/2011
Mensagens : 658
Pontos Ativos : 1001

Ver perfil do usuário http://wscgames.forumeiros.com/

Resolvido Re: Logo e descrição

Mensagem por virus em 18/03/18, 09:55 pm

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

virus
Usuário destaque

Masculino
Inscrito dia : 03/03/2013
Mensagens : 697
Pontos Ativos : 908

Ver perfil do usuário

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum