Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

mhqmelo

[Resolvido] Layout com diferentes backgrounds.

Por , em Desenvolvimento frontend

Recommended Posts

mhqmelo    0

mhqmelo
Postado

Boa noite a todos,

Minha dúvida é o seguinte:

Existe alguma forma mais correta de colocar varios background em um layout do que este exemplo que eu estou fazendo?

Ele funciona perfeitamente, porém eu queria uma segunda opinião sobre isso, pois acho que ta muito complicado pra fazer ele funcionar!

 

basicamente o código é esse: (Somente para referencia)

 

HTML

<div id=bg_header>
<div id=header>
<div id=bg_conteudo>
<div id=conteudo>
<div id=bg-footer>
<div id=footer>

 

CSS

 

#bg_header{
width=100%;
background:url(background_da_pagina_somente_no_topo repeat-x);(150px altura x 1px largura - por exemplo)
}
#header{
width:900px;
background-color:#000;
margin: 0 auto;
}
#bg_conteudo{
width:100px;
background-color:0f1;
}
#conteudo{
width:900px;
background-color:FFF;
}
#bg_footer
width:100px;
background:url(plano_de_fundo_footer_)
}
#footer{
width:900px;
background:123;}

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

poste a imagem do layout, para identificarmos o efeito final.

 

depende do problema, é impossível apontarmos uma solução sem sabermos exatamente do que se trata.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

está um pouco pesada.

o layout é extremamente simples do ponto de vista 'visual'. (redundante :P)

 

 

dicas:

-> o <body> também é um elemento, você poderia ter usado ele para aplicar algum dos backgrounds de width: 100%

-> pense várias vezes se é necessário criar um elemento apenas para ser background de algo.

-> teu logo deveria ser uma tag <img />

-> #main está sem uso

-> isso aqui: http://brcomputadores.com/images/bg_main_content.png

é apenas uma cor sólida ? use background-color, e novamente, poderia ter aplicado somente no body, assim não precisava dessa div.

 

são 'otimizações' que você vai aprender com o tempo

Compartilhar este post

Link para o post
Compartilhar em outros sites

mhqmelo    0

mhqmelo
Postado

A minha duvida era essa, se realmente vale a pena criar uma div so para background ou se existe outra forma de colocar backgrounds sem precisar usar essa "div extra"? O bg_main_content.png é uma cor com efeito gradiente. Realmente o #main esta sem uso..

Compartilhar este post

Link para o post
Compartilhar em outros sites

CarlosRN    0

CarlosRN
Postado

Boa tarde!

Queria só tirar uma dúvida com o colega mhqmelo. Vi seu site www.brcomputadores.com e há tempos estou tentando achar o plugin JQuery para sliders que você usou no site. Será que tem como você me dar uma dica de como eu encontro ou enviar para mim. Um abraço!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Evandro Oliveira    331

Evandro Oliveira
Postado

Somente quando estritamente necessário. Quando não for possível fazer o plano de fundo com os elementos semânticos que fazem parte do conteúdo. Tenha em mente que toda marcação vazia é considerada falha de semântica. Se um elemento foi concebido para não receber conteúdo, ele deverá ser montado dessa forma, como acontece com input, img, br. Qualquer elemento que sirva como contêiner e estiver vazio está semanticamente incorreto. Por vezes há a necessidade de uso deste tipo de marcação em prol do leiaute. Porém, esta informação apenas reforça minha primeira frase: Apenas quando muito necessário.

Compartilhar este post

Link para o post
Compartilhar em outros sites

mhqmelo    0

mhqmelo
Postado

Somente quando estritamente necessário. Quando não for possível fazer o plano de fundo com os elementos semânticos que fazem parte do conteúdo. Tenha em mente que toda marcação vazia é considerada falha de semântica. Se um elemento foi concebido para não receber conteúdo, ele deverá ser montado dessa forma, como acontece com input, img, br. Qualquer elemento que sirva como contêiner e estiver vazio está semanticamente incorreto. Por vezes há a necessidade de uso deste tipo de marcação em prol do leiaute. Porém, esta informação apenas reforça minha primeira frase: Apenas quando muito necessário.

 

Explicado! Muito Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme_90    33

Guilherme_90
Postado

Site muito bom e com layout lindo, porém não é adequeado acessá-lo em resolução 1024x768.

Compartilhar este post

Link para o post
Compartilhar em outros sites

mhqmelo    0

mhqmelo
Postado

Site muito bom e com layout lindo, porém não é adequeado acessá-lo em resolução 1024x768.

 

Valeu pelo elogio!! O erro foi meu mesmo, vou colocar a resolução pra 980px. Eu pensei que se eu colocasse em 1024x768 iria ficar do tamanho da tela exato.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito