Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Aula Básica de HTML

    Enviado por

    yankeeee
    37 visualizações2 páginas

    Título original

    Aula básica de HTML

    Direitos autorais

    © Attribution Non-Commercial (BY-NC)

    Formatos disponíveis

    DOCX, PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato DOCX, PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    37 visualizações2 páginas

    Aula Básica de HTML

    Enviado por

    yankeeee

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato DOCX, PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 2

    c 

     

    
     c  

    Definição: HTML (acrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma
    linguagem de marcação utilizada para produzir páginas na Web (definição retirada do wikipedia).

    Para que o tutorial não fique muito extenso vamos começar pela estrutura da programação.
    <html>
    <head>
    <title>Titulo do site</title>
    </head>
    <body>

    Textos,imagens,videos e etc...
    </body>
    <html>

    Cada uma dessas chaves, são denominadas tags ou etiquetas, elas definem tudo (praticamente) na programação do html, como por exemplo a
    cor, tamanho e estilo de letras!

    Definições:

    <html></html>: Essa tags mostram que a linguagem que estamos usando é o html.
    <head></head>: µCabeçaµonde 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 página pode ser afetada. O html pode ser editado em qualquer editor de texto, como por exemplo o bloco de notas do
    windows.

    
    

    1° abra o bloco de notas e depois copie esse código (aconselho que digite manualmente para pegar prática).
    <html>
    <head>
    <title>Titulo do site</title>
    </head>
    <body>
    Textos, imagens, vídeos e etc...
    </body>
    <html>

    2°Salve esse arquivo no desktop com a extenção .html

    3° Execute esse arquivo.

    Parabéns! A sua primeira página já está pronta.

    
     c 

    Agora vamos conhecer algumas tags.

    <hr> Desenha uma linha horizontal de um limite ao outro (essa tag não precisa ser fechada).
    <br> Quebra de linha. Pula de uma linha para outra (essa tag não precisa ser fechada).
    <img> Mostra uma imagen na página (essa tag não precisa ser fechada).
    <a></a> Cria um link na página.
    <font></font> Defina atribuições para textos.
    <table></table> Cria uma tabela na página.

    *Existe uma gama enorme de tags e não ficamos restritos somente a essas acima, porém essas são fundamentais para começar.

    Conhecendo as atribuições para tags.

    <a rel="nofollow" onclick="javascript:


    pageTracker._trackPageview('/outgoing/article_exit_link');" href=µlinkµ></a>A atribuição 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-de-imagens.htmlµ.
    <img src=µcaminho-da-imagemµ height=µ verticalµ width=µ horizontalµ alt=µtexto-opçionalµ>
    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 usuário 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 inglês 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 são padrões de formatação essas tags formatão o texto que estiver dentro delas.
    Para começar se você entender tudo isso que está acima você já pode começar a escrever sua primeira pagina. Não fique copiando códigos
    prontos tente digitar para pegar prática.
    
    
    
    
    

    <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 porém tem que ver o que o html
    suporta e o que o html não suporta. Já estamos fazendo tutorial de javascript e de css para melhorar a ilustração 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 código acima no bloco de notas com a extensão .html e execute para ver o resultado.
    Dica: Não é possivel dar mais de um espaço no html a não ser que você use o caracter especial ´&nbsp;µ sem aspas.

    Você também pode gostar