Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Projeto] Lista de exercícios

Por ser meu primeiro projeto ñ tenho em mente o que criar, como gosto de culinária usei um site de receitas como modelo...vamos ver se fica igual! Acho que ñ estou entendendo como criar e nomear um projeto no VSCode...ao renomear as fotos tbém ñ deu certo, então essa foi a única opção que encontrei.

<!DOCTYPE html>
<html>

    <head>

        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <title>Sequilhos</title>

    </head>

    <body>

        <h1>Sequilhos de leite condensado</h1>

        <p>Sequilhos de leite condensado para um delicioso chá da tarde, com gostinho de infância que derrete na boca.</p>

        <ul style="list-style-type:square">
            <li>Rendimento: 70 unidades</li>
            <li>Tempo: 40 min.</li>
        </ul>

        <h2>Ingredientes</h2>

        <ul>
            <li>500 g. de amido de milho Maizena</li>
            <li>1 lata de leite condensado</li>
            <li>200 g. de manteiga sem sal em temperatura ambiente</li>
        </ul>

        <h2>Modo de preparo</h2>

        <ol>
            <li>Reúna todos os ingredientes;</li>
            <img src="exercicio1.index.png" alt="Sequilhos 1">

            <li>Em um recipiente, misture a manteiga no leite condensado;</li>
            <img src="exercicio2.index.png" alt="Sequilhos 2">
       
            <li>Assim que a massa estiver bem incorporada, vá acrescentando o amido de milho aos poucos, sempre mexendo bem;</li>
            <img src="exercicio3.index.png" alt="Sequilhos 3">

            <li>Quando a massa começar a ficar mais consistente, use as mãos e misture até que desgrude;</li>
            <img src="exercicio4.index.png" alt="Sequilhos 4">
       
            <li>Faça pequenas bolinhas de massa, usando as mãos, e dê uma leve achatada;</li>
            <img src="exercicio5.index.png" alt="Sequilhos 5">
   
            <li>Coloque em uma assadeira e, utilizando um garfo, pressione levemente para decorar. Leve ao forno preaquecido a 200 ºC por cerca de 15 minutos;</li>
            <img src="exercicio6.index.png" alt="Sequilhos 6">
       
            <li>Está pronto! Sirva e aproveite.</li>
            <img src="exercicio7.index.png" alt="Sequilhos 7">
        </ol>

        <p>Bom apetite!</p>

    
        <p>Fonte: https://www.receiteria.com.br/receita/sequilhos/</p>
      
    </body>

</html>
2 respostas
solução!

Oi Christina, tudo bem?

Que legal que você está se aventurando no seu primeiro projeto! Usar um site de receitas como modelo é uma ótima ideia!

Para nomear um pvrojeto VsCode. Você pode seguir esses passos:

  1. Primeiro, você pode criar uma pasta em um caminho da sua escolha, por exemplo, em Meus Documentos, com o nome projeto-receitas

  2. Em seguida, abra o Visual Studio Code.

  3. Vá até o menu File > Open Folder... e selecione a pasta criada. Por exemplo, em Meus Documentos, selecione projeto-receitas.

    captura de tela do vscode. Há o numeral 1 em File e o numeral 2 em Open Folder

    Será aberto o explorador de arquivos para escolher a pasta que você criou anteriormente.

    capturta de tela do explorador de arquivos. Ele está em Meus Documentos, simbolizado pelo numero 1 e está selecionada a pasta projeto receita, simbolizado pelo numero 2 e por fim numero 3 está em selecionar pasta

  4. Dentro dessa pasta, crie um novo arquivo HTML. Clique com o botão direito na pasta do projeto no painel lateral e selecione New File. Nomeie o arquivo como index.html.

    captura de tela do new file da pasta projeto-receitas

Para renomear as fotos, você pode seguir os passos abaixo:

  1. Navegue até a pasta onde suas imagens estão armazenadas.
  2. Clique com o botão direito na imagem e selecione Rename. Dê um nome descritivo, como sequilhos1.png, sequilhos2.png, etc.

Depois de renomear as imagens, é necessário atualizar os caminhos no seu código HTML. Por exemplo:

<img src="imagens/sequilhos1.png" alt="Sequilhos 1">
<img src="imagens/sequilhos2.png" alt="Sequilhos 2">
<!-- Continue para as outras imagens -->

Espero ter ajudado.

Qualquer dúvida, compartilhe no fórum.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

Oi Monalisa!

Muito obrigada pelo feedback!!

Eu estava tentando criar outro arquivo html dentro da pasta portifólio, por isso dava erro...rs. Agora meu VSCode ficou bem organizado. Ainda tdo aqui é novidade para mim...provavelmente cometerei muitas gafes, mas serei persistente.

Abraços!