Linguagem HTML Parte 2

Continuação da aula sobre HTML

Enviado por

Daniel Faria

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato PDF, TXT ou leia on-line no Scribd

0% acharam este documento útil (0 voto)

30 visualizações22 páginas

Linguagem HTML Parte 2

Continuação da aula sobre HTML

Enviado por

Daniel Faria

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato PDF, TXT ou leia on-line no Scribd

Você está na página 1/ 22

Curso de Desenvolvimento

de Aplicações Web -
Linguagem HTML Parte 2
Daniel da Costa e Faria
Como inserimos um link?
• Para colocar um link em nossa página usamos a tag <a>
• Ela possui o atributo href, que aponta para onde o link vai levar o
usuário.
• Deve ter um elemento para o usuário clicar
• Pode ser um texto ou uma imagem
Sobre os links
Para usar uma imagem como link, fazemos o seguinte:

Para fazer um link abrir em uma nova aba, usamos o atributo target com o valor
entre aspas duplas _blank
A interação do HTML através dos formulários
• Um outro elemento importante do HTML é o formulário.
• Com ele podemos criar telas onde o usuário insere informações
• Podem ser usados para criar telas de cadastro ou páginas onde o
usuário irá “logar” no site.
• Podem também ser usados como tela de bate-papo
• O formulário mais conhecido é o buscador do Google
O arquivo processa.php é quem vai receber os
dados desse formulário. O post é o método de
envio
O mais conhecido dos Forms! Aquele que tudo sabe
Controles de formulário
Campo de texto Campo Password Text area (multilinhas)

Campo Rádio Checkbox Campo Select (lista)

Botões
• Submit - Envia os dados do
formulário
• Button - Botão simples. Para
funcionar deve-se adicionar uma
função Javascript
• Reset - Botão que limpa os
campos do formulário
Controles de formulário
•Campo de texto - Para informações como nome, sobrenome, telefone, etc.
Ex.: Nome
•Campo password - Campo de senha
Ex.: Nome
•Campo textarea - Campo de texto multicolunas
Ex.: Mensagem
Campo Checkbox
• Tem o atributo name, que define um nome para o campo (por exemplo,
interesses, com valores masculino e feminino)
• Permite escolher mais um valor
• Para funcionar, informamos o mesmo nome no atributo name, seguido de
colchetes[], mas no atributo value, colocamos valores diferentes
Campo Select
• O campo select possui o atributo name para indicar qual o nome do campo
no formulário
• As opções do campo select são inseridas pela tag option, que tem o
atributo value, ou seja, o valor escolhido pelo usuário.
• É possível escolher mais de um valor se usarmos o atributo multiple. Ex.:
Campo Select
Campo Select com opção multiple
Campo Rádio
• Tem o atributo name, que define um nome para o campo (por exemplo,
sexo, com valores masculino e feminino)
• Só permite escolher um valor
• Para funcionar, informamos o mesmo nome no atributo name, mas no
atributo value, colocamos valores diferentes
Enviando arquivos

• Podemos usar formulários para enviar arquivos para o site

• Isso também funciona em e-mails
• Usamos o campo input com o atributo file com o atributo name

• Para fazer funcionar, a tag

Quando clicamos no botão Escolher arquivo, abrimos uma
janela para procurar o arquivo que vamos mandar
HTML Elementos de layout
• Para compormos layouts de sites utilizamos elementos HTML que,
combinados com o uso da linguagem CSS permitem criar designs de
páginas web.
• São eles os elementos div, section, header, footer e nav
• Além disso, utilizamos elementos como as listas para compor menus
e sub-menus, formando a navegação do site.
• <div></div> <footer></footer>
• <section></section> <nav></nav>
• <header></header>
Livros indicados