Eita mano to começando a pega o geito de criar paginas XD
qm sabe um dia nao faço um site
nao e muito dificil pega o geito o dificil e grava as tags =P
8
310
info
Grupo: Campones
Registrado: 25/05/06
Posts: 16
Reputação: 0
Char no Tibia: Axdrubal
20 de setembro de 2007 às 22:02
info
Grupo: Cavaleiro
Registrado: 02/11/05
Posts: 179
Reputação: 0
Char no Tibia: Dehby Dias, Hacked
23 de setembro de 2007 às 14:46
Eita mano to começando a pega o geito de criar paginas XDqm sabe um dia nao faço um site
nao e muito dificil pega o geito o dificil e grava as tags =P
Concordo mano, o fodah eh grava tags, o resto com u tempo bem a pratica
info
Grupo: Campones
Registrado: 20/02/07
Posts: 19
Reputação: 0
Char no Tibia: Esse que você pensou =]
24 de setembro de 2007 às 17:20
Mano muito bom ^^
APROVADO E MERECE FIXO ;D
24 de setembro de 2007 às 21:16
<h4 align=left> Título À Esquerda<h4>
não seria
<h4 align=left> Título À Esquerda</h4>
??
info
Grupo: Cavaleiro
Registrado: 03/08/05
Posts: 184
Reputação: +5
24 de setembro de 2007 às 23:09
Wyrm,
Que bom que você notou o erro, já arrumei.
Obrigado.
25 de setembro de 2007 às 18:34
Bom muito bom mesmo
info
Grupo: Cavaleiro
Registrado: 03/08/05
Posts: 184
Reputação: +5
Toda vez que você acessar um site (veja tópico Word Wide Web) por meios de domínios quando adiciona a URL na barra de endereço, do seu Navegador (Browser), você verá páginas na WEB bem dinâmicas, organizadas, animadas e com ela trazendo informações, imagens, sons, vídeos e etc.
Então, você deve se perguntar. Como é feito? Como elas se propagam? Todas estas páginas possuem um código fonte escrito numa linguagem chamada HTML (Hyper Text Markup Language).
Este tutorial tem por objetivo mostrá-lo como criar e exibir páginas HTML, como as que você ver através da WEB. Tais páginas são criadas a partir de arquivos texto ASCII, contendo caracteres de marcação da linguagem HTML. Uma vez criados, estes arquivos são salvos com uma extensão .html.
Então, entendido novamente mais uma etapa, vamos iniciar o curso de verdade. A cada exemplo você deverá salvar seu arquivo com a extensão html. Certo ?
HIERARQUIA DE ELEMENTOS
Primeiramente, gostaria de lembrar-lhe como citei a linhas acima, que existem vários editores de Home Pages, como por exemplo: o Front Page Express, Netscape Composer, Home Site, etc. Só que na ausência destes aplicativos e você desconhecendo a Linguagem de HyperTextos, HTML, não poderia criar suas páginas. Daí a importância de se conhecer esta linguagem. Entendeu?
Muito bem, é para estudarmos HTML, usaremos o já conhecido Bloco de Notas e um Browser (Internet Explorer ou Netscape). Para nossos exemplos usarei o Internet Explorer. Tudo Bem? Vamos nessa!
A estrutura básicas de uma página HTML é mostrada na listagem 1.1. Observe que a construção de páginas exigir o uso de marcadores chamados de “TAGSâ€. Veja agora o uso deles na listagem 1.1
Listagem 1.1
Fim da Listagem 1.1
Com certeza você observou que sempre usei os tags, fazendo demarcação, ou seja, eles sempre estarão ANTES DE ALGUMA COISA E APÓS ALGUMA COISA. Quer mais um exemplo para entender melhor? Tudo bem.
Exemplo: <title>EDITORA ERICA</title>
CONCEITO DOS TAGS USADOS NESTE EXERCÍCIO
TAG O QUE FAZ
<html> Marca o início e o fim do documento HTML. Com ele você inicia e finaliza a construção da página Web.
<head> Marca o início e do fim do cabeçalho, ou seja, a área onde serão descritos cabeçalhos e o título da página
<title> Marca o início e o fim do título do cabeçalho. O título da página aparecerá na barra superior do browser.
<body> Marca o início e o fim do do corpo da página
EXERCÍCIO 1 Vamos praticar?
Bem entendido os conceitos básicos e você mais feliz, vamos criar nossa primeira página.
1º) Abra o Bloco de Notas – Iniciar/Programas/Acessórios/Bloco de Notas
2º) Digite o código da listagem 1.2. Após digitá-lo salve na pasta Meus Documentos ou em outra se preferir com o nome exemplo1.html. Como?
Resposta:
1) Abra o Menu Arquivo e escolha Salvar
2) Na janela que aparecer como mostrar figura 1.1, faça as seguintes tarefas:
2.1) Na opção Salvar em selecione a pasta onde deseja salvar, no caso Meus Documentos
2.2) Na opção Nome do arquivo coloque o nome do arquivo exemplo1.html
2.3) Finalmente clique no botão Salvar.
Figura 1.1
Listagem 1.2
Fim da Listagem 1.2
Para ver o resultado deste exemplo abra o Internet Explorer, e na barra de endereço digite C:\Meus documentos\exemplo1.html. Veja a figura 1.2
O TÍTUO ADICIONADO NA PÁGINA ATRAVÉS DO TAG TITLE
Figura 1.2
Exercício 2 – Vamos aprender mais um pouco?
Em alguns momentos em sua página faz necessário comentar alguns trechos do código para facilitar na leitura e manutenção da página, por isso adicionamos comentários, ou seja, palavras ou frases que não são exibidos no Nevegador, apenas são visto como estamos trabalhando no código fonte.
Na listagem 1.3 faremos um novo exemplo e incrementaremos novos tags. Digite a listagem 1.3 abaixo e salve com o nome exemplo2.html na pasta Meus Documentos.
ï‹ ATENÇÃO: Salve sempre os seus exemplos na pasta Meus Documentos, o processo para salvar é igual ao do Exemplo1, troque apenas o nome do arquivo. Na dúvida veja o exemplo 1. Tudo bem?
Listagem 1.3
Fim da Listagem 1.3
Para ver o resultado deste exemplo abra o Internet Explorer, e na barra de endereço digite C:\Meus documentos\exemplo2.html. Veja a figura 1.3
Figura 1.3
CONCEITO DOS TAGS USADOS NESTE EXERCÍCIO
TAG O QUE FAZ
<!> Insere comentários nas páginas
<meta> Marcas Metas. Servem para você especificar o autor, palavras-chaves, descrição da página, etc..
Dentro do tag<meta>, tem os comandos name e o content. No comando name você especifica que informação você quer dar, e no content você descreve a informação
<hn> Marca um título. Sendo que n representa um valor que pode ser de 1 a 6, o tamanho muda de forma decrescente, ou seja, o número 1 é o maior tamanho do título.
<hr> Insere uma linha horizontal
<p> Marca um parágrafo e acrescenta uma linha em branco.
<br> Insere uma quebra de linha
Agora, que você viu o resultado do exemplo2.html a cada vez mais feliz, por está entendendo esta linguagem, vamos passar para o Exercício 3.
Exercício 3 – TAGS DE ALINHAMENTO
Assim, como num documento comum, há necessidade de melhorar a aparência do documento, e a primeira providência a tomar é cuidar do alinhamento do texto. O Alinhamento padrão que vem configurado nos navegadores, é a esquerda. Para entender isto, digite a listagem 1.4, e salve como exemplo3.html, e acompanhe o conceito de tag que marcam o alinhamento dos títulos e paragráfos nas páginas.
Listagem 1.4
Fim da Listagem 1.4
Para ver o resultado deste exemplo abra o Internet Explorer, e na barra de endereço digite C:\Meus documentos\exemplo3.html. Veja a figura 1.4
Figura 1.4
CONCEITO DOS TAGS USADOS NESTE EXERCÍCIO
TAG O QUE FAZ
<center> Alinha o trecho (texto, imagem ou tabela ao centro>
align=center, right, left ou justify Atribuídos dentro do tag <p> que marca o início de um parágrafo modificam o alinhamento do título.
Center= alinha ao centro
Right = alinha a direita
Left = alinha a esquerda
Justify = faz a justificação do parágrafo.
<blockquote> Adiciona uma margem de cerca de um centímetro
<hr> Atributos
Size = define a altura da linha. Exemplo: <hr size=50>
Width = define a largura da linha horizontal.
Exemplo: <hr width=200>ou <hr width=50%>
Noshade = desenha a linha sem a sombra para dar o efeito de três dimensões. Exemplo: <hr noshade>
Exercício 4 – FORMATAÇÃO DE ESTILOS
Muito bem caro estudante, perceba que a cada exemplo sua página vai melhorando ainda mais sua aparência. Neste exemplo trabalharemos com a formatação das letras bem como cor, tamanho de fonte, estilo, e etc..
Bem, preparado? Vamos lá novamente para mais um estudo!
Para entender isto, digite a listagem 1.5, e salve como exemplo4.html,
Listagem 1.5
Fim da Listagem 1.5
Para ver o resultado deste exemplo abra o Internet Explorer, e na barra de endereço digite C:\Meus documentos\exemplo4.html. Veja a figura 1.5
Figura 1.5
Créditos: gilvan do fórum Acemprol.
Editado Setembro 24 por RaFaX