Imagem de Fundo do Menu Navegação Aproxima Sozinha e Fica Embaçada

Detalhes da questão

Endereço do fórum: https://pmcem.forumeiros.com/
Versão do fórum: ModernBB

Descrição

Boa tarde!

Quando insiro uma imagem no fundo do Menu Navegação do meu fórum, o próprio sistema parece que "aproxima" a imagem, deixando-a embaçada e pouco nítida, consequentemente tornando-a diferente da imagem original.
Tirei alguns prints para demonstrar melhor sobre o que estou falando:

Imagem aproximada automaticamente pelo sistema: https://prnt.sc/srsywa
Se perceberem, parece que o próprio fórum reajusta a imagem... o problema é que a resolução dela é idêntica ao do headerbar: 1028x350.

Agora, vejam a mesma imagem, entretanto com a página inspecionada: https://prnt.sc/srt033
Como podem ver, a imagem verdadeira aparece, uma vez que conseguimos visualizar a parte de baixo da forma.

Gostaria de saber se existe alguma forma de desabilitar esse, pelo que parece, "reajuste automático" que o fórum faz quando eu insiro uma imagem no fundo do menu navegação, pois isso as deixa embaçadas.

Ah, aquela imagem é uma imagem teste, mas já testei com letras e fotos melhores e realmente fica embaçado. Me parece que o fórum dá um próprio "zoom", mesmo que não queiramos...

Espero que possam me ajudar!
Atenciosamente, Feranubis_.

Olá querido, adicione isso na sua folha de css:

Código:

.headerbar {
    height: 350px;
    background-size: initial;
   background-image: url(link);
   background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 350px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;

Obrigado por me responder, Strilk!

Infelizmente continuou da mesma forma: https://prnt.sc/srtalw

Me parece que o próprio site aproxima a imagem, e por isso ela perde a qualidade...

Sabe se existe um código para tirar esse provável "script" que tenha de zoom automático? Provável que tenha isso...

Saudações,

Experimente colocar esse código excluindo o código anterior do @Strilk e manter o seu:

Código:

.headerbar {
background-size: auto!important;
}


Atenciosamente,
Chagas

@Chagas, resolvido. Muito obrigado! O único problema é que a resolução diminuiu, pelo que parece. Veja: https://prnt.sc/sru015

Saudações,

Sim, é o efeito de hospedar na plataforma Servimg, aparentemente quando nós upamos as imagens nessa plataforma, tem a tendência de diminuir as dimensões no meu ver. Tente hospedar na plataforma Imgur e vê o que acontece.

Atenciosamente,
Chagas

Obrigado pela dica, Chagas!

O problema é que, pelo que estou vendo aqui, o fórum não reconhece o link do Imigur: https://prnt.sc/sru63s

Posso tentar por CSS, mas não tenho certeza se vai dar certo... Se não der, tento mudar a resolução ao salvar a imagem no editor.

Edit: Testei por CSS, e realmente não foi...

Saudações,

O link deve ser assim: https://i.imgur.com/1T1gsph.jpg

Atenciosamente,
Chagas

Eu percebi só depois... perdão, ainda sou leigo nesses assuntos. =D.
Apesar de ter dado certo, o redimensionamento continua falhando. Acredito eu que estou pegando as dimensões erradas para criar o Banner. Saberia me dizer como e onde posso encontrar as resoluções corretas e que se encaixem perfeitamente no plano de fundo do Menu Navegação, por gentileza?

Desde já, agradeço.

Saudações,

Aparentemente, isso varia de cada computador, tá? No meu computador é 1920x430 para um banner do seu fórum, eu recomendo que utilize Lightshot e faz uma marcação do banner no seu headerbar e lá aparecerá as dimensões corretas para seu computador.

Atenciosamente,
Chagas

Boa tarde novamente, Chagas.

Agradeço pelas orientações, me serviram e muito. Até! Pode fechar o chat ou colocar como "Resolvido", se quiser. (Não sei como isso funciona). Obrigado, novamente