front-end (html)
Post on 20-Jun-2015
296 Views
Preview:
TRANSCRIPT
sábado, 23 de março de 13
DesenvolvimentoFront-End
sábado, 23 de março de 13
• HTML
• Semântica
• SEO
• CSS
• JavaScript
• Bibliotecas e Frameworks
sábado, 23 de março de 13
Tabelas vs Tableless
sábado, 23 de março de 13
HTML
sábado, 23 de março de 13
HyperText Markup Language
HTML não é linguagem de programação
sábado, 23 de março de 13
Tags
<tag atributo="valor"></tag>
<tag atributo="valor">
sábado, 23 de março de 13
Estrutura básica de um documento
sábado, 23 de março de 13
<!doctype>
a tag ```<!doctype>``` defineo tipo de html que estamos escrevendo, no caso do exemplo acima HTML5, fazendo o browser compreendercorretamente os elementos presentes no documento.
sábado, 23 de março de 13
Outros exemplos de Doctype
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
sábado, 23 de março de 13
Elementos para marcação de texto
• <h1></h1>, .., <h6></h6>
• <p></p>
• <b></b>
• <i></i>
• <strong></strong>
• <em></em>
• <span></span>
sábado, 23 de março de 13
Elementos para marcação de imagens
<img src="imagem.jpg" alt="Descrição alternativa">
sábado, 23 de março de 13
Elementos estruturais• Lista não ordenada
• Lista ordenada
• Lista de definição
• <div></div>
sábado, 23 de março de 13
Elementos de formulário
• action : define o endereço para onde os dados serão enviados
• method : define o método de envio dos dados através do protocoo HTTP que pode ser POST ou GET
• enctype : esse atributo deve ser utilizado em formulários que enviem arquivos com o valor de multipart/form-data
sábado, 23 de março de 13
<label></label>
sábado, 23 de março de 13
<input type=”x”>• text
• password
• radio
• checkbox
• button
• file
• hidden
• submit
• reset
sábado, 23 de março de 13
select
sábado, 23 de março de 13
Outros• <textarea></textarea>
• <button></button>
sábado, 23 de março de 13
Atributos comuns nos elementos de formulário
• value: define um valor padrão para o campo (exceto em textareas).
• disabled: desativa um campo (exceto `<input type="hidden">`, os dados desse campo não serão enviados com o formulário.
• readonly: o valor do campo não pode ser editado, mas os dados são enviados com o formulário.
• checked : valido para elemenetos `radio` e `checkbox`, definem o campo como selecionado por padrão.
sábado, 23 de março de 13
Hyperlinks
sábado, 23 de março de 13
IFrame
sábado, 23 de março de 13
top related