Tamanho da página

[veaoum 2]

Boas lá começo eu com duvidas provavelmente básicas. Estou a tentar criar o meu primeiro site estou a faze-lo para a medida 1025*770 mas queria que ele depois ampliasse ou reduzisse para ficar na página toda do browser. É possível?

[yoda 138]

O que procuras chama-se fluid layout / fluid design

Existe muita informação sobre o assunto no google, um exemplo : http://www.netmagazine.com/tutorials/create-fluid-layouts-html5-and-css3

[NunoDinis 40]

Trabalha as medidas em percentagem...

[veaoum 2]

Ok eu trabalho em perecentagem, mas se trabalhar em percentagem isto não deforma as imagens?

[NunoDinis 40]

Vai depender muito da qualidade e do tamanho delas. Estou a desenvolver um software e não ficam deformadas.

[veaoum 2]

então existe uma tag para fazer o que em visual basic se chama stretch?

[NunoDinis 40]

Que eu conheça, não.

Mas é como te digo, defines uma percentagem à tag <img>, e automaticamente será reajustado a todos os monitores.

[veaoum 2]

ok. Eu estava a pensar em defenir mesmo como background. pelo que dizes deve faze-lo aparte, certo?

[veaoum 2]

Já agora como fazes isso? É que oi que tentei agora desregula-me tudo, ou seja a imagem sai da div.....

[NunoDinis 40]

Queres definir uma imagem como background ? Põe 100% x 100% e vai-te ajustar a todos os monitores, quer sejam grandes, médios ou pequenos

p.s: Certifica-te que a imagem tem qualidade suficiente.

[veaoum 2]

não background do site todo, background de uma div.

[NunoDinis 40]

É o mesmo processo. Se pretendes que te ocupe toda a div pões 100x100. Caso querias só 10 ou 20 % dessa div pões o valor correspondente...

[veaoum 2]

Será que me podes dar um exmplo? eu estou a tentar fazer:

<div style="position:absolute; top:0 px; left:0 px; width:100%; height:38%; background-image: url(imagem/cabecalho.jpg; height:100%; width:100% ); background-repeat:no-repeat;">

mas não funciona

[NunoDinis 40]

Posso.

<div style="background-image: url('imagem/cabecalho.jpg'); height: 80%; width: 14%;">
</div>

Editado 24 de Dezembro de 2012 por NunoDinis

[veaoum 2]

Se fizer isso fica igual ou melhor dá-me apenas a percentagem da imagem, Acho que não me estou a explicar bem vou dar um exemplo. Defino uma imagem que tenho 100px*100px e quiser colocar numa div com 200px*100px Ela vai aparecer duas vezes e não vai ampliar.

[NunoDinis 40]

background-repeat: no-repeat;

Editado 24 de Dezembro de 2012 por NunoDinis

[yoda 138]

As imagens de fundo dos elementos não aumentam nem encolhem, no máximo consegues repetir na vertical, horizontal ou ambos a mesma imagem.

[veaoum 2]

Asolução então seria criar uma imagem suficientemente grande para ocupar a janela toda independentemente do tamanho. Certo?

[yoda 138]

Não. A solução é arranjar uma imagem que dê para repetir ou posicionar.

[veaoum 2]

Mas uma imagem com gradiante é complicado repetir.

[HappyHippyHippo 1185]

Mas uma imagem com gradiante é complicado repetir.

nem por isso ... ima imagem de gradiente não é complicado repetir.

mas o mais leve seria usar os gradientes em CSS

http://webdesignerwall.com/tutorials/cross-browser-css-gradient