HTML - Curso Completo (cortesia Wikipedia.org)
HTML - HiperText Markup Language - Linguagem de Marcação de Hipertexto.
O que é uma tag?
Um documento HTML não é nada mais do que um arquivo de texto plano, quero dizer, somente letras e nada mais, escritas num arquivo. Então, como fazer para aumentar o tamanho da letra, colocá-la em negrito, itálico, mudar-lhe a cor, etc.? A resposta é: devem-se usar sequencias de caracteres numa linguagem própria, para indicar ao navegador que alguma parte do seu texto, não deve ser mostrada como o resto, ou seja, que aquela secção deve ser mostrada com uma cor ou tipo de letra diferente.
Em inglês, estes comandos especiais são chamados de tags (etiqueta). Um tag sempre começa com um sinal de menor e termina com um sinal de maior - que definem o início e o fim do mesmo Por exemplo: <p> (que corresponde ao tag indicador de início de parágrafo).
Existem dois tipos de tags: aqueles que são isolados, como o <br>, por exemplo, que indica uma quebra forçada de linha e outros como o <p> que, por indicarem o início de uma secção como, no caso, de um parágrafo, exigem a inclusão de um segundo tag complementar, para indicar o final daquela secção - </p>, no caso, para definir o fim do parágrafo.
Segundo a W3C, todas as tags devem ser escritas em letras minúsculas.
Estrutura básica de um documento HTML
<html>
<head>
<title> Título </title>
</head><body>
<p> Este é um parágrafo </p>
</body></html>
Veja que todas as tags abertas, foram fechadas, o documento começa com a tag <html> e termina com a tag </html>. O fechamento de uma tag é representada pela /.
<html> - marca do início do documento HTML
<head> - início do cabeçalho
<title> - títlulo
<body> - corpo do documento
<p> - paragráfo
<br /> ou <br> - salto de linha
<a> - link
<i> - itálico
<font> - fonte
<h1> - cabeçalho do texto de maior nível
Atributos das Tags
Quando uma tag possui um atributo, este é inserido antes do > na abertura da tag, ou antes do espaço.
<tag atributo=”valor”>texto</tag> ou <tag attributo=”valor” />
Exemplo: para colorir uma letra é usado o tag font em combinação com o atributo color. Este atributo define, como é óbvio pelo nome, a cor da letra, cor esta que pode ser especificada pelo código RGB definido em números hexadecimais a seguir ao sinal cardina (ex.: #ff3233) ou pelo nome predefinido da cor (como as que mostramos na figura seguinte).
| Black #000000 |
Green #008000 |
Silver #C0C0C0 |
Lime #00FF00 |
|---|---|---|---|
| Gray #808080 |
Olive #808000 |
White #FFFFFF |
Yellow #FFFF00 |
| Navy #000080 |
Maroon #800000 |
Red #FF0000 |
Blue #0000FF |
| Purple #800080 |
Teal #008080 |
Fuchsia #FF00FF |
Aqua #00FFFF |
| Se gostou desse artigo... | |
:: |
receba as novidades deste site por e-mail! |
Dê a sua opinião sobre este artigo
9 Opiniões
-
eduardo on
Outubro 24, 20080:40
Bem eu acho muito interessante este site, bem compartilhado, bem elaborado por voces, que são muito capacitados no ramo, introduzindo um óptimo texto para os usuarios!
-
Magno Urbano on
Outubro 24, 20082:22
Obrigado Eduardo. Espero que o site seja-lhe útil!
-
Igor on
Outubro 27, 200816:24
Eu achei este artigo bom para iniciantes, mas poderia ser mais aprofundado nos assuntos, com tabelas mostrando os exemplos!!
-
Magno Urbano on
Outubro 27, 200822:02
esse artigo é mesmo para iniciantes! :-)
-
wagner on
Agosto 12, 200915:45
Muito boa esta materia. Ja li varios tutorias sobre html mas esse explica de uma forma simples, mais completa. Excelente. Parabéns.
-
Magno Urbano on
Agosto 13, 200919:52
Obrigado Wagner!!!!
-
Samuel Haidu on
Maio 30, 201017:19
podemos dizer que é bom, alem de ser de graça, compartilhado e e muito bem feito para inicantes.
-
IVAN CRUZ on
Setembro 16, 201023:39
è muito bom vermos que vocês não "escondem o jogo" - explicando com clareza a introdução! Mas eu gostaria de saber , realmente, como elaborar uma página via html! Abraços; ivan cruz
-
suane on
Setembro 17, 201119:18
verdadeira obra rara muito bom saber as belezas de nossa area e que completo é isso .
Google PageRank
Conteúdo Duplicado
- 2D
- 3D
- Adobe
- Apple
- Áudio
- Book & E-book
- Cinema
- Continuação
- Curso de Photoshop
- Cursos pela Internet
- Dicas
- e-learning
- Edição de Vídeo
- Fórum (2002-2005)
- Filmes - Making of
- Firefox
- Flash Catalyst
- Fotografia Digital
- Galeria de Imagens
- GIMP
- Ilustração
- Intel
- Linux
- Livro
- Microsoft
- Montagem de Fotos
- Nikon
- Pinnacle Studio
- Pixar
- Servidor Apache
- Software
- Tecnologias
- Tutoriais
- Ubuntu
- Vídeos
- Vídeos iPod
- Web
- Wordpress
- Yahoo!
- YouTube
ddddddd
- 2020: J - - - - - - - - - - D
- 2019: - - - - - - - - S - - -
- 2018: J - - - - - - - - - - -
- 2017: - - - - - - - - S - - -
- 2014: J - - - M - J - - - - -
- 2013: - - - A M - - - - - N -
- 2012: - F M - M - - A - - - -
- 2011: - - M A - - - - - O N -
- 2010: J - - A - J - - - - - -
- 2009: J F M A M J J A S O N D
- 2008: J F M A M J J A S O N D
- 2007: J F M A M J J A S O N D
- 2006: - F M - - J J A S O N D
- 2005: J - M - - J J - - - - -
- 2004: - F M A M J - - S - N D
- 2003: J F M A M J J A S O N D
- 2002: - - - - - - - - - - N D