Skip to main content

Sua Página em HTML

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Título da página</title>
    <style>
        /*AQUI VAI TODO NOSSO CÓDIGO CSS*/
    </style>
</head>
<body>
    <header><!--criando um cabeçalho para nossa página com um menu-->
        <h2>Minha Página</h2>
        <nav><!--vamos criar um menu utilizando listas-->
            <ul>
                <li>Home</li>
                <li>Meu menu</li>
            </ul>
        </nav><!--aqui finaliza o meu menu-->
    </header>
    <main>
        <section><!--vamos criar a primeira section do meu documento-->
            <article>
                <h3>Titulo do meu artigo</h3>
                <p>Conteudo do meu artigo</p>
                <p>Mais conteúdo para o meu artigo</p>
                <ol><!--vamos criar uma lista ordenada-->
                    <li>item 1</li>
                    <li>item 2</li>
                    <li>item 3</li>
                </ol>
            </article><!-- aqui finaliza meu primeiro artigo da section-->
            <article>
                <h3>Titulo do meu segundo artigo</h3>
                <p>Conteudo do meu segundo artigo</p>
                <p>Mais conteúdo para o meu segundo artigo</p>
            </article><!--aqui finaliza meu segundo artigo da section-->
        </section><!--aqui encerra a primeira section do meu documento-->
    </main><!--aqui finaliza todo conteúdo principal do corpo da pagina-->
    <aside>
        <h4>Conteúdos relacionados</h4>
        <ul>
            <li>Página oficial da <a href="https://www.homehost.com.br/">HomeHost</a></li>
            <li>item da lista</li>
            <li>item da lista</li>
        </ul>
    </aside>
    <footer>
        <div><!--criando uma divisão para meu rodapé-->
            <p>Inscreva-se para receber noticias</p>
            <form method="post">
                <input type="text" name="nome" placeholder="Digite seu Nome">
                <input type="email" name="email" placeholder="Digite seu Email">
                <input type="submit" name="enviar" value="Enviar">
            </form>
        </div>
        <div><!--criando outra para meu rodapé-->
            <h3>Minha primeira página html</h3>
            <span>Todos os direitos reservados</span>
        </div>
    </footer>
    <script>
//AQUI VAI NOSSO CÓDIGO DE SCRIPT (JAVASCRIPT)
    </script>
    <body>
</html>


Como resultado final no navegador, teremos:

Como resulatdo final no navegador

 

Minha Página

Titulo do meu artigo

Conteudo do meu artigo

Mais conteúdo para o meu artigo

  1. item 1
  2. item 2
  3. item 3

Titulo do meu segundo artigo

Conteudo do meu segundo artigo

Mais conteúdo para o meu segundo artigo

 

 

Inscreva-se para receber noticias

Minha primeira página html

Todos os direitos reservados