Your SlideShare is downloading. ×
Html Básico
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Html Básico

1,760
views

Published on

Html Básico - Fundamentos da linguagem de marcação Html 4.01 e uso das principais tags

Html Básico - Fundamentos da linguagem de marcação Html 4.01 e uso das principais tags

Published in: Technology

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,760
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
106
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. HTML Básico Como criar uma página de internet
  • 2. Marcelo Machado Pereira Consultor de TI. Instrutor de Treinamentos. Programador Web Master. Gestor de Projetos de SGDB. Micro Empreendedor e Blogueiro.
  • 3. Licença: Html Básico de Marcelo Machado Pereira é licenciado sob uma   Licença Creative Commons Atribuição-Uso não-comercial-Compartilhamento pela mesma licença 3.0 Unported .
  • 4. Objetivos: Aprender o que é HTML e para que serve. Desenvolver uma página de Internet básica. Assimilar os conceitos básicos da programação para web.
  • 5. Apresentação: Com HTML você pode criar o seu próprio Web Site. Esta apresentação ensina muitos conceitos de HTML. HTML é muito fácil de aprender e vocês vão adorar.
  • 6. O que é HTML? HTML é a sigla para Hyper Text Markup Language. HTML não é uma linguagem de programação. HTML é uma linguagem de marcação. As marcações são feitas através de <tags>.
  • 7. Tags HTML Deve-se sempre abrir e fechar as tags. São os textos que ficam entre < > ou < />. Geralmente são sempre pares,<p> e </p>.
  • 8. Documentos HTML Contém tags Html e texto plano. Exibem conteúdo de páginas web. Também são chamados de páginas web.
  • 9. Browsers e o HTML Finalidade é ler o documento Html e exibir o conteúdo da página. Não exibem as tags mas usam as tags para interpretar o conteúdo das mesmas.
  • 10. Exemplo de Browsers
  • 11. Quem criou o HTML? Sir Tim Berners-Lee, em 1989. A versão 1 era muito básica e era limitada na integração multimídia. Em 1993 foi adicionado mais recursos, como a interação de imagens.
  • 12. Qual a versão atual do HTML? Atualmente a maioria dos sites usa HTML 4.01 mas alguns browsers já aceitam HTML5. Mudança de conceitos para o design da página. Substituição de algumas tags por formatação e design em CCS.
  • 13. Do que você precisa? Não precisa de um Web Site. Não precisa de um editor HTML. Não precisa de um servidor Web. Para aprender HTML não é necessário nenhuma ferramenta.
  • 14. Editanto o HTML HTML pode ser escrito e editado com o uso dos mais diferentes editores como Dreamweaver ou Visual Studio. Entretanto, iremos usar um editor de texto plano como o notepad.
  • 15. Editanto o HTML Um editor de texto plano é a melhor escolha quando se pretende editar um arquivo para aprender o HTML.
  • 16. Usar .htm ou .html na extenção? Quando você salvar um arquivo HTML tanto faz salvar como .htm ou como .html Na prática não há a menor diferença entre ambas as extenções.
  • 17. Como criar um arquivo HTML Abrir o editor de textos. Criar um novo arquivo em branco. Salvar o arquivo com a extensão .html Iniciar a edição do arquivo.
  • 18. Arquivo básico HTML <html>    <head>        <title>Minha página de Internet</title>    </head>    <body>        ...Conteúdo da página...    </body> </html>
  • 19. Explicação do exemplo O texto entre <html> e </html> descreve o conteúdo da página. O texto entre <head> e </head> é o cabeçalho da página, não é exibido no browser. O texto entre <body> e </body> é o conteúdo visível da página no browser.
  • 20. Cabeçalhos HTML Os cabeçalhos são definidos com as tags <h1> até <h6>. Exemplo: <h1>Isto é um cabeçalho</h1> <h2>Isto é um cabeçalho</h2> <h3>Isto é um cabeçalho</h3>
  • 21. Parágrafos HTML Os parágrafos HTML são definidos com a tag <p>.   Exemplo: <p>Isto é um parágrafo.</p> <p>Isto é um outro parágrafo.</p>
  • 22. Links HTML Os links HTML são definidos com tag <a>.   Exemplo: <a href=&quot;http://www.meusite.com.br&quot;>Isto é um link</a>   O endereço do link é especificado no atributo href.
  • 23. Imagens HTML As imagens HTML são definidas com a tag <img>. Exemplo: <img src=&quot;imagem.jpg&quot; width=&quot;104&quot; height=&quot;142&quot; />   O nome e o tamanho da imagem são fornecidos nos atributos.
  • 24. Elementos HTML Documenos HTML são definidos por elementos HTML. Um elemento HTML é tudo que está entre a tag inicial e a tag final.
  • 25. Elementos HTML tag inicial        conteúdo do elemento        tag final   <p>                 Isto é um parágrafo            </p>   <a>                 Isto é um link                      </a>
  • 26. Sintaxe dos elementos HTML Um elemento HTML inicia com a tag inicial. Um elemento HTML termina com a tag final. O conteúdo do elemento será tudo que estiver entre a tag inicial e a tag final.
  • 27. Sintaxe dos elementos HTML Alguns elementos HTML tem conteúdo vazio. Elementos vazios são fechados na tag inicial. A maioria dos elementos HTML podem ter atributos.
  • 28. Elementos HTML aninhados A maioria dos elementos HTML podem ser aninhados, ou seja, podem conter outros elementos HTML. Documentos HTML consistem de aninhamentos de elementos HTML.
  • 29. Exemplo de documento HTML <html>    <body>        <p>Meu primeiro parágrafo.</p>    </body> </html>
  • 30. O elemento <p> O elemento <p> define um parágrafo no documento HTML. O elemento tem uma tag inicial <p> e uma tag final </p>. O conteúdo do elemento é: Meu primeiro parágrafo.
  • 31. O elemento <body> O elemento <body> define o corpo do documento HTML. O elemento tem uma tag inicial <body> e uma tag final </body>. O conteúdo do elemento é outro elemento HTML, um elemento <p>.
  • 32. O elemento <html> O elemento <html> define o todo do documento HTML. O elemento tem uma tag inicial <html> e uma tag final </html>. O conteúdo do elemento é outro elemento HTML, um elemento <body>.
  • 33. Elementos HTML vazios Elementos HTML sem conteúdo são chamados de elementos vazios. <br> é um elemento vazio sem uma tag final. A tag <br> define uma quebra de linha.
  • 34. Dica: use sempre minúsculas HTML não é case sensitive. <P> significa o mesmo que <p>. Muitos web sites usam maiúsculas nas tags HTML. O W3C recomenda o uso de tags em minúsculas.
  • 35. Atributos HTML Elementos HTML podem ter atributos. Atributos fornecem informação adicional sobre um elemento. Atributos são sempre especificados na tag inicial. Atributos vem em pares como name=&quot;value&quot;.
  • 36. Exemplo de Atributos HTML Links HTML são definidos pela tag <a>. O endereço do link é especificado no atributo href. <a href=&quot;http://www.meusite.com.br&quot;>Isto é um link</a>
  • 37. Valor de atributos entre aspas Valor de atributos devem sempre estar entre aspas. Aspas duplas são o mais comum em HTML, mas aspas simples também são permitidas.
  • 38. Dica: use atributos em minúsculas Nomes de atributos e valores de atributos são case sensitive. O W3C recomenda usar minúsculas desde o HTML4.
  • 39. Referência de atributos HTML Alguns atributos que são padrão na maioria dos elementos HTML. Atributo            Valor            Descrição   class                classname    especifica a classname                                             do elemento id                     id                  especifica o unique id                                                do elemento
  • 40. Dúvidas ?   ?                ?     ?            ?                ?          ?            ?                ?                ?    

×