HTML e Tags

Aula: 06 Data 8/12/2012
:

Professor:

Washington
Silva
Turma:

Sumário
 O que é HTML
 O que são TAGS

 Visualizando o documento em HTML

 Principais TAGS

 Formatação

Instrutor: Washington Silva

O QUE É HTML?
 HTML – é uma linguagem de marcação de
hipertexto.
 H - Hyper

 T – Text

 M - Markup

 L – Language


 HTML pode ser feito em qualquer editor de
texto, até mesmo o simples Bloco de Notas:

 Clique em:
 Botão Iniciar > Executar > NotePad


TAGS
 Tag é uma palavra-chave (comando) que define um
item (imagens, texto, hyperLink, etc.) que irá fazer
parte da página
 Lembrando que a grande maioria trabalha em
pares.

As tags são identificadas por
estarem entre os sinais < > e < />


TAGS
• <Comando> Seu Texto </Comando>


TAGS - PRINCIPAIS
<HTML> </HTML>
Marca o início e o fim do documento

<HEAD> </HEAD>
Marca o início e o fim do Cabeçalho

<TITLE> </TITLE>
Mostra o título na barra de título

<BODY> </BODY>
Determina o que vai ser o “corpo” do programa.


TAGS – NA PRÁTICA
• <HTML>
• <HEAD>
• <TITLE> Minha primeira Aula de HTML
• </TITLE>
• </HEAD>
• <BODY>
• Bom dia a todos, quem esta com sono
levanta a mão ..
• </BODY>
• </HTML>


 <HTML>
 <HEAD>

 <TITLE> Minha primeira Página </TITLE>

 </HEAD>


 <BODY>
 Sejam bem vindo ao mundo HTML!

 </BODY>

 </HTML>


TAGS - PRINCIPAIS
 <BODY>
<H1> Cabeçalho de tamanho 1 </H1>
<H6> Cabeçalho de tamanho 6</H6>
</BODY>


• <H1>
• Cabeçalho de tamanho 1
• <H2>
• <H3>
• <H6>


TAG – PARÁGRAFO <P>
• <HTML>
• <HEAD>
• <TITLE> Minha primeira Página HEHEHE </TITLE>
• </HEAD>
• <BODY>
• Sejam bem vindo ao mundo HTML, <P>agora viajaremos
• <P>no html<P>!!!!!
• </BODY>
• </HTML>


TAG – PARÁGRAFO <P>


TAG - QUEBRA DE LINHA <BR>

 O comando <br> faz uma quebra de linha. Este
comando também insere uma linha em branco no
seu local ou na linha seguinte á qual ele foi inserido


 <HTML>
 <HEAD>
 <TITLE> Minha primeira página HTML </TITLE>
 </HEAD>
 <BODY>
 Quando um comando <BR> é inserido em um local
do programa, o browser irá<BR> fazer uma quebra
de linha, <BR> posiciona-se na linha seguinte ao
comando.<BR>
 </BODY>
 </HTML>


Formatação Sintaxe Função
NEGRITO <b>texto</b> Aplica o estilo negrito

ITÁLICO <I>texto</I> Aplica o estilo itálico

SUBLINHADO <u>texto</u> Aplica um sublinhado

SMALL <small>texto</small> Reduz e altera a fonte

BIG <big>texto</big> Aumenta a fonte e aplica negrito

Cor da fonte <font color=?></font> Altera a cor da fonte


FORMATAÇÃO
TEXTO

<b></b> Texto negrito.
<i></i> Texto em itálico.
Texto estilo máquina de
<tt></tt> escrever, mono espaçamento.
<font size=?></font> Tamanho das letras.

<font color=?></font> Cor das letras.


FORMATAÇÃO
 Mais algumas tags
ATRIBUTOS DO CORPO

<body bgcolor=?> Cor de fundo.

<body text=?> Cor de texto.

FORMATAÇÃO

TEXTO

<b></b> Texto negrito.
<i></i> Texto em itálico.
Texto estilo máquina de
<tt></tt> escrever, mono espaçamento.
<font size=?></font> Tamanho das letras.

<font color=?></font> Cor das letras.

Formatação
GRAFISMO

<img src=“imagem.jpg"> Insere uma imagem.

<img src=“imagem.jpg“ Alinha uma imagem em
align=?> relação ao resto do texto.

<img src=“imagem.jpg“
border=?>
Define a borda da imagem.

<img src=“ imagen" Define o tamanho da exibição da
width=“ %"> Imagem.

EXERCÍCIO
 Vamos montar uma nova pagina
 Inserir texto fomatar cor, fonte, tamanho da fonte

 Inserir 15 imagens

 Inserir 10 gif animados

Não quero que reste nenhuma duvida sobre inserir
imagem na pagina de vcs .....

ATIVIDADES
 Faça os exemplos

 Faça conforme o texto abaixo siga as orientações
cor sublinhado itálico

ATIVIDADE 2
 Realizar uma pesquisa sobre css
 Sua pesquisa deve contes os seguintes tópicos

 O que é css

 Quando surgiu css

 Importância em utilizar css

 Quais as diferenças entre HTML e o CSS

HTML e Tags

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a HTML e Tags

Semelhante a HTML e Tags (20)

Mais de Washington Oliveira

Mais de Washington Oliveira (20)

HTML e Tags