Aldeia RPG

Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.

Suporte ao desenvolvimento de jogos


    Curso de HTML - Aula 6 - Frames

    Lief
    Lief
    Desenvolvedor
    Desenvolvedor


    Mensagens : 833
    Créditos : 50

    Curso de HTML - Aula 6 - Frames Empty Curso de HTML - Aula 6 - Frames

    Mensagem por Lief Ter Dez 25, 2012 8:16 pm

    [Autor: Gleison]
    Curso de HTML - Aula 6 - Frames Aulcj0




    O que são paginas frames?

    O conceito de paginas frames é antigo, no inicio a ideia era dar mais interatividade na página, entretanto
    não havia muito suporte por parte dos navegadores, porem quando ele ganhou suporte começou a
    surgir a Web 2.0 que trazia uma maior interatividade fazendo com que os frames entrassem em desuso.
    Todos nós estamos acostumados com frames, entretanto muitos nem sabem. Ao alternar entre uma
    anela da configuração de vídeo do seu sistema operacional, você está alternando entre frames.
    Pois bem o conceito é esse uma pagina frame e apenas uma moldura que chama outras paginas, sendo
    assim na pagina do frame não existe conteúdo.




    Usando frames
    Para criarmos uma pagina com frame usamos o tag logo após o tag , ele
    deve vir acompanhado do atributo rows ou cols que este fará a identificação de qual será a posição das
    divisórias.

    Crie um novo documento com o nome ex5.html e digite os codigos necessários para a pagina ate o tag <
    head>.
    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">



    Agora vamos inserir os tags de referencia para o frame, acrescente o seguinte código cols="20,80">



    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">






    Salve seu arquivo e abra-o no navegador, veja que temos uma pagina dividida em duas partes onde na
    esquerda está aberta a página ex4.html e na direita a página ex3.html.
    Vejamos o que acabamos de fazer, quando foi definido o atributo cols, nos definimos que seria uma
    pagina com divisões verticais e os valores 20 e 80 como o tamanho para cada lado da divisão, sendo que
    se quiséssemos mais uma divisão bastaria acrescentar mais um valor.
    O atributo name foi colocado para a orientação de links, que será aprendido mais para a frente.
    O que definiu onde cada pagina seria aberta neste caso, foi a ordem na qual foram citadas.

    Agora vamos inserir os tags de referencia para o frame, modifique o código no lugar de cols coloque
    rows, e no lugar de esquerdo e direito coloque acima e abaixo, e salve o documento e o atualize no
    navegador.

    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">

    rows="20,*">
    acima”>
    abaixo”>






    Criando frames relativos.
    Outro recurso que pode ser usado em frames é criar frames relativos.
    Volte ao ex5.html e modifique o código: onde está 80 coloque *.
    Salve o documento e atualize no navegador.
    Salve o documento e atualize no navegador.
    o seu codigo deve estar parecido com o abaixo.


    </font>Exercício 5<font color="blue">

    rows="20,*">
    acima”>
    abaixo”>



    O que fizemos agora é dizer para o navegador que o primeiro frame deve ter 20 pixels e
    ocupar o restante do espaço na pagina.

    Volte ao ex5.html e modifique o código: onde está 20 coloque 40%.

    Salve o documento e atualize no navegador.

    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">

    rows="40%,*">
    acima”>
    abaixo”>

    O que fizemos agora é dizer para o navegador que o primeiro frame deve ter 40% da pagina e o segundo

    O que fizemos agora é dizer para o navegador que o primeiro frame deve ter 40% da pagina e o segundo
    deve ocupar o restante do espaço na pagina.

    Volte ao ex5.html e modifique o código: onde está * coloque 60%.
    Salve o documento e atualize no navegador.

    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">





    O que fizemos agora é dizer para o navegador que o primeiro frame deve ter 40% da pagina e o segundo
    deve ocupar 60% do espaço na pagina.




    Permitindo ou não bordas e scroll e redimensionamento.
    Com frames também podemos definir se as bordas aparecerão e se serão redimensionáveis e se poder
    ser usado scroll.
    Para isso usamos os atributos border, frameborder, noresize, scrolling.




    Inserindo bordas.
    Volte ao ex5.html e adcione o seguinte código a linha frameset: frameborder=”Yes” border=”3”
    Salve o documento e atualize no navegador. Veja que agora é exibido uma borda entre as duas páginas
    deve ocupar o restante do espaço na pagina.

    que elas tem a largura de 3 pixels.

    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">






    O que fizemos agora é dizer para o navegador que o recurso de bordas deve estar ativado (opção
    frameborder com o valor “Yes” permite bordas, já com o valor “no” elas não aparecerão)e que a borda
    deve ter a espessura de 3 pixels.

    bloqueando o redimensionamento e o scrolling.

    Volte ao ex5.html e adcione o seguinte código na primeira linha frame src: noresize=”noresize”
    scrolling=”yes”
    Salve o documento e atualize no navegador. Veja que agora é exibido uma borda entre as duas páginas e
    que elas tem a largura de 3 pixels.

    o seu codigo deve estar parecido com o abaixo.



    </font>Exercício 5<font color="blue">


    noresize=”noresize” scrolling=”yes”>




    O que fizemos agora é dizer para o navegador que o recurso de redimensionamento deve estar
    desativado (opção noresize com o valor “noresize” permite redimensionamento, para permitir o
    redimensionamento e só não adcionar o noresize )e que o recurso de scrolling deve estar ativado(opção
    scrolling com o valor “yes” permite scrolling, para não permitir o scrolling e só usar o valor “no”).



    Inserindo texto para navegadores sem suporte a frames.
    O recurso de frames permite que sejam criadas paginas dentro da estrutura do frames afim de que sejam
    exibidas caso o navegador não ofereça suporte, para isso usamos o tag </font> antes do tag <font color="green"><body></font><br />Faça as modificações afim de que seu documento esteje como o abaixo.<br /><br />o seu codigo deve estar parecido com o abaixo.<br /> <br /><font color="blue"><HTML> <br /><head> <br /><title></font>Exercício 5<font color="blue"></title> <br /></head><br /><frameset rows="40%,60%" frameborder=”Yes” border=”3”><br /><frame src=”ex4.html” name=”acima” noresize=”noresize” scrolling=”yes”><br /><frame src=”ex3.html” name=”abaixo”><br /><strong><body><noframes></font>[b]Esta pagina usa o recurso de frames, porém seu navegador não suporta este recurso.<BR><br />Aconselhamos que atualizasse seu navegador por uma versão mais recente.<br /><font color="blue"><br />

    O que fizemos agora é inserir uma mensagem que será mostrada em um navegador que não ofereça o
    suporte a frames, lembrando que neste ponto você pode criar uma pagina completa.




    Exercício
    Crie uma pagina:
    Nome:exepratico3.html
    Titulo:Exercicio Pratico 3
    Texto Centralizado: Aulas de HTML
    Pule uma linha
    Texto Restante: Crie uma página usando todos os recursos até aqui apresentados.
    Crie uma pagina:
    Nome:exepratico4.html
    Titulo:Exercicio Pratico 4
    Texto Centralizado: Aulas de HTML
    Pule uma linha
    Texto Restante: Crie uma página usando todos os recursos até aqui apresentados.
    Crie uma pagina frame:
    Nome:exepratico5.html
    Titulo:Exercicio Pratico 5
    Divisão: 2 divisões verticais (uma com nome esquerda e a outra como direito)
    Divisão esquerda: Nesta pagina deve aparecer o exepratico3.html
    Divisão direito: Nesta pagina deve aparecer o exepratico4.html




    Perdeu alguma aula?, Quer saber qual é a proxima? Visite o Indice
    Clique aqui

    Clique aqui para visitar o site oficial


    _________________
    A cidade tem medo de mim. Eu vi sua verdadeira face. As ruas são sarjetas dilatadas cheias de sangue e, quando os bueiros transbordarem, todos os vermes vão se afogar. A imundice de todo sexo e matanças vai espumar até a cintura e as putas e os políticos vão olhar para cima gritando "salve-nos"... e eu vou olhar para baixo e dizer "não".

      Data/hora atual: Qui Mar 28, 2024 4:22 pm