HTML

HTML / JavaScript
V1.0
1
Introdução
 HTML = HyperText Markup Language
 HTML é a linguagem de marcação universal
para Web. HTML permite que você formate
texto, adicione gráficos, crie links, entradas
de formulários, frames, tabelas, etc e salve
tudo em uma arquivo texto que qualquer
navegador pode ler e exibir.
 A chave do HTML são as tags que indicam
qual conteúdo virá em seguida.
2
Conceitos
 Hipertexto: um documento hipertexto
provê links visualmente claros a outros
documentos e selecionando um link em um
documento nos leva a outra documento
 Internet: é um sistema global de
computadores em rede que permite
comunicação entre usuários e transferência
de arquivos entre quaisquer duas máquinas
da rede
3
Conceitos
 Multimídia: combina várias tecnologias de
apresentação num esforço de apelar aos
vários sentidos quanto possível (vale-se de
gráficos, sons, animações e vídeos para criar
um completa e rica experiência
computacional)
4
Serviços básicos da Internet
 E-mail: correio eletrônico
 FTP: transferência de arquivos
 WWW: comunicação por meio de hipertexto
5
Modelo Cliente / Servidor
Cliente Servidor
request
Browser Servidor Web
response
Mozilla Firefox Apache

Internet Explorer Internet Information Server (IIS)
Opera
Konqueror
Safari
Chrome
6
Modelo Cliente-Servidor
 Cliente Web (web client)  é o programa
responsável para exibição das páginas
solicitas pelo usuário
 Servidor Web (web server)  armazena e
permite o acesso aos dados
7
Clientes Web
 Browser (navegador ou paginador)
 Exemplos:
 Internet Explorer
 Mozilla Firefox
 Opera
 Safari
 Konqueror
 Chrome
8
URL (Uniform Resource Locator)
 Permite que cada documento na Web

possua uma endereço único que indica o
nome do arquivo, diretório, nome do
servidor e o protocolo usado para requisição
do documento
9
Exemplo
 http://www.policamp.edu.br/files_biblioteca/
normalizacao_bibliografica.pdf
 Onde:
http://  protocolo usado

www.policamp.edu.br  nome do servidor
files_biblioteca  diretório dentro do servidor
normalizacao_bibliografica.pdf  nome do
arquivo solicitado
10
Protocolos
 file: um arquivo no PC local
 ftp: um arquivo em um servidor FTP
 http: um arquivo em WWW
 gopher: um arquivo em um servidor Gopher
 mailto: um email em um servidor de Emails
 news: um Newsgroup da UseNet
 telnet: uma conexão Telnet
 wais: um arquivo em um servidor WAIS
11
Site (Web Site) ou Sítio
 Um site WWW é um conjunto de páginas
(com uso de hipertexto) relacionados
organizadas hierarquicamente onde
podemos encontrar informações do um
assunto, empresa, etc.
12
Conceitos
 Website: é uma ou mais páginas Web ligadas de
uma forma significativa
 Web server: é o computador real que armazena o
website
 Web pages: são os elementos individuais de um
website, como uma página é para um livro.
 Home page: em termos de publicação web, é o
ponto de entrada ao resto de páginas em um
website (é a página inicial ou mais importante)
13
Protocolos
 HTTP (Hypertext Transport Protocol)
 FTP (File Transfer Protocol)
14
SGML e HTML
SGML (Standard Generalized Markup
Language) que é uma linguagem usada para
fazer documentos que possam ser lidos em
diversas plataformas
HTML  é baseada na SGML
Não possui uma estrutura rígida e exata
Define a estrutura da página estabelecendo suas
características
15
Linguagem HTML (Hypertext Markup Language)
 Define a estrutura de uma página

estabelecendo seu título, texto, listas,
subtítulos, localização de imagens, etc.
 É uma linguagem para criação e
manipulação de textos, imagens e não
necessita de grande conhecimentos teóricos
e lógica de programação
16
Linguagem HTML
 A linguagem HTML é transportada pelo
