[Resolvido] Background repetindo, como faço?

[lucasvfa 0]

Ei pessoal, joia?

Pois entao, eu estou com um problema no meu layout...

como faço pra esse fundo aqui http://img297.imageshack.us/img297/9531/css.gif com degrade apenas em cima, repetir no meu blog?

 

O endereço do blog eh esse: http://extraordinarios.blog.br

entenderam o q eu quis dizer?

Eh simples, so colocar essa imagem, com degrade apenas em cima, para repetir.

Alguem ai da um helps?

[_Isis_ 202]

Crie uma div com background: url('imagem.gif') repeat-x

[lucasvfa 0]

foi mal, sou bem noob ainda!

asidaiudhaisudhaiusdhaiuhdauisdhaiushda

mas nao entendi muito direito nao...

[Thiago Retondar 18]

Coloque aquela imagem como o background de onde desejar. Ficando assim:

 

div#comfundo{
width: tamanho;
height: tamanho;
background: url(http://img297.imageshack.us/img297/9531/css.gif) repeat-x top left;
}

[lucasvfa 0]

tem que mudar esse COMFUNDO pra oq?

[Thiago Retondar 18]

Para o ID da sua <div> que vai receber o fundo. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[lucasvfa 0]

}
body {
		div#comfundo{
		width: 600;
		height: 300;
		background: url(http://img297.imageshack.us/img297/9531/css.gif) repeat-x top left;
}

 

aqui, por enkanto ta desse jeito.

 

o problema eh que sou muuuuuito noob nessa parte, meu negocio eh design, e so falta isso pro meu blog ficar pronto.

[Thiago Retondar 18]

Recomendo estudar um pouco mais sobre a teoria do CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Ficaria assim:

 

 

body {
width: 600;
height: 300;
background: url(http://img297.imageshack.us/img297/9531/css.gif) repeat-x top left;
}

[lucasvfa 0]

ai, saca so como ficou: http://www.extraordinarios.blog.br/

 

so que ai quando você desce fica branco...so que nao da pra repetir essa imagem por causa do degrade, entao eu tenho que criar outra imagem sem degrade pra colocar embaixo certo??

ou entao, e se eu deixar o fundo tipo imovel, qdo for rolar a tela?

 

e sim, ainda quero dar uma estudada em css, agora q to começando nessa area de CSS...

[Thiago Retondar 18]

Nesse caso é mais fácil colocar um:

 

body{
background: black url(http://img297.imageshack.us/img297/9531/css.gif) repeat;
}

Porém essea imagem seria somente a textura.

[lucasvfa 0]

sei sei, fico otimo!

porem podia ter o degrade...mas isso depois dou um jeito.

 

agora ta vendo que no corpo do blog mesmo tem uma area de fundo que nao tem a textura?

se você der uma olhada no css do tema sabe me dizer qual arquivo tenho q editar pra textura ficar la tb?

[lucasvfa 0]

por exemplo, nesse site aqui, a imagem do topo eu poderia substituir pelo degrade e colocava a imagem da textura igual ta ai ne?

http://www.terrenaagro.com.br/index.home.agro

 

porem como faço isso?

[Thiago Retondar 18]

Então, cara, seu tópico está meio confuso. :blink: :blink: :blink:

 

Vá em um editor de imagens e fatie apenas a textura. No body você define a cor de plano de fundo e a imagem com repeat. Só isso. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[lucasvfa 0]

o f*** eh que nao to sabendo explicar...

NOSSA ACHEI UM EXEMPLO OTIMO!

olha esse site: http://www.festadopijama.com.br

ta vendo q tem uma textura no fundo certo?

e ai la em cima um degrade?

eu fui vendo o site abrir aqui e pude ver que a textura eh uma imagem, e o degrade apareceu depois.

eh mais ou menos isso que quero fazer...

so que com outra textura...

[Thiago Retondar 18]

Certo. Isso é um pouco mais complicado de se fazer, porém não impossível! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

No body você coloca a textura. E em uma <div> do topo você coloca o gradiente linear com PNG Transparente. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Iria ficar mais ou menos assim:

 

body{
background: url(textura.jpg) repeat;
}

div#topo{
width: auto;
height: alturaQueDeseja;
background: url(gradiente_linear.png) repeat-x top;
}

É basicamente isso. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[lucasvfa 0]

ai irmao fico assim:

 

background: url(http://img36.imageshack.us/img36/638/cssh.gif) repeat;
		div#topo{
		width: 300;
		height: 600;
		background: url(http://img36.imageshack.us/img36/6513/transpbg.png) repeat-x top;

--------------------

Posts mesclados!

--------------------

 

so que o degrade nao apareceeeeeeee!

[Thiago Retondar 18]

Você criou a div#topo? Como eu disse, é bom estudar XHTML e CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[lucasvfa 0]

shits!

nao criei essa div#topo!

eu vou dar uma fuçada com css sim, mas depois q eu resolver essa parada do blog, pq comprei o dominio e ja tem mais de mes q a gente nao posta nada pq o layout nao ta definido.

mas como faço pra criar a div#topo?

[Giovanni Sonnberger 0]

acredito que este codigo css ira resolver seu problema:

 

body {
background-color:#F6F8F5; - Cor de fundo da pagina
background-image:url(fundo.png); - link da img de fundo
background-repeat:repeat-x; - onde ele vai repetir o bg (pode ser repeat y o u no-repeat para nao repetir)
background-attachment: scroll; - com esse comando o bg vai rola junt com a pagina
background-position: top; - posição onde o bg vai se iniciar
}

^^ espero ter ajudado

[lucasvfa 0]

opa!

dando um up aqui!

olha so como esta: http://extraordinarios.blog.br/

corri atras de uns tutoriais...

 

agora estou com 2 pequenos problemas, o primeiro eh que a imagem de fundo do corpo do post eu queria q ela ficasse estatica...

nao sei, pq tipo qdo rola a tela desalinha e o degrade fica pra cima...

alguem ai sabe arrumar isso?

 

o outro eh essa barra branca q ta debaixo do banner, essa ai eu to trabalhando ainda...qm sabe eu consiga, mas toda ajuda eh bem vinda!

^^