Script para auto ajustar a pagina de acordo com a resolução
- Autor do tópico _M4st1c_
- Data Início
Está na secção correcta
Não podes usar apenas CSS para "ajustar" a página? Usando percentagens, como 75% para uma tabela, faz com que as coisas tenham um tamanho relativo, e aparece igualmente bem em ambas as resoluções.
Explica-te melhor, que não percebo muito disto.
cumps
Ele estava só a explicar.
Em vez de uma tabela ocupar exactamente 600px numa resolução 800x600 e exactamente 960px numa resolução 1280x1024, podes fazer com que essa tabela ocupe exactamente 75% (800 * 75/100 = 600, e 1280 * 75/100 = 960), e qualquer que seja a resolução, ela terá o mesmo tamanho relativo.
Uma medida em percentagem não é uma medida exacta. 10% de 200 é 20, mas 10% de 5000 é 500. 25% de 500 é 125 e 25% de 2000 é 500.
Queres que a página seja dimensionada conforme a resolução, certo? Então, como exemplo, troca onde diz <body> por <body><div style="width: 75%; background-color: #AAAAAA"> e onde diz </body> por </div></body>.
Em vez de uma tabela ocupar exactamente 600px numa resolução 800x600 e exactamente 960px numa resolução 1280x1024, podes fazer com que essa tabela ocupe exactamente 75% (800 * 75/100 = 600, e 1280 * 75/100 = 960), e qualquer que seja a resolução, ela terá o mesmo tamanho relativo.
Uma medida em percentagem não é uma medida exacta. 10% de 200 é 20, mas 10% de 5000 é 500. 25% de 500 é 125 e 25% de 2000 é 500.
Queres que a página seja dimensionada conforme a resolução, certo? Então, como exemplo, troca onde diz <body> por <body><div style="width: 75%; background-color: #AAAAAA"> e onde diz </body> por </div></body>.
Última edição:
Pois, se a imagem tem de dimensões 1200x700, fica cortada horizontalmente em 1024x768.
Nesse caso a percentagem não se aplica. O que te aconselho a fazer é redimensionares a imagem para 1080x630 (90% do tamanho original), nem que seja no paint. Assim, aparece inteira nas duas resoluções.
Depois muda o nome da imagem para "On_the_Radio_by_anemptyhouse-1080x630.jpg", só mesmo para fazer sentido, e muda o código do teu <body> para
Nesse caso a percentagem não se aplica. O que te aconselho a fazer é redimensionares a imagem para 1080x630 (90% do tamanho original), nem que seja no paint. Assim, aparece inteira nas duas resoluções.
Depois muda o nome da imagem para "On_the_Radio_by_anemptyhouse-1080x630.jpg", só mesmo para fazer sentido, e muda o código do teu <body> para
Código:
<body style="background: url('On_the_Radio_by_anemptyhouse-1080x630.jpg') no-repeat fixed center;">assim fica mal no meu monitor, porque fica tipo duas colunas de cada lado brancas, não há maneira de resolver isso?
cumps
Dá uma vista de olhos nisto: http://webdesign.about.com/od/css3/f/blfaqbgsize.htm
hYpe
Portugal@Home Member
assim fica mal no meu monitor, porque fica tipo duas colunas de cada lado brancas, não há maneira de resolver isso?
cumps
Tendo em conta que existem dezenas de resoluções diferentes, acho que a solução para o teu caso, passa por teres uma imagem relativamente grande (ajustada p.e. para 1024*768), e colocares uma cor sólida como fundo...
Um preto, branco, laranja, azul, seja o que for que combine com a tua imagem.
Assim, e seguindo as instruções que o Kayvlim deu:
PHP:
<body style="background: #FFFFFF url('On_the_Radio_by_anemptyhouse-1080x630.jpg') no-repeat fixed center;">Onde #FFFFFF é precisamante o código da cor de fundo que queres.
penso que querias dizer "1 px de largura", assim é que se adequava melhor, pois a imagem repetia-se horizontalmente, e passava a ficar independente da largura da janela.
isso seria o aconselhável, mas como podes ver pelo post anterior dele, não dá para fazer isso com aquela imagem. só daria com fundos mais simples
Não sei se é bem isto que queres, mas podes experimentar...
http://www.sharefile.org/showfile-236/teste.zip
http://www.sharefile.org/showfile-236/teste.zip
para aquelas duas resolucoes que referi anteriormente funciona na perfeição, mas agora puz na resolução 1280x1024 , fica uma barra horizontal em baixo, um pouco grossa, mais ou menos 5cm, consegues arranjar?
cumps
