Tutorial Html (Aula 001) - By Vulcano Studios 13.01.12 15:41
Olá Pessoal ligado nos projetos da Vulcano aki começa o meu tutorial ( Não está ligado ao tutorial do Poseidon )
Indrodução
O que é ?
HTML - HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto
Para que serve ?
É uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores.
Da onde surgiu ?
A tecnologia é fruto do "casamento" dos padrões HyTime e SGML.
Como uso ?
Pode ser escrito em MAIÚSCULO ou em minusculo, apresenta-se entre etiquetas ( <etiqueta> ou <ETIQUETA> ) e sempre é finalizado entre etiquetas e uma barra ( </etiqueta> ou </ETIQUETA> ).
Documento Básico
(Alô Mundo é uma maldição se vc não escrver isso na primeira página html que você criar nunca vai aprende html)
As etiquetas básicas de HTML cuja presença é altamente recomendada nas páginas são:
Extenções de Head:
Extenções de Body:
Na próxima aula Vamos Falar sobre texto
Indrodução
O que é ?
HTML - HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto
Para que serve ?
É uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores.
Da onde surgiu ?
A tecnologia é fruto do "casamento" dos padrões HyTime e SGML.
Como uso ?
Pode ser escrito em MAIÚSCULO ou em minusculo, apresenta-se entre etiquetas ( <etiqueta> ou <ETIQUETA> ) e sempre é finalizado entre etiquetas e uma barra ( </etiqueta> ou </ETIQUETA> ).
Documento Básico
- Código:
<html lang="pt">
<head>
<title>Título do Documento</title>
</head>
<body>
aqui fica a página,
texto (geralmente <p></p>, <div></div> ou <span></span>),
imagem (<img></img>),
links (<a></a>),
...
</body>
</html>
(Alô Mundo é uma maldição se vc não escrver isso na primeira página html que você criar nunca vai aprende html)
As etiquetas básicas de HTML cuja presença é altamente recomendada nas páginas são:
- <html>:
- Define o início de um documento HTML e indica ao navegador que todo conteúdo posterior deve ser tratado como uma série de códigos HTML
- <head>:
- Define o cabeçalho de um documento HTML, que traz informações sobre o documento que está sendo aberto
- <body>:
- Define o conteúdo principal, o corpo do documento. Esta é a parte do documento HTML que é exibida no navegador. No corpo podem-se definir propriedades comuns a toda a página, como cor de fundo, margens, e outras formatações
Extenções de Head:
- <title>:
- Define o título da página, que é exibido na barra de título dos navegadores
- <style>:
- Define formatação em CSS
- <script>:
- Define programação de certas funções em página com scripts, podendo adicionar funções de JavaScript
- <link>:
- Define ligações da página com outros arquivos como feeds, CSS, scripts, etc
- <meta>:
- Define propriedades da página, como codificação de caracteres, descrição da página, autor, etc. São meta informações sobre documento. Tais campos são muitos usados por mecanismos de busca(como o Google) para obterem mais informações sobre o documento, a fim de classificá-lo melhor. Por exemplo, pode-se adicionar o código <meta name="description" content="descrição da sua página" /> no documento HTML para indicar ao motor de busca que texto de descrição apresentar junto com a ligação para o documento. Para o sistema Google, comandos meta como keywords por exemplo não são utilizadas para indexar páginas. Apenas <title> e a meta <description> são usadas para descrever a página indexada
Extenções de Body:
- <h1>, <h2>,... <h6>:
- Cabeçalhos e títulos no documento em diversos tamanhos. (quanto menor for o número, maior sera o tamanho da letra)
- <p>:
- Novo parágrafo
- <br>:
- Quebra de linha
- <table>:
- Cria uma tabela (linhas são criadas com <TR> e novas células com <TD>. Já os cabeçalhos de coluna são criados com a etiqueta <TH>)
- <div>:
- Determina uma divisão na página a qual pode possuir variadas formatações
- <font>:
- Altera a formatação (fonte, cor e tamanho) de um trecho do texto
- <b>, <i>, <u> ,<s> e <color>:
- Negrito, itálico, sublinhado, riscado e cor, respectivamente
- <img>:
- Imagem
- <a>:
- Hiper-ligação para um outro local, seja uma página, um e-mail ou outro serviço
- <textarea>:
- Caixa de texto (com mais de uma linha); estas caixas de texto são muito usadas em blogs, elas podem ser auto selecionáveis e conter outros códigos a serem distribuídos
- <acronym>:
- Acrônimo (sigla)
- <cite>:
- Citação
- <address>:
- Endereço
Na próxima aula Vamos Falar sobre texto