Tamanho da página

[veaoum]

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]

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]

Trabalha as medidas em percentagem...

[veaoum]

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

[NunoDinis]

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

[veaoum]

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

[NunoDinis]

Que eu conheça, não.

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

[veaoum]

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

[veaoum]

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

[NunoDinis]

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]

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

[NunoDinis]

É 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]

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]

Posso.

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

Edited December 24, 2012 at 04:27 PM by NunoDinis

[veaoum]

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]

background-repeat: no-repeat;

Edited December 24, 2012 at 05:23 PM by NunoDinis

[yoda]

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]

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

[yoda]

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

[veaoum]

Mas uma imagem com gradiante é complicado repetir.