Olá pessoal 
Alguém sabe se é possível deixar o background de uma página web em x[color=red]a[/color]d[color=red]r[/color]e[color=red]z[/color] :?: Sem utilizar imagem, só com css.
Desde já agradeço pela atenção.
eu acho que não tem como
qual o problema de usar imagem?
Olá heatcold
Que pena. Estou procurando e tbm não achei um jeito ainda.
[list]Pq gostaria de mudar o layout dinamicamente, para quaisquer cores que o usuário escolher.[/list]
[list]Com imagem pode ficar pesado, mesmo usando background-repeat.[/list]
[list]É possível fazer layout avançado com css, que pensei que algo mais simples seria fácil.[/list]
Obrigado pela atenção heatcold.
flw :thumbup:
Mais alguém :?:
Pela última vez.
Mais alguém 
:?:
Diretamente na tag body creio que não, mas usando uma tabela você pode usar os atributos even e odd da CSS 3:
<style type="text/css">
td:odd{background: #CCC}
td:even{background: #FFF}
</style>Pesquise um pouco mais a respeito pra saber se existe em outras tags: http://www.internetbootcamp.net/007/evenodd.html
Esperto ter ajudado
Muito obrigado pela dica spidermanx
vou pesquisar mais sobre o assunto…
…inicialmente não deu certo…
devido ser uma tabela, assim não posso posicionar minhas divs 
Mesmo assim obrigado, pela atenção.
Bem, nesse caso se você está usando conceito “tableless”, será que o CSS não entende isso:
<style type="text/css">
div:odd{background: #CCC}
div:even{background: #FFF}
</style>Faz os testes ae e posta o resultado pra gente ficar sabendo.
Agora quanto a “zebrar” o background do body na raça, realmente pesquisei um pouco e não encontrei nada.
Sim, é exatamente isto
Infelizmente 
não está entendendo. Usei na própria página HTML e no StyleSheet…
É eu já pesquisei bastante (e já tem um bom tempo) e também ainda não achei nada…
Achava que seria uma coisa fácil, como já mencionei:
Mas tudo bem, vou continuar pesquisando…
Sim, com certeza. Se eu achar a solução vou fazer questão de postar.
Mais um vez, muito obrigado pelas dicas e pela atenção spidermanx
Skenta a cabeça não meu chapa, tamo aqui pra resolver as treta que aparece, é pra isso que esse fórum serve 8)
E na programação a gente tem que usar a filosofia do João Canabrava: “O meu pobrema é seu pobrema!”, kkkkkkkkkkkkk
Eu também vou brincando uns testes aqui, pois achei bem interessante esse quebra-cabeça, qualquer possível solução eu posto beleza?
abrax.
[quote=spidermanx]Skenta a cabeça não meu chapa, tamo aqui pra resolver as treta que aparece, é pra isso que esse fórum serve 8)
E na programação a gente tem que usar a filosofia do João Canabrava: “O meu pobrema é seu pobrema!”, kkkkkkkkkkkkk
Eu também vou brincando uns testes aqui, pois achei bem interessante esse quebra-cabeça, qualquer possível solução eu posto beleza?
abrax.[/quote]
:lol: É isso ai, mais cedo ou mais tarde vamos achar uma solução, o importante é não desistir.
E por falar em fazer alguns testes, fiz um programinha muito do bobo aqui só pra ver o comportamento das div’s e deu certo:
<html>
<head>
<style type="text/css">
div:nth-child(odd){background: #CCC;}
div:nth-child(even){background: #EEE;}
div{float: left; height: 100%}
</style>
</head>
<body>
<div>Coluna 1</div>
<div>Coluna 2</div>
<div>Coluna 3</div>
</body>
</html>O que estava faltando para ele achar as divs é o seletor padrão “nth-child”:
div:nth-child(odd)...
div:nth-child(even)...Faz um copi/cola ae e vê no que dá, outra coisa importante, testei no IE 9 e infelizemente não funcionou, porém no Firefox 10 e Chrome 17 e uns quebrados funcionou lindo, bunitu! kkkkkkkkkk, creio que para o IE deve ter alguma solução, mas ai deixo contigo, deixa eu ir que a Mary Jane tá me chamando, rsrsrs.
Realmente não funciona no IE. caso seu cliente seja “dependente” dele, fica bem complicado arrumar solução.
[quote=spidermanx]E por falar em fazer alguns testes, fiz um programinha muito do bobo aqui só pra ver o comportamento das div’s e deu certo:
<html>
<head>
<style type="text/css">
div:nth-child(odd){background: #CCC;}
div:nth-child(even){background: #EEE;}
div{float: left; height: 100%}
</style>
</head>
<body>
<div>Coluna 1</div>
<div>Coluna 2</div>
<div>Coluna 3</div>
</body>
</html>O que estava faltando para ele achar as divs é o seletor padrão “nth-child”:
div:nth-child(odd)...
div:nth-child(even)...Faz um copi/cola ae e vê no que dá…[/quote]
Funciona é bem por ai mesmo…
Complementando seu teste, mudei de div para body, pois ambos são tags e podem receber regras CSS,
só que não faz este zebrado, porque pelo que tenho visto precisa de mais de um componente, e boby é apenas um…
Mesmo assim já estamos avançando. Vou fazer uns teste aqui agora com body background repeat e estrutura de repetição com javascript, para ver se com um único componente (body) funciona, porque assim posso posicionar as demais divs do site livremente…
Não tem problema. Não é para cliente, é para aprendizado mesmo.
Também sou fã do homem aranha…
Engraçado é quando um professor (meu antigo professor) de Java e fã do homem aranha diz uma frase assim na sala de aula:
“Eu vou ensina para vocês a parte visual de Java. Mas lembre-se, com grandes poderes vêm grandes responsabilidades”
:lol: :lol: :lol:
[quote=Schuenemann]Por que não usa tabela?
http://srinivasang87.blogspot.com.br/2008/11/jquery-chess-board.html[/quote]
Obrigado pela ideia
Mas, o problema é que quero fazer que este tabuleiro de xadrez seja o background de minha página Porém, tudo isto pode ser resolvido se eu usar uma imagem (como somente um quadrado branco e outro preto e usar background repeat no corpo da página), acho que vou fazer isto mesmo, estava tentando fazer sem imagens de fundo (basicamente) à toa, só espero que está funcionalidade (de fazer sem imagem) venha em alguma versão futura do HTML.
:thumbup:
Você não está fazendo um jogo de xadrez? Acho que faz todo o sentido o tabuleiro ser uma tabela.
Se quiser, pode tentar gerar uma imagem em tempo de execução e colocá-la como plano de fundo: http://www.codeproject.com/Articles/221941/HTMLImage-Generating-Dynamic-Image-using-Plain-Jav
Daí pode definir as cores. Talvez alguma biblioteca simplifique o que o cara fez naquele post.
Mas eu usaria uma tabela.
Não. Eu estou fazendo um site que tem conteúdos sobre jogo de xadrez (e não um jogo).
Por exemplo, o background color do body do GUJ é um azul claro, algo do tipo:
<BODY BGCOLOR=#C0D9D9>
</BODY>
Eu queria fazer isto (para alternar entre as cores preto e branco):
<BODY BGCOLOR=#FFFFFF; #000000>
</BODY>
[quote=Schuenemann]Se quiser, pode tentar gerar uma imagem em tempo de execução e colocá-la como plano de fundo: http://www.codeproject.com/Articles/221941/HTMLImage-Generating-Dynamic-Image-using-Plain-Jav
Daí pode definir as cores. Talvez alguma biblioteca simplifique o que o cara fez naquele post.[/quote]
Obrigado pelo link, vou verificar e depois posto o resultado.
P.S.: Em anexo tem uma imagem para você entender o que eu quero fazer.
:thumbup:
body {
background-image:
-moz-linear-gradient(45deg, #000 25%, transparent 25%,transparent 75%, #000 75%, #000 100%),
-moz-linear-gradient(45deg, #000 25%, transparent 25%,transparent 75%, #000 75%, #000 100%);
background-image:
-webkit-linear-gradient(45deg, #000 25%, transparent 25%,transparent 75%, #000 75%, #000 100%),
-webkit-linear-gradient(45deg, #000 25%, transparent 25%,transparent 75%, #000 75%, #000 100%);
-moz-background-size:100px 100px;
background-size:100px 100px;
-webkit-background-size:101px 101px;
background-position:0 0, 50px 50px;
}Achei esse código acho que no stackOverFlow. Se quiser pode testar aqui:
http://www.w3schools.com/css/tryit.asp?filename=trycss_background-color_body
Agora só ver com alguém que entenda de CSS para arrumar conforme você quer.
Eu vi isso a alguns meses, estudando HTML5 com uso de CSS3
Como o colega mostrou acima, usamos funções do navegador, e existe até mesmo alguns javascript que permite usar os efeitos em navegadores antigos.
Veja se este link pode ajuda-lo:
http://lea.verou.me/2010/12/checkered-stripes-other-background-patterns-with-css3-gradients/