HTML explicado!

02/07/2022 23:33

Renê Arruda

Renê Arruda

Brasil

HTML explicado!

Este artigo trata de uma resumo em html, literalmente, onde tento mostrar em código com comentários em meu primeiro arquivo html, o que seria cada item. A ideia é que esse artigo possa ficar cada vez maior, com adição de CSS em código para o mesmo código descrito a abaixo, assim como melhorias, ou que os colegas possam opnar sobre o mesmo afim de melhorar.

<!DOCTYPE html>

<html lang="pt-BR"> <!--Aqui deixo meu comentário... a tag html indica o ínicio do arquivo!-->

<head> <!--Aqui onde fica as informações que serão lidas pelo browser!-->

    <meta charset="utf-8">

    <title>Renê Sousa Arruda</title>

    <link rel="stylesheet" href="style.css">

</head>

<!--ISSO AQUI É UM COMENTÁRIO DIVIDINDO O CORPO DO ARQUIVO HTML, NÃO TERÁ EFEITO NO CÓDIGO!!-->

<body>

    <header>

        <img src="html1.jpg" alt="foto html" class="post_image1">

        <h1 id="title">HTML Explicado</h1>

    </header>

<section>

        <header>

            <h2 class="subtitle">HMTL5</h2>

        </header>

    <article class="post">

        <header>

            <h3 class="post_title">Aqui vc vai aprender mais sobre a tag a</h3>

            <img src="html2.jpg" alt="foto html2" class="post_image2"> <!-- para imagem, segue o padrão com endereço da imagem após "src", se local, apenas nome da image com tipo de arquivo ou nao funciona, seguido de "alt", e descrição da imagem, caso por alguma motivo a mesma nao apareça, sendo então apresentado a descrição. Se for necessário descrever a image, usa-se a tag <p> e descreva a mesma!-->

        </header>

        <p class="post_content">Aqui podemos usar a tag a (âncora) como links para <a href= "mailto:renarruda1@hotmail.com" target="_blank">email</a> assim como, para links externos de sites, como o <a href="https://www.linkedin.com/in/ren%C3%AA-arruda-7568b928/" target="_blank">linkedin</a>. Mas preste atenção, após o endereço para redirecionar para outra página precisamos adicionar o "target="_blank"" logo após o email ou link. Veja o código html! Entre as tags a, você pode por o texto que servirá como link para o endereço externo, seja email ou sites!</p>

    </article>

</section>

<footer>

    <ul class="contacts_list">

        <li>

            <a href="mailto:renarruda1@hotmail.com" target="_blank">renarruda1@hotmail.com</a> <!--a tag "a" é onde colocamos os hiperlinks, como email e endereços externos. Email antecedido de mailto:o email aqui, e link externo com endereço completo, seguido de target="_blank" para abrir em outra página!-->

        </li>

        <li>

            <a href="https://www.linkedin.com/in/ren%C3%AA-arruda-7568b928/" target="_blank">linkedin</a>

        </li>

        <li>

            <a href="https://github.com/renarruda" target="_blank">GitHub</a>

        </li>

    </ul>

</footer>

</body>

</html>

<!--lembre-se, também dá para desativar parte do código apenas comentando o mesmo!-->

Faça parte da nossa comunidade!

Domine as tecnologias utilizadas pelas empresas mais inovadoras do mundo e encare seu novo desafio profissional, evoluindo em comunidade com os melhores experts.

0

Certificado

Artigo relacionado

Comentários

    Nenhum comentário