Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • UBI 1213 TI Lab2

    Enviado por

    eva.pinto7796
    20 visualizações2 páginas
    u

    Título original

    UBI_1213_TI_Lab2

    Direitos autorais

    © © All Rights Reserved

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento
    u

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    20 visualizações2 páginas

    UBI 1213 TI Lab2

    Enviado por

    eva.pinto7796
    u

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 2

    UNIVERSIDADE DA BEIRA INTERIOR

    Faculdade de Engenharia | Departamento de Informtica


    Tecnologias de Internet
    Folha Prtica 2 : HTML> Hiperligaes, Ficheiros e Tabelas
    OBJECTIVO
    O objectivo desta ficha ensin-lo(a) a trabalhar com hiperligaes relativas e
    absolutas, e com tabelas.
    SUGESTO E PR-REQUISITOS
    1. Se ainda no terminou, faa primeiro a ficha 1.
    2. procure na Internet uma pgina que tenha hiperligaes e tabelas e usando a opo adequada no
    seu browser, tente ver o cdigo HTML que gera essa pgina.
    EXERCCIOS DA FICHA DE TRABALHO:
    Crie uma pasta com o nome Imagens no mesmo nvel do seu diretrio de ficheiros HTML.
    Descarregue o ficheiro ZIP que est na pgina da UC, descompacte-o e copie para a pasta Imagens,
    os ficheiros drink.ico e drinkbig.png e para a pasta de ficheiros HTML os ficheiros cup.ico e
    die.ico.
    1.

    Active a aplicao Notepad++ (ou outra equivalente do Linux) e escreva o seguinte cdigo
    fonte HTML.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16

    <html>
    <body>
    <p><img src="cup.ico" alt="Cup" align="left" width="16" height="16" />
    Pargrafo com imagem alinhada esquerda do texto.</p>
    <p><img src="cup.ico" alt="Cup" align="right" width="16" height="16" />
    Pargrafo com imagem alinhada direita do texto.</p>
    <p>Imagem com dimenso de 32x32 pixels</p>
    <img src="cup.ico" alt="Cup" width="32" height="32" />
    <p>Imagem com uma moldura</p>
    <img src="cup.ico" alt="Cup" border="1" />
    </body>
    </html>
    Crie um novo documento com o seguinte cdigo HTML

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14

    <html> <body>
    <p>Imagem com uma hiperligao para um ficheiro na pasta:
    <a href="nomeficheiro.html">
    <img border="0" src="cup.ico" width="30" height="30">
    </a> </p>
    <p>Inserir uma hiperligao para um ficheiro noutra pasta:
    <a href="../imagens/drinkbig.png">
    <img src="../imagens/drink.ico" width="30" height="30">
    </a> </p>
    <p>Imagem com hiperligao para a WWW:
    <a href="http://www.google.com">
    <img border="0" src="die.ico" width="30" height="30">
    </a> </p>
    </body> </html>

    2011/2012, 2012/2013

    Nuno Garcia | ngarcia@di.ubi.pt, Nuno Pombo | ngpombo@ubi.pt


    Filipe Quinaz | D1041@ubi.pt

    UNIVERSIDADE DA BEIRA INTERIOR


    Faculdade de Engenharia | Departamento de Informtica
    Tecnologias de Internet

    2.
    1
    2
    3
    4
    5
    6
    7
    8

    Referncias Absolutas e Relativas. Escreva o seguinte cdigo fonte HTML.


    <html> <body>
    <p>Inserir uma imagem:
    <img src="cup.ico" width="30" height="30"></p>
    <p>Inserir uma imagem de outra pasta:
    <img src="../imagens/drink.ico" width="30" height="30"></p>
    <p>Referncia absoluta a uma imagem:
    <img src="/imagens/drink.ico" width="30" height="30"></p>
    </body> </html>

    Exerccio: Escreva um ficheiro HTML que referencie de forma absoluta e de forma relativa dois ficheiros HTML
    efetuados na aula passada.

    3.
    1
    2
    3
    4
    5
    6
    7

    Tabelas. Escreva o seguinte cdigo fonte HTML.


    <html><body>
    <p>Aqui est uma tabela</p>
    <table border="1"><tr>
    <tr><td>Verde</td><td>Azul</td><td>Branco</td></tr>
    <tr><td>Amarelo</td><td>Branco</td><td></td></tr>
    </table>
    </body></html>

    4.
    1
    2
    3
    4
    5
    6
    7
    8
    9

    Tabelas dentro de tabelas. Escreva o seguinte cdigo fonte HTML.


    <html><body>
    <p>Aqui est uma tabela</p>
    <table border="1"><tr>
    <td><table border="1"><tr><td>Tecnologias</td></tr><tr><td>&nbsp;
    </td></tr></table></td>
    <td>Internet</td></tr>
    <tr><td>&nbsp;</td><td>&nbsp;</td></tr>
    </table>
    </body></html>

    5.
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10

    Tabelas complexas. Escreva o seguinte cdigo fonte HTML.


    <html><body>
    <p> Aqui est a tabela</p>
    <p> tem 3 linhas e 4 colunas</p>
    <table border="1" bgcolor="red">
    <tr><th>ttulo 1</th><th colspan="3">ttulo 2</th></tr>
    <tr> <td bgcolor="blue">texto 1</td > <td background="cup.ico" >
    </td><td>texto2</td><td>texto 3</td></tr>
    <tr><td align="left" >texto 4</td> <td align="right">texto 5 </td>
    <td>&nbsp&nbsp&nbsp texto 6 &nbsp&nbsp&nbsp&nbsp</td>
    <td></td></tr> </table></body></html>

    6.

    Reformule o HTML efetuado no exerccio 7 da aula passada de forma a incluir tabelas na


    indicao das dificuldades verificadas bem como na constituio da sua equipa preferida

    Bom trabalho!

    2011/2012, 2012/2013

    Nuno Garcia | ngarcia@di.ubi.pt, Nuno Pombo | ngpombo@ubi.pt


    Filipe Quinaz | D1041@ubi.pt

    Você também pode gostar