sábado, 7 de maio de 2011

Como todos já sabem o grande objetivo desse blog é auxiliar os principiantes a criar um blog de sucesso. Pensando nisso resolvi criar esse curso básico de html por dois motivos, o primeiro é que a plataforma blogger  é baseada em html e o segundo é que sempre postamos algum código html aqui  e notamos que as pessoas sentem alguma dificuldade em lidar com eles. Durante o curso básico vocês verão que a linguagem html é simples de ser entendida, mesmo para os que não trabalham com informática e só querem aprender o básico para colocar códigos em seus blogs.


Curso de html – Introdução

A linguagem html (HyperText Markup Language) é a base da internet. Ela é uma linguagem de marcação que é compilada (interpretada) pelo browser de nossos computadores nos possibilitando navegar pela internet com uma interface gráfica amigável. Como já disse os blogs criados na plataforma blogger, como esse, são feitos em html.
Hoje vamos começar aprendendo algumas tags html, que nada mais são que palavras reservadas entre o sinal < e >. Quando o browser lê uma dessas palavras ele sabe que se trata de tags html e executa o que elas estão orientando. Toda tag deve ter um início e um fim para que o browser saiba como lidar com ela. Por exemplo num título você utiliza a tag e fecha ela com a mesma tag com a “/” na segunda tag indicando o final do título do documento. Fique tranquilo, vamos praticar isso no próximo artigo.

Tags HTML:

<html> e </html>
tag que inicia o documento, dizendo que será um tipo de documento HTML e o finaliza.
<body> e </body>
Indica o corpo do documento. O body contém todo o conteúdo que será exibido e finaliza o corpo do seu programa (script). Você pode colocar nesta tag a cor do fundo da página e a cor do texto e dos links, entre outros.
<p> e </p>
Inicia e finaliza um parágrafo.
<head> e </head>
tag que inicia o cabeçalho. Nele você coloca informações sobre o documento (formatações, funções, fundo musical etc). O conteúdo que estiver dentro do <head> geralmente não aparecerá quando sua home page for exibida.
<hX> e </hX>
Inicia um cabeçalho, onde X é o nível de tamanho variando de 1 a 6, onde 1 é o maior e 6 o menor. Finaliza um cabeçalho, o X é igual ao do que inicia esse mesmo cabeçalho.
<title> e </title>
Indica o título do seu documento. Repare o local em que esse título aparece. Indica o final do título (repare que o título começa com <title> e termina com </title>).
<div> e </div>
Coloca o conteúdo, entre as tags, em um quadro. Funciona como parágrafo, mas não forma espaço entre eles.
<img src=”X” width=”Y” height=”Z“>
Insere uma imagem, X é o nome ou diretório da imagem, Y é a largura e Z é a altura.
<br />
Insere uma quebra de linha. É como pressionar o enter.
<center> e </center>
Centraliza o conteúdo.
<a href = “X” target=”_blank”>Y<a>
Cria um hyperlink com o conteúdo; X é o endereço e Y o nome do endereço. O target deve ser adicionado se quiser que abra em uma nova janela.
<a href=”mailto:X“>Y<a>
Insere um hyperlink de e-mail; X é o e-mail.
<ul> e </ul>
Inicia e finaliza uma lista de tópicos não ordenada – com o símbolo ponto (bullet) no início de cada linha.
<ol> e </ol>
Inicia e finaliza uma lista de tópicos ordenada – com as linhas numeradas.
<li> e </li>
Inicia e finaliza cada linha de uma lista de tópicos ordenada e não ordenada.
<b> e </b>, e <strong> e </strong>
Texto em negrito.
<u> e </u>
Texto sublinhado.
<i> e </i>
Texto em itálico.
<sub> e </sub>
Texto subscrito.
<sup> e </sup>
Texto sobrescrito.
<strike> e </strike>
Texto tachado.
<dl> e </dl>
Usadas para listas de definições.
<dt> e </dt>
É um termo da lista de definições.
<dd> e </dd>
É a explicação do termo; aparece como nas listas ordenadas e não ordenadas, mas sem os números ou bullets.
<tr> e </tr>
Inicia e finaliza uma linha de tabela. Você pode adicionar nesta Tag o mesmo que foi adicionado acima (largura, cor etc.) mas a soma das medidas deve ser igual as da tabela.
E aqui finalizamos o primeiro artigo do curso de html. Essa foi somente uma introdução, não se assuste, pois no decorrer do curso iremos utilizar exemplos para demonstrar o funcionamento das principais tags html. Até o próximo artigo!

Nenhum comentário:

Postar um comentário