Você está na página 1de 2

Aula Bsica de HTML

Postado por Gui Loureiro On 09:20 O texto abaixo foi escrito pelo leitor Anderson Almeida e uma utilidade pblica, principalmente para aqueles que querem blogar! Aula bsica de HTML 1Parte da Aula HTML bsico Definio: HTML (acrnimo para a expresso inglesa HyperText Markup Language, que significa Linguagem de Marcao de Hipertexto) uma linguagem de marcao utilizada para produzir pginas na Web (definio retirada do wikipedia). Para que o tutorial no fique muito extenso vamos comear pela estrutura da programao. <html> <head> <title>Titulo do site</title> </head> <body> Textos,imagens,videos e etc... </body> <html> Cada uma dessas chaves, so denominadas tags ou etiquetas, elas definem tudo (praticamente) na programao do html, como por exemplo a cor, tamanho e estilo de letras! Definies: <html></html>: Essa tags mostram que a linguagem que estamos usando o html. <head></head>: Cabeaonde fica o titulo e o javascript e at mesmo o css. <title></title>: Essa tags definem o titulo. Barra de titulo do navegador. <body></body>: Dentro dessa tags ficam tudo que o usuario v! (imagens, videos, textos). Como pode ver h duas tags uma que abre e outra que fecha (a que possui a / ). No html isso muito importante, se voc se esquecer de fechar alguma tag toda a pgina pode ser afetada. O html pode ser editado em qualquer editor de texto, como por exemplo o bloco de notas do windows. Primeira pagina: 1 abra o bloco de notas e depois copie esse cdigo (aconselho que digite manualmente para pegar prtica). <html> <head> <title>Titulo do site</title> </head> <body> Textos, imagens, vdeos e etc... </body> <html> 2Salve esse arquivo no desktop com a exteno .html 3 Execute esse arquivo. Parabns! A sua primeira pgina j est pronta. 2a Parte da Aula html bsico Agora vamos conhecer algumas tags. <hr> Desenha uma linha horizontal de um limite ao outro (essa tag no precisa ser fechada). <br> Quebra de linha. Pula de uma linha para outra (essa tag no precisa ser fechada). <img> Mostra uma imagen na pgina (essa tag no precisa ser fechada). <a></a> Cria um link na pgina. <font></font> Defina atribuies para textos. <table></table> Cria uma tabela na pgina. *Existe uma gama enorme de tags e no ficamos restritos somente a essas acima, porm essas so

fundamentais para comear. Conhecendo as atribuies para tags. <a rel="nofollow" onclick="javascript: pageTracker._trackPageview('/outgoing/article_exit_link');" href=link></a>A atribuio href atribui o link da pagina que quer direcionar. Exemplo: rel="nofollow" onclick="javascript:pageTracker._trackPageview('/outgoing/article_exit_link');" href=http://www.google.com.br ou simplesmente rel="nofollow" onclick="javascript:pageTracker._trackPageview('/outgoing/article_exit_link');" href=pagina-deimagens.html. <img src=caminho-da-imagem height= vertical width= horizontal alt=texto-opional> Src: Define o caminho da imagem como por exemplo img/imagen.gif. Height: Define o tamanho vertical da imagem em pixels por exemplo 300. Width: Define o tamanho horizontal da imagem em pixel por exemplo 100. Alt: Define um texto opcional caso falhe o carregamento da imagem. Ou mostra um texto quado o usurio deixa o mouse parado em cima da imagen como por exemplo foto. <font color=cor size=tamanho face=fonte da letra></font> Color: Define cor da letra. Pode ser feito atraves do nome da cor em ingls como red, yellow, blue ou cores hexadecimais #ffffff(branco), #000000(preto), #ff0000(vermelho). Face: Define a fonte da letra como por exemplo arial, monotype corsival... Size: Define o tamanho da letra em pixels como por exemplo 10. <h1></h1> <h2></h2> Esses entre outros so padres de formatao essas tags formato o texto que estiver dentro delas. Para comear se voc entender tudo isso que est acima voc j pode comear a escrever sua primeira pagina. No fique copiando cdigos prontos tente digitar para pegar prtica. Primeira pagina de teste: <html> <head> <title>Hackers da Hora-2009 </title> </head> <body> <center><h1>Hackers da Hora-2009</h1></center><br> <p>Aqui pode ficar um texto qualquer; ou qualquer imagem ou video que quiser colocar na pagina de html porm tem que ver o que o html suporta e o que o html no suporta. J estamos fazendo tutorial de javascript e de css para melhorar a ilustrao de como fazer um bom site!</p> <h1><blink><font color=red><center>Hackers da hora-2009</center></font></blink></h1> </body> </html> Salve o cdigo acima no bloco de notas com a extenso .html e execute para ver o resultado. Dica: No possivel dar mais de um espao no html a no ser que voc use o caracter especial &nbsp; sem aspas. At a prxima Anderson Almeida.

Você também pode gostar