protocolo HTTP (HyperText Transfer
Protocol) ou Protocolo de Transferência de
Hypertexto
17
Linguagem HTML
 Uma página HTML pode ser criada com uso
de qualquer editor de textos porém deve ter
a extensão .html ou .htm
18
Estrutura básica de uma página HTML
<html>
<head>
</head> Cabeçalho
Documento HTML
<body>
Corpo
</body>
</html>
19
Exemplo
<html>
<head>
<title>Primeira pagina</title>
</head>
<body>
<p>Primeiro Paragrafo
</body>
</html>
20
Tags e Atributos
Tags (marcações)
Tags são representadas entre os sinais < e > e finalizadas por </ >
Atributos
são características dos comandos representados pelas tags.
Os atributos podem apresentar parâmetros
Exemplo:
<INPUT TYPE="text" VALUE=Campinas NAME=‘cidade’
READONLY>
21
Exemplos de tags
 <h1> ... </h1>
 <br>
 <p>
 <h1 align="center"> ... </h1>
nome do
atributo
22
Exemplos de editores HTML
 Dreamweaver
 FrontPage
 NVU
Veja outros editores em:

http://baixaki.ig.com.br/categorias/cat125_1.htm
23
Comentários em HTML
 
24
Tags
 <br>  faz a quebra de uma linha
 <p> e </p>  parágrafo
 <tag />  tag única, sem lista de atributos

 <tag p1=“val1” p2=“val2” />  tag única, com
lista de valores
 <tag>texto</tag>  par de tags, sem lista de
valores e conteúdo inserido entre elas
 <tag p1=“val1”>texto</tag> par de tags, sem
lista de valores e conteúdo inserido entre elas
25
Cabeçalhos
Cabeçalhos são definidos com as tags <h1> a <h6>
<h1> defines o maior cabeçalho enquanto <h6>
define o menor cabeçalho.
 <h1>Este é um cabeçalho</h1>
26
Formatação de Textos
Dois tipos de formatação:
 Lógica
 Física
A idéia dessa separação é a independência

entre especificação e apresentação
27
Formação Lógica e Física
 A formatação lógica acompanha o
significado lógico do texto marcado. Sua
apresentação varia em função do navegador
usado podendo oferecer resultados distintos
 A formatação física especifica explicitamente
o estilo que se quer o texto, como letras em
itálico, negrito, sublinhado, etc.
28
Tag <font>
Atributos:
size  tamanho da fonte
color define a cor da fonte do texto
face  é o nome da fonte que a tag vai
apresentar
29
Atributos
Atributo Exemplo Proposta
size="número" size="2" Define o tamanho da fonte
size="+número " size="+1" Aumenta o tamanho da fonte
size="-número " size="-1" Diminui o tamanho da fonte
face="nome-da-face" face="Times" Define o nome da fonte
color="valor-da-cor" color="#eeff00" Define a cor da fonte
color="nome-da-cor" color="red" Define a cor da fonte
30
Padrões de Cores
 Padrão de cores RGB (Red, Green, Blue)
 Padrão de cores CMYK (Cyan, Magenta,
Yellow, Black)
31
Algumas cores nomeadas
Black Marron Green Navy
Sliver Red Lime Blue
Gray Puple Olive Teal
White Fuchsia Yellow Aqua
32
Tags de estilos físicos
 <b> (bold) negrito
 <i> (italic) itálico
 <tt> fonte de máquina de escrever
(monoespaçada)
 <u> (underline) sublinhado
 <s> (strikethrough)
33
Parágrafo
 Tag <p>
 <p align="[left|right|center|justify]"> [texto]
</p>
 left – seleciona alinhamento a esquerda
 right – seleciona alinhamento a direita
 center – seleciona alinhamento ao centro
 justify – justifica o texto do parágrafo
Exemplo
<p>Primeiro parágrafo</p>
34
Linha Horizontal
 As linhas horizontais podem ser usadas para
