1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Ajuda em html/css

Discussão em 'Web Development' iniciada por Untouchable, 20 de Julho de 2008. (Respostas: 12; Visualizações: 920)

  1. Untouchable

    Untouchable Power Member

    Boas!
    eu e uns amigos meus, estamos a fazer umas experiências no frontpage pois temos intenção de criar um site básico só para uma pequena comunidade de pessoal conhecido...Posso estar a dizer a maior barbaridade do mundo (porque não estamos muito dentro do assunto) mas estamos a avançar pouco a pouco na exploração da linguagem html e css.

    no entanto surgiu uma duvida:
    temos uma imagem escolhida para background, mas devido ao facto de termos todos monitores e resoluções diferentes precisamos que este mesmo background esteja completamente visivel em todas as resoluções... há alguma maneira de corrigir isto?
    obrigado
     
  2. DSantosP

    DSantosP Folding Member

    Não sei se queres que o background ocupe a página toda em todos as resoluções, nisso já não te posso ajudar pq tb sou um novato nisso, mas se colocares a imagem com uma resolução de 800x600 toda a gente deve ver, não é usual apanhar pessoal com uma resolução abaixo dessa.
     
  3. Untouchable

    Untouchable Power Member

    Pois, acho que essa seria uma alternativa caso o que estamos a pensar fazer não seja possível..mas o que queria mesmo era isso que referiste no inicio: background a ocupar a janela toda em qualquer resolução, mas penso que não seja possível.
    Alguem com conhecimento na matéria que me possa esclarecer? obg
     
  4. DSantosP

    DSantosP Folding Member

    Como já disse sou novato nisto :P

    Mas encontrei este código:

    Experimentei e funciona, podes acrescentar mais resoluções.
    Espero que tenha ajudado visto que tb não entendo muito disto, atenção que não foi eu que fiz o código ;).
     
  5. filipe3x

    filipe3x Power Member

    Eu por acaso tinha uma duvida semelhante...

    Cliquem no site da google, vejam akela barra aonde diz WEB IMAGENS NOTICIAS... etc...

    e logo abaixo desses links tem uma fina linha azul claro que se prolonga na página. Qualquer que seja o tamanha que a janela tenha, essa linha ocupa a página toda...

    A minha pergunta era.. como é que faço para pegar numa linha ou imagem e prolonga-la até ao "infinito"? qualquer que seja a resoluçao a imagem repetir-se-ia e ocuparia a totalidade da página... era essa a minha ideia...
     
  6. Acho interessante o codigo atras.No entanto se quizeres num ápice qualquer resolução e que n esteja nas resoluções indicadas, faz o seguinte:

    <HTML>
    ...
    <BODY>
    <script>
    altura=windows.screen.height();
    //não me recordo se deves por "()"..verfiica isso
    largura=windows.screen.width();
    imagem='URLparaAimagem.jpg" // ex: http:// sapo.pt/background.jpg
    </script>

    <table width=100% height=100%> <tr><td>

    <script>
    document.write('<img src=' + imagem + 'width='+ largura +'height='+altura +'>')
    </script>


    </tr><td></table>

    </script>

    ..
    ..
    <DIV style="position:absolute; left:0; top:0; height:100%; width:100%">
    //Aqui continuas com o teu codigo que está entre os tags <BODY></BODY>
    <DIV>
     
    Última edição: 20 de Julho de 2008

  7. precisamente atraves do atributo " width".

    <img src="linha.jpg" width=100%>
     
  8. A mim parece-me que a melhor solução é a apresentada pelo DSantosP, uma função que verifica qual o valor e depois com o case, atribui a imagem com a resolução mais adequada...
     
  9. filipe3x

    filipe3x Power Member


    é isso!!!!!:009:

    Experimentei e deu! Obrigado pela ajuda!
     
  10. DSantosP

    DSantosP Folding Member

    Não é possível fazer isso com a tag <hr> e depois mudar-lhe a cor com CSS?
    Mas neste caso essa opção é muito mais simples :P
     
  11. MPalhas

    MPalhas Power Member

    para essas pequenas linhas com largura infinita, até bastam imagens com 1 px de largura, porque a imagem é apenas esticada e como é sempre a mesma cor, não há distorção
    é um bocado como o HR sim, mas com esse tens menos liberdade do que com a imagem, porque estás limitado a apenas uma cor

    para imagens de fundo é que é mais complicado.

    já foram aqui postadas maneiras de o fazer, e funcionam, mas a quem se lembrou do método do Switch, porque é que não se lembrou deste que é muito mais simples e faz a mesma coisa:

    Código:
    <head>
    <script type="text/javascript">
    function changeBG() {
        document.body.style.backgroundImage= "url(http://URL_DA_IMAGEM/" + screen.width + ".jpg)";
    }
    </script>
    </head>
    
    <body onLoad="changeBG()">
    TEXTO
    </body>
    
     
  12. Kayvlim

    Kayvlim Undefined Moderator
    Staff Member

    Podes mudar a cor do <hr> por CSS

    Quanto a essa forma, o switch pode ser melhor num aspecto: para resoluções mais maradas, pode haver um default, enquanto que apenas dessa forma arriscas-te a que ele vá procurar ficheiros no servidor que não existam. Pelo menos uma verificação pelas resoluções normais (e uma imagem "default" ao ver que não reconhece a resolução actual OU uma imagem com a resolução imediatamente menor à actual) deve haver.

    Porque não pôr uma div no fundo e esticar/reduzir a imagem por CSS? Width = 100%
     
    Última edição: 20 de Julho de 2008
  13. Este problema de dimensionamento de imagens "á medida" para qualquer resolução´
    foi e será um eterno bicho de sete cabeças!!
    Não existe técnica perfeita para ter uma redimensionamento perfeito para qualquer resolução..
    é o que acho..
    Melhor mesmo é inves de usar HTML, e preferir um site com tecnologia Flash
    Para isso, especificar no ficheiro HTML, o parametro do objecto SWF,
    de forma a ajustar automáticamente em largura e altura a imagem, sem afectar da sua qualidade :)
     

Partilhar esta Página