Meu primeiro HTML - Parte 2



Este post é continuação da Parte 1. Aqui o objetivo é demonstrar alguns elementos estruturais e de formatação do HTML.

Você pode iniciar um novo arquivo para copiar e colar o código abaixo ou apenas atualize o arquivo do exercício parte 1, adicionando as novas informações. Lembre-se de salvar com nome em minúsculo, sem acento ou caractere especial, espaço e com a extensão .html ou .htm.

As diferenças com relação à primeira parte, são:

Inclusão do texto dentro dos elementos <body></body>

O HTML significa HyperText Mark up Language (Linguagem de Marcação de HiperTexto). Ele determina a estrutura de um documento web e possibilita a publicação de conteúdo estático.Para conteúdo dinâmico, que possibilita interação do usuário e consulta à uma base de dados, existem outras linguagens: PHP, Java, DotNet, dentre outros.
Para estudar sobre o assunto, visite a página da W3Schools.

Inclusão de novos elementos para melhorar a estrutura do HTML para visualização no navegador

<h1></h1> - Indica o título do texto. O h1 (heading 1) é o principal e pode ir até o h6, assim diminuindo a ordem de importância dos subtítulos.
<p></p> - Delimita um parágrafo de texto.
<ul></ul> - Indica uma lista não ordenada, ou seja, apresentam os itens com uma marcação de pontos. O ul (unordered list) delimita um grupo de itens. Para lista cada item, é necessário colocá-los entre <li></li>
<a></a> - Ativa um link. Para funcionar este link é necessário colocar o atributo href cujo valor será a URL (endereço único da localização da página web). Exemplo: <a href="http://www.w3schools.com" target="_blank">W3Schools.</a>

Código:

<!DOCTYPE HTML>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title>Aula sobre HTML</title>
</head>
<body>
<h1> Aula sobre HTML</h1>
<p>O HTML significa HyperText Mark up Language (Linguagem de Marcação de HiperTexto). Ele determina a estrutura de um documento web e possibilita a publicação de conteúdo estático.</p>
<p>Para conteúdo dinâmico, que possibilita interação do usuário e consulta à uma base de dados, existem outras linguagens:
<ul>
<li>PHP,</li>
<li> Java,</li>
<li> DotNet, dentre outros.</li>
</ul>
</p>
<p>Para estudar sobre o assunto, visite a página da <a href="http://www.w3schools.com" target="_blank">W3Schools.</a></p>
</body>
</html>
view raw gistfile1.txt hosted with ❤ by GitHub





Para visualizar sua página, abra seu arquivo HTML em um navegador (Ex: Chrome, Firefox, Internet Explorer, Opera ou Safari)

ConversionConversão EmoticonEmoticon

:)
:(
=(
^_^
:D
=D
=)D
|o|
@@,
;)
:-bd
:-d
:p
:ng