separar visualmente seções de uma página
da web.
 Em HTML a separação é realizada por meio
da tag <hr>
 Exemplo:
<hr size="5" width="50%" align="center" noshade>
35
Listas
 Listas de definição
 Listas Ordenadas
 Listas Não ordenadas
36
Listas – de definição
É usada para definir termos, criar textos
explicativos, dicionários, entre outras
funções. Uma lista de definição é composta
de duas partes:
 termo
 definição
37
Lista de Definição – Exemplo
<dl> Resultado
<dt>
HTML
HTML
Hypertext Markup
<dd>Hypertext Markup
Language Language
<dt>XML
<dd> Extensible Markup XML
Language Extensible Markup
</dl> Language
38
Listas - Ordenadas
Uso das tags <ol> Resultado
Exemplo:
<ol> 1. primeiro
<li>primeiro 2. segundo
<li>segundo 3. terceiro
<li>terceiro
</ol>
39
Listas – Não ordenadas
Uso das tags <ul> Resultado
Exemplo:
<ul>  primeiro
<li>primeiro  segundo
<li>segundo  terceiro
<li>terceiro
</ul>
40
A tag <a> (Anchor) e o atributo href
HTML usa a tag <a> (anchor) para criar um link
para outro documento.
Um anchor (âncora) pode apontar para qualquer

recurso na Web: uma página HTML, uma imagem,
uma trilha sonora, um clipe, etc.
Sintaxe para criação de uma âncora:

<a href="url">Texto para ser
exibido</a>
41
A tag <a> é usada para criar uma ligação
(vínculo) ao link,
O atributo href é usado para endereçar o
documento ao qual o endereço está
apontando,
e as palavras entre o abre e fecha âncora será
exibido como o hyperlink.
42
Esta âncora define um link para página da
Policamp:
<a
href="http://www.policamp.edu.br/">Policamp</a
>
A linha acima parecerá como a linha abaixo no

browser:
Policamp
43
Links
Os links tornam possível a navegação entre
páginas.
<a
name="[nome]"
href="[url]"
title="[titulo]"
target="[_blank | _self | _top |
nome]"
>
[âncora]
</a>
44
Atributos
 name: marca um indicador, isto é, uma
região de um documento como destino de
uma ligação
 href: indica a URL de destino da ligação do
hipertexto
 title
 target: destino
45
Âncoras – links na mesma página
 Âncoras são inseridas pelo atributo name da tag
<a>.
 Exemplo:
<a href="#link1">link1</a><br>
<a href="#link2">link2</a><br>
<a name="link1">djshj asjhja ahdjka asdh
<a name="link2">sjdkas asdhkj asjdh ash
46
Imagens
 <img>  inclui uma imagem em uma
página HTML
47
Atributos da tag <IMG>
 SRC: URL da imagem que será exibida
 ALIGN: top | bottom | middle | left | right
 WIDTH: estabelece a largura da imagem
 HEIGHT: estabelece a altura da imagem
 VSPACE: controla o espaço acima e abaixo da
imagem
 HSPACE: controla o espaço a esquerda e a direita
da imagem
 BORDER: define a borda ao redor da imagem
 ALT: define uma descrição sucinta da imagem
 LOWSRC
48
Exemplo
 <img src="angry.gif" alt="Angry"/>
49
Tabelas
Uma tabela é composta por linhas e colunas
que formam uma célula.
Essas células podem conter textos, imagens e
até mesmo outras tabelas
50
Tabelas - Tags
Tags:
<table> ... </table>  delimita uma tabela
<caption> ... </caption>  define um título
para tabela (é opcional)
<tr> ... </tr>  delimita uma linha
<td> ... </td>  delimita uma coluna
<th> ... </th>  tags de cabeçalho (negrito
e centralizado)
51
Tabelas – Tag <table>
<table
[border="n"]
[cellpadding="n"]
[cellspacing="n"
[width="n"]
[align="left"|"center"|"right"
>
...
</table>
52
Exemplo de Tabela
<table>
<tr>
<td> linha 1, coluna 1 </td>
</tr>
<tr>
</tr>
</table>
53
Atributos da tag <table>
 width: especifica a largura da tabela
 height: especifica a altura da tabela
 align: alinha a tabela (left|center|right)
 valign: alinhamento vertical da célula
(top|bottom|middle)
 bgcolor: cor de fundo
 background: cor da fonte
 cellpadding: define o espaço entre a célula e sua
borda
 cellspacing: define o espaço entre as células
54
Atributos (2)
 border  especifica a largura da borda (use
o valor "0" para não exibir as bordas)
 bordercolor  atualiza a cor da corda
 bordercolordark  atualiza o componente
escuro do efeito 3D
 bordercolorlight  atualiza o componente
claro do efeito 3D
55
Atributos para mesclagem de células
 colspan  permite mesclar colunas de uma

determinada linha de uma tabela
 rowspan  permite mesclar as linha de uma
determinada coluna de uma tabela
 Sintaxe
<td colspan="n"> ... conteúdo da célula </td>
<td rowspan="m"> ... conteúdo da célula </td>
onde n representa o número de colunas e m o número de
linhas a serem mescladas
56
Áreas das tabelas
 <thead> .. </thead>  define um table
head ou cabeçalho da tabela
 <tfoot> .. </tfoot>  define um table foot
ou rodapé da tabela
 <tbody> .. </tbody>  define um table
body ou corpo da tabela
57
Título da tabela
 Tag caption
 Deve ser usado dentro da tag <table>
58
Frames
 É uma divisão que cria um ambiente onde
mais de uma página pode ser vista ao
mesmo tempo
 É possível definir regiões fixas onde
podemos colocar informações como o logo
da empresa, um menu de navegação (por
exemplo) e regiões onde são feitas as
navegações
59
Frames
Com frames é possível visualizar mais de um documento
HTML na mesma janela do browser.
Cada documento HTML é chamado um frame e cada frame é
independente dos outros
Desvantagens no uso de frames:

 o desenvolvedor Web deve manter o gerenciamento de
mais de um documento HTML
 é difícil imprimir a página inteira
60
Frames
Tag Descrição
<frameset> Define um conjunto de frames
<frame> Define uma sub-janela (um

frame)
<noframe> Define uma sessão noframe para
browsers que não suportam
janelas
<iframe> Define um sub-janela inline
(frame)
61
A tag Frameset
 A tag<frameset> define como dividir uma
janela em frames
 Cada frameset define um conjunto de linhas
ou colunas
 O valor das linhas/colunas indicam a
quantidade da área da tela que cada linha
/coluna ira ocupar.
62
Frames - Tags
Tag <frameset> é usada para organizar
múltiplas janelas
Atributos:
cols: define o número e tamanho das colunas
em um frameset
rows: define o número e tamanho das linhas
em um frameset
63
A tag <frame>
 A tag <frame> define que documento HTML
será alocado em cada frame
 No exemplo abaixo temos um frameset com
duas colunas. A primeira coluna ocupara
25% da largura da janela do navegador e a
segunda coluna ocupara 75% da largura. O
documento HTML "frame_a.htm" é colocado
na primeira coluna e o documento
"frame_b.htm" is colocado na segunda
coluna
64
Exemplo
<frameset cols="25%,75%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
</frameset>
65
Formulários
 Permite aos usuários entrar com dados e
assim criar uma interatividade nas páginas
HTML.
 O uso de formulário é muito usado quando
tratamos de aplicações web.
66
Formulários
Um formulário é uma área que contém elementos de
formulários.
Elementos de formulários são elementos que
permitem ao usuário entrar com informações
(como text fields, textarea fields, drop-down
menus, radio buttons, checkboxes, etc) em um
formulário.
Um formulário é definido com o tag <form>.
67
Formulários – Tag <form>
<form
name ="[nome]"
method ="[get|post]"
action ="[url]"
enctype="[tipo]"
>
...
</form>
68
Atributos do Form
 name: nome do formulário
 method: GET | POST
 GET  dados enviados na URL da página (limite de
aproximadamente 2000 bytes)
 POST  dados enviados como variáveis de ambiente
 action: determina a URL do destino da ação
 enctype: determina o tipo de empacotamento que os
dados serão submetidos (normalmente é string. Para envio
de dados binários usa-se multipart/form-data
69
Método GET
 os dados inseridos em um formulário fazem
parte da URL associada a consulta enviada
ao servidor.
 as informações digitadas nesse modo são
visualizados na barra de endereço do
navegador
70
Método POST
 os dados inseridos em um formulário fazem
parte do corpo da mensagem encaminhada
ao servidor que suporta uma grande
quantidade de dados.
 as informações digitadas nesse modo não
são visualizados na barra de endereço do
navegador
71
Entrada de dados através do formulários
 Entrada de dados
 Área de textos
 Lista
72
Tag <input>
 A tag <input> define o tipo da tag para
entrada de dados
73
Tag <input> - Atributos
 type – informa qual é o tipo do campo de entrada de
dados
 name – informa qual é o nome do campo
 value – informa um valor padrão para o campo
 size – informa o tamanho do campo exibido na tela
 maxlength – informa o número máximo de caracteres que
pode ser digitado no campo
 id – identidade única para tag
74
Atributo type
 text – entrada de texto (linha única)
 checkbox – caixa de múltiplas opções
 radio – caixa de opções simples
 submit – botão de envio
 button – botão de uso genérico
 reset – limpa todos os dados inseridos pelo
usuário
 hidden – campo oculto
 image – botão imagem
 password – entrada de senha
 file – entrada de arquivos
75
Tag input
<input
type="tipo"
name="nome"
id="id"
value="valor"
size="tamanho"
maxlength=[limite de caracteres]
checked readonly disabled tabindex=
>
76
Text Field (Caixa de entrada de uma linha)
<html>
<body>
<form action="" name="Form1" method="get">
<p>Nome:
<input type="text" name="nome" size="20" />
<br/>
<p>Sobrenome:
<input type="text" name="sobrenome" size="20" />
</form>
</body>
</html>
77
Password (Senha)
<html>
<body>
<form action="">
Usuario:
<input type="text" name="user" size="20" />
<br />
Senha:
<input type="password" name="password" size="20" />
</form>
<p>
<b>Nota:</b>O navegador exibe asteriscos ou bullets ao invés dos caracteres
digitados com campo password.
</p>
</body>
</html>
78
Checkboxes (Caixa de Seleção)
<html>
<body>
<form action="" name="Form" method="POST">

Eu tenho uma bicicleta:
<input type="checkbox" name=“tem_bicicleta" value=“bicicleta"
/>
<br/>
Eu tenho um carro:
<input type="checkbox" name=“tem_carro" value=“carro" />
<br/>
Eu tenho um avião:
<input type="checkbox" name=“tem_aviao" value=“avião" />
</form>
</body>
</html>
79
Radio Button (botão de rádio ou seletor)
<html>
<body>
<form action="" name="Form" method="POST">

Qual é seu sexo ?
<br/>
<input type="radio" name="sexo" value="M">Masculino
<br/>
<input type="radio" name="sexo" value="F">Feminino
</form>
</body>
</html>
80
Button (Botão)
<html>
<body>
<form action="">
<input type="button" value="Hello world!"
/>
</form>
</body>
</html>
81
Submit (Botão de envio)
<body>
<form name="input" action="form_action.asp" method="get">

Digite seu primeiro nome:
<input type="text" name="FirstName" value="Mickey" size="20" />
<br />
Digite seu último nome:
<input type="text" name="LastName" value="Mouse" size="20" />
<br />
<input type="submit" value="Enviar" />
</form>
<p>Utilize a tecla <CTRL> para seleção de mais de um item</p>

<p>
Se você clicar no botão "Enviar" você enviará sua entrada a uma nova
página chamada "form_action.asp".
</p>
</body>
</html>
82
Área de texto (Caixa de texto de rolagem)
<p>Entre com seus comentários:
<textarea
name="comentarios"
rows="6"
cols="60"
>
Entre com seus comentários
</textarea>
83
Tag select (Menu suspenso (Select e Option))
<select
name ="browser"
value="Firefox"
size ="2"
>
<option>Internet Explorer</option>
<option value=“firefox”>Firefox</option>
<option value=“opera”>Opera</option>
<option value=“safari”>Safari</option>
</select>
84
Lista
Atributos:
 size – determina quantos itens serão vistos
 multiple – permite mais de uma seleção
 value -
 selected – especifica que essa opção é
selecionada por padrão
85
Label
86
Fieldset e Legend
 O elemento fieldset organiza os controles do
form em grupos que aparecem no
navegados
 O elemento legend exibe o título do fieldset
87
Exemplo
<fieldset>
<legend>Entrada de Dados</legend>
<label for="control4">Qual é seu time de futebol
favorito ?</label>
<input type="text" name="timefavorito"
id="control4" />
<input type="submit">
</fieldset>
88
Estilos
89
Usando estilos
Há três forma de trabalhar com folhas de estilo:
 In-line  utilizados na própria tag
 Estilo incorporado  definido no início da página
 Estilo vinculado (página de estilo)  o estilo é

definido em uma página separada e pode ser
reaproveitado em outras páginas
90
CSS (Cascade Style Sheet)
Exempo de uso:
Exemplo:
<html>
estilo10-03.css <head>
<link rel="stylesheet"
P {font-family: arial} href="css/estilo10-03.css"
type="text/css">
</head>
<body>
<p>texto</p>
</body>
</html>
91
Estilos
Podem ser atribuídos:
 a uma tag
 a uma classe
 a ...
92
Estilos em Eventos
 active
 hover
 link
 visited
93
Estilos
 Formatação de texto
 Formatos de tamanho
 Cores e fundos
 Formatação de parágrafos
 Formatação de listas
 Formatação de tabelas
 Posicionamento Dinâmico
94
Script
<script type=“JavaScript" src="[URL]">
...
</script>
A tag script deve ser inserida entre as tags

<head> e </head>
95
Atributos
 type  tipo do script (ex: JavaScript)
 src  permite a inclusão de um arquivo
externo contendo o script
Exemplo:
<script language=“JavaScript”
src=http://www.mltech.com.br/script.js>
96
Bibliografia
 [1] LEMAY, L. Aprenda em 1 Semana HTML 4.
Rio de Janeiro. Campus. 1999
 [2] Marcondes, C. A. HTML 4.0 Fundamental –
a base da programação para Web. São Paulo.
Érica. 2005
 [3] PRATES, R. JavaScript – Guia de Consulta
Rápida. São Paulo. Novatec. 1996.
 [4] LEMAY, L, COLBURN R. Web Publishing with
HTML and CSS. Indiana. SAMS. 2006.
97
JavaScript
Fundamentos
98
JavaScript
 É uma linguagem de programação client
side, isto é, executado no lado cliente da
aplicação.
 É case sensitive (diferencia maiúsculas e
minúsculas)
 É uma linguagem baseado em objetos
 Toda instrução é finalizada com ";"
99
Por que usar JavaScript
 Facilidade de uso
 não exige a declaração de tipos de variáveis
 fácil de usar
 Aumento da eficiência do servidor
 permite validações locais sem uso do servidor que permite não
carregar o servidor
 permite adicionar validações locais e procedimentos de verificações
locais reduzindo o número de transações com o servidor
 Integração com o navegador
 permite a manipulação de objetos na página, como links, imagens
de elementos de formulários
 permite controlar o próprio funcionamento do browser, permitindo a
alteração do tamanho de janelas, movimentação da janela ao redor
da tela e ativando e desativando elementos da interface
100
Comentários em JavaScript
//  usado para comentários de uma única
linha
/* ... */  comentário de múltiplas linhas
101
Variáveis
São espaços de memória onde podemos
guardar uma informação, como um número
ou uma cadeia de caracteres
 var a=1;
 var b=5;
 var c=6;
 var valor=1.20;
 var nome="policamp";
 var cidade="campinas";
102
Caixas de mensagens
 Mensagem de Alerta (alert)
 Mensagem de Confirmação (confirm)
 Mensagem de prompt para entrada de
dados
103
Eventos
 São ações identificáveis em um sistema
 Ocorrem em uma página web normalmente
quando o visitante interage com a página de
alguma forma: clica num botão, carrega
uma página, movimenta o mouse, etc
 Poder ser interceptados por JavaScripts
104
Eventos
 Onload: sempre que a página é carregada ou
recarregada
 Onunload
 Onclick: sempre que o visitante clica em um
elemento específico
 Ondblclick
 Onmousedown
 Onmouseup
 Onmouseover
 Onmousemove
 Onmouseout
105
Eventos
 Onfocus: sempre que um visitante entra um
campo de formulário específico
 Onblur: sempre que um visitante deixa um campo
de formulário específico
 Onkeypress
 Onkeydown
 Onsubmit: sempre que o visitante submeter um
formulário
 Onreset
 Onselect: sempre que o visitante seleciona o
conteudo de um campo específico
 onchange
106
Definição de Funções
107
Dynamic HTML (DHTML)
 DHTML, ou HTML dinâmico é um conjunto
de recursos somados aos recursos HTML
que tornam a formatação, posicionamento e
controle das páginas uma tarefa mais
segura e prática
108
Vantagens do DHTML
 Maiores recursos estéticos
 Maior controle dos objetos na página
 Identificação das formatações
 Reaproveitamento de código
109
Links
 Tutorial de HTML 4.01
http://www.artifice.web.pt/tutoriais/cntd/tut_html1
.html
 <CriarWeb>
http://www.criarweb.com/html/
 Tutorial HTML
http://www.w3schools.com/html/
 Tutorial http://www.htmlcodetutorial.com/
110
Links
 Link para vários tutoriais
http://www.devguru.com/home.asp
 Tutorial HTML do ICMC-USP

http://www.icmc.usp.br/ensino/material/html/
 Tutoriais de HTML
http://www.truquesedicas.com/tutoriais/html/0000
1a.htm
111
Links
 Site TableLess http://www.tableless.com.br
Há dicas para criar páginas interessantes sem o uso
de tabelas
 http://duda.imag.fr/forms-intro.shtml
 Especificação do HTML 4.01

http://www.w3.org/TR/html4/cover.html#minitoc
112
Site do Professor
 http://www.mltech.com.br/
113

HTML

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

HTML

Enviado por

Direitos autorais:

Formatos disponíveis

HTML / JavaScript

Mozilla Firefox Apache

 Permite que cada documento na Web

http://  protocolo usado

 Define a estrutura de uma página

Veja outros editores em:

 <tag />  tag única, sem lista de atributos

A idéia dessa separação é a independência

Black Marron Green Navy

Sliver Red Lime Blue

Gray Puple Olive Teal

White Fuchsia Yellow Aqua

Um anchor (âncora) pode apontar para qualquer

Sintaxe para criação de uma âncora:

A linha acima parecerá como a linha abaixo no

 colspan  permite mesclar colunas de uma

Desvantagens no uso de frames:

<frame> Define uma sub-janela (um

<form action="" name="Form1" method="get">

<form action="" name="Form" method="POST">

<form action="" name="Form" method="POST">

<form name="input" action="form_action.asp" method="get">

<p>Utilize a tecla <CTRL> para seleção de mais de um item</p>

 Estilo incorporado  definido no início da página

 Estilo vinculado (página de estilo)  o estilo é

A tag script deve ser inserida entre as tags

 Tutorial HTML do ICMC-USP

 Especificação do HTML 4.01

Você também pode gostar