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

duvida em layout

Discussão em 'Web Development' iniciada por Acelarado, 20 de Maio de 2006. (Respostas: 7; Visualizações: 3500)

  1. Acelarado

    Acelarado Power Member

    boas,

    a minha duvida é a seguinte, como consigo criar algo do genero como isto: http://e107.org/news.php

    refiro-me a a parte do layout, tipo posso aumentar ou diminuir o tamanho da janela que o banner por exemplo ajusta-se automaticamente.

    eu não sei por que termos procurar no google em msm explicar-me bem... :(
    se alguem me indicar uns tutorials ou dar umas dicas...
    eu uso divs e css para trabalhar, agora ando a tentar fazer algo do genero como aquilo mas n estou msm a conseguir.
     
  2. keoshi

    keoshi Power Member

    Hey!

    Não sei se já deste uma vista de olhos pelo código mas é simples.

    Ele tem um div "header" com um "headerr" lá dentro:

    Código:
    <div id="header">(...)<div id="headerr">&nbsp;</div></div>
    
    O '&nbsp;' é um caracter para aparecer um espaço, para ter a certeza que o div contém alguma coisa.

    No 'header' tem uma imagem a repetir-se no eixo dos x e no 'headerr' tem este fim de header.

    O truque aqui é colocar o div 'headerr' (neste caso) dentro do outro e dar-lhe um posicionamento absoluto, o que permite que definas onde ele se coloca - neste caso a 10px do topo e também a 10px da direita.

    Em CSS isto seria:
    Código:
    [FONT=monospace]
    [/FONT]position: absolute;
    top:10px;
    right:10px;
    
     
  3. Acelarado

    Acelarado Power Member

    eu vi codigo da pagina e tenho uma div dentro da outra tb
    o problema deve ser que n tenho em absolute

    bem vou tentar a se consigo alguma cena

    obrigado :)
     
  4. keoshi

    keoshi Power Member

    Tens mesmo que ter em absolute, os valores de posicionamento bem e vê tens o tal espaço = '&nbsp'
    ;)
     
  5. Acelarado

    Acelarado Power Member

    <div id="banner"><div id="end">&nbsp;</div></div>



    #banner {
    height: 130px;
    background-repeat: no-repeat;
    background-image: url(../images/index_01.jpg);
    }

    #end {
    background-image: url(../images/index_03.jpg);
    position: absolute;
    }


    não me esta dar o fim desaparece, fica no prencipio mas nem aparece...
    e depois eu tenho que ter algo a repetir uma parte da imagem n?
     
  6. keoshi

    keoshi Power Member

    Era mais fácil se desse para dar uma olhadela na página, mas pelo que estou a ver faltam aí os valores do posicionamento do #end.

    top e right, se for como o caso que mostraste.
     
  7. Acelarado

    Acelarado Power Member

    ok ja percebi e ja esta a funcionar

    codigo html:
    codigo css:
    obrigado pela ajuda ;)
     
  8. keoshi

    keoshi Power Member

Partilhar esta Página