HTML HyperText Markup Language

HTMLHyperText Markup Language

Funcionalidades do HTML:

• Alterar o aspecto físico do texto

• Indicar que certa parte do texto é um endereço de outra home page (hyperlink)

• Inserir figuras, sons

• Criar tabelas, formulários, frames.

O browser ao acessar um programa procura pelos comandos HTML denominados tags ou etiquetas.

As tags são reconhecidas pelos sinais “<>” para iniciar o comando e “</>” para finalizar o comando.

Ex.:

<nome da tag> Texto marcado pela Tag </nome da tag>

<p> Texto marcado </p>

Estrutura de um documento HTML

A estrutura de um documento HTML apresenta os seguintes componentes:

<html>

<head>

<title> Título da página Web

</title>

</head>

<body> Corpo da página que será exibida para o usuário (dados e tags)

</body>

</html>

As tags HTML não são sensíveis a maiúscula-minúscula, mas recomenda-se escrevê-las em letras minúsculas.

Várias tags são complementadas com parâmetros, cujos valores deverão vir entre “” (aspas).

Ex.:

<tag parâmetro=“valor”> Texto marcado </tag>

<font size=“2” face=“verdana, arial”> Texto </font>

Caracteres especiais e acentos:

Devem ser digitados através de caracteres especiais

Ex.:

café = café

maçã = maçã

referência = referência

aà = à

Formatação de Fonte

Interfere no aspecto visual do texto.Tags:

<h1> Título </h1)

<font> possui parâmetros para determinar tamanho, tipo e cor

da fonte </font>

<b> negrito </b>

<i> it´lico </i>

<marquee> texto animado </marquee>

Listas ordenadas e não ordenadas

<ol> <li> item da lista ordenada </li></ol> Resultado: 1. item da lista ordenada

<ul> <li> item da lista não ordenada </li></ul>

Resultado: item da lista não ordenada

Links

Permite uma ligação:

entre páginas Web;

entre URLs (outros sites);

dentro da própria página.

Ligações entre páginas Web

<a href="hist.html"> Aspectos Históricos da Internet</a>

Especificar o nome do arquivo a ser aberto.

Ligações entre URLs

<a href=“http://www.mackenzie.br"> Link para o site do Mackenzie</a>

Especificar a URL.

Ligações dentro da própria página

<a href="#ens_sup"> Ensino Superior</a>

…

(depois de muito código)

…

<a name="ens_sup“>

Ensino Superior</a>

Outra informação importante para as ligações hipertextuais é dizer onde a página deverá ser aberta

Ex.:

<a href="http://www.mackenzie.br" target = "_blank"> Link para o site do Mackenzie a ser aberto numa nova página.</a>

Frames e Iframes

Permite dividir a janela do browser em vários frames (quadros ou molduras), tornando possível visualizar mais de um arquivo HTML na tela ao mesmo tempo. A disposição de páginas em frames pode dificultar a navegação e gerar problemas para a impressão. A alternativa natural para os frames são as tabelas.

Exemplo:

Formulários

Permite ao usuário enviar informações por meio da página, em forma de pesquisa, mala direta, compra eletrônica e outros.O formulário depende de outros programas no servidor, para receber e processar os dados que serão enviados.Para criar um formulário é preciso definir seu objetivo, elaborar os dados a serem incluídos e como serão apresentados.Todo formulário deverá iniciar e terminar com as tags <FORM> ... </FORM>.

Exemplo

Tabelas

Permite organizar as informações de maneira padronizada. Pode ser inseridos textos, imagens, links e até tabelas, e ainda incluir bordas e definir mais de uma coluna.

Uma tabela é formada por um conjunto de linhas e colunas, e o encontro de uma linha e coluna é denominado célula.

Exemplo:

HTML HyperText Markup Language

Documents

Transcript of HTML HyperText Markup Language