Criar projetos java script html

CRIAR LIVRO JAVA SCRIPT.

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Meu Livro JavaScript</title>

    <style>

        /* Estilos para a capa do livro */

        #capa {

            display: block; /* Inicialmente visível */

        }


        /* Estilos para o conteúdo do livro */

        #conteudo {

            display: none; /* Inicialmente oculto */

        }

    </style>

</head>

<body>


    <div id="capa">

        <h1>Meu Livro JavaScript</h1>

        <p>Pressione o botão para abrir o livro.</p>

        <button onclick="abrirLivro()">Abrir Livro</button>

    </div>


    <div id="conteudo">

        <h2>Capítulo 1: Introdução ao JavaScript</h2>

        <p>Este é o conteúdo do livro...</p>

        <button onclick="fecharLivro()">Fechar Livro</button>

    </div>


    <script>

        // Função para abrir o livro (tornando a capa invisível e o conteúdo visível)

        function abrirLivro() {

            document.getElementById('capa').style.display = 'none';

            document.getElementById('conteudo').style.display = 'block';

        }


        // Função para fechar o livro (tornando a capa visível e o conteúdo invisível)

        function fecharLivro() {

            document.getElementById('capa').style.display = 'block';

            document.getElementById('conteudo').style.display = 'none';

        }

    </script>


</body>

</html>