Compartilhe
Ir em baixo
avatar
Membro Fundador
Fundador
Almirante
Santos Manchester City Dead Island Bando do Barba Negra
Ranking Geral: 1° Lugar Ranking PvP: 1° Lugar Ranking Stats: 1° Lugar Ranking Grupos: 1° Lugar
Brasil Google Chrome Masculino
Alcunha : Soco Vermelho
Reputação : 75
Cash : 6072
Data de inscrição : 02/07/2012
Mensagens : 3870
Idade : 25
Aproveitador
100 %
  • 0
Em Curso
em Qua 22 Maio 2013 - 16:36
Ver perfil do usuáriohttp://www.somosmugiwara.comhttp://www.somosmugiwara.com/
Bem, estou aqui para ajudar os membros que queiram aprender HTML.

Exemplo de página HTML:

http://somosmugiwara.forumeiros.com/

Bem, vamos lá, leiam com bastante atenção:

Aula 1



O que é o HTML?
HTML significa ‘HyperText Markup Language’, e é uma linguagem universal destinada à elaboração de páginas com hiper-texto, como o nome indica. O conceito de hiper-texto é bastante simples: Certos itens de um documento contêm uma ligação a outra zona do mesmo documento ou, como é mais vulgar, a outros documentos.
A principal aplicação do HTML é a criação de páginas na Web, e convém esclarecer que não se trata de uma linguagem de programação. De facto, o HTML é antes uma espécie de linguagem de formatação, um ficheiro de texto que é formatado através de uma série de comandos – ‘tags’.

As bases do HTML.
Antes de mais, importa esclarecer que para a criação de uma página em HTML não é necessário nenhum software especial. Se bem que existam programas especializados, o Notepad do Windows ou mesmo o Edit do MS-DOS são mais que suficientes para a criação de uma página.

Como disse no Capítulo I, o HTML consiste em texto formatado por ‘tags’. Embora existam várias dezenas destes ‘tags’, apenas uma pequena parte destes é utilizada normalmente. Há algumas regras básicas que é necessário compreender antes de se começar com a criação de páginas...


Todos os ‘tags’ são inseridos entre o sinal de menor e maior:
<tag>


Tirando aqueles que representam a posição de um objecto (a inserção de uma imagem, por exemplo), todos os ‘tags’ de formatação devem ser abertos e fechados (utilizando o caracter ‘/’):

<tag> </tag>

Todos os ‘tags’ obedecem a uma hierarquia, como no seguinte exemplo:
<a> <b> <c> </c> </b> </a>


O primeiro a abrir é o último a fechar, e vice-versa.

<a> <b> <c> </a> </b> </c> É ERRADO.

É indiferente utilizar maiúsculas ou minúsculas nos ‘tags’. Nestes tutoriais irei utilizar maiúsculas apenas por uma questão de leitura.
<tag> é igual a <TAG> e a <Tag>

Todas as páginas em HTML são identificadas pelo ‘tag’ <HTML>, que terá obrigatóriamente que estar no início. Obviamente, qualquer página irá acabar com </HTML>.
<HTML>
.
.
.
</HTML>

Todas as páginas em HTML contêm duas partes: Aquela definida por <HEAD>, e que contém todas as informações do cabeçalho da página; Outra parte definida por <BODY>, contém quase tudo aquilo que iremos ver realmente na nossa página.

<HTML>
<HEAD>
.
.
</HEAD>
<BODY>
.
.
</BODY>
</HTML>

Uma primeira página
Para criarmos a nossa primeira página em HTML, como já disse no capítulo anterior, basta qualquer simples editor de texto, como o Notepad. Podemos começar por inserir o seguinte:

<HTML>

<HEAD>
<TITLE>A minha primeira página</TITLE>
</HEAD>

<BODY>
</BODY>

</HTML>


Dica:
Devemos criar uma pasta nova no nosso disco para conter a página, e devemos gravar o nosso ficheiro de texto como 'index.htm'. Porquê? Quando a página está a ser visualizada no nosso disco, é indiferente, mas nos servidores onde são alojadas as páginas na Internet, a página inicial por defeito chama-se index.html ou index.htm.

Se visualizarmos a página que acabámos de criar num browser (programa que permita navegar na internet, por ex. IExplorer), teremos qualquer coisa como isto:



Que conclusão podemos tirar? O texto que aparece como título da janela é definido pelo ‘tag’ <TITLE>, que surge sempre na área correspondente ao cabeçalho da página (<HEAD>).

Vamos agora fazer a seguinte alteração:
<HTML>
<HEAD>
<TITLE>A minha primeira página</TITLE>
</HEAD>
<BODY>
Olá mundo!
</BODY>
</HTML>

Iremos obter o seguinte resultado:



Como já disse antes, a área definida pelo ‘tag’ <BODY> é aquela onde reside quase todo o conteúdo visível de uma página. Vamos concentrar-nos nesta área.
Comecemos por acrescentar uma frase:

<BODY>
Olá mundo!

Chamo-me Eduardo.
</BODY>


Inesperadamente, o resultado obtido será o seguinte:



Convém então esclarecer algo: Em HTML, os espaçamentos e mudanças de linha processam-se de um modo algo diferente. Todo o texto é interpretado continuamente, e na verdade é possível que todo o HTML de uma página esteja numa única linha. Os espaços, tal como neste tutorial, apenas servem para tornar o código mais legível a quem o cria. Vamos introduzir o seguinte ‘tag’:
<BODY>
Olá mundo!
<BR>
Chamo-me Eduardo.
</BODY>


Este <BR> (de Break) dá instruções ao browser para fazer uma mudança de linha. Assim, o resultado deverá ser este:



Bem, amanhã postarei a continuação desta aula, mas já podem começar a praticar.


Créditos à Truques e Dicas
avatar
Membro Nível 5
Membro
Civil
São Paulo Real Madri Sem Game Preferido Bando do Barba Negra
Ranking Geral: Não Ranqueado Ranking PvP: Não Ranqueado Ranking Stats: Não Ranqueado Ranking Grupos: Não Ranqueado
Brasil Google Chrome Masculino
Reputação : 16
Cash : 1319
Data de inscrição : 18/05/2013
Mensagens : 58
Sem Emoção
100 %
  • 0
Em Curso
em Seg 2 Set 2013 - 12:32
Ver perfil do usuáriohttp://somosmugiwara.forumeiros.com/
Vlw Connor ajudou muito...
avatar
Membro Fundador
Fundador
Almirante
Santos Manchester City Dead Island Bando do Barba Negra
Ranking Geral: 1° Lugar Ranking PvP: 1° Lugar Ranking Stats: 1° Lugar Ranking Grupos: 1° Lugar
Brasil Google Chrome Masculino
Alcunha : Soco Vermelho
Reputação : 75
Cash : 6072
Data de inscrição : 02/07/2012
Mensagens : 3870
Idade : 25
Aproveitador
100 %
  • 0
Em Curso
em Seg 2 Set 2013 - 17:53
Ver perfil do usuáriohttp://www.somosmugiwara.comhttp://www.somosmugiwara.com/
De nada cara, ainda pretendo seguir com estes tutoriais, mais será um projeto mais para frente...

Fuck Yea 
Conteúdo patrocinado
  • 0
Em Curso
Voltar ao Topo
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum