Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Html, Css #19

Open
BigshowBiel opened this issue Dec 22, 2024 · 1 comment
Open

Html, Css #19

BigshowBiel opened this issue Dec 22, 2024 · 1 comment

Comments

@BigshowBiel
Copy link

Html:
!DOCTYPE html>

<title>Treinando Seletores</title>

Controle de Alimentos

  <div class="content"> 
  <h2>Saúdavel</h2> 
  <p>Água: Importante saber que a água é primordial para hidratar o corpo. Ela é a fonte de <b>energia</b> para as células e também é essencial para a manutenção da temperatura corporal.
  Ovo: Não diria que é o alimento mais querido, no entanto é fácil de encontrar e de baixo custo, além de fornecer variadas formas de consumo. Também temos o Café, Aveia, Banana, Oleaginosas, Peixes e Feijão. </p>     
 
<img src="alimentos/vitamina.jfif" ALT="Alimento Limpo" width="400" height="200">
  </div>
</section>

<section id="exemplo">
  <h2>Prejudicial</h2>
  <p> Entram nessa lista os salgadinhos, sorvete, refrigerante, embutidos e achocolatados. A nutricionista infantil Gabriela Kapim, que apresentou o programa “Socorro” meu filho come mal”, no canal a cabo GNT, explica que eles são, na maioria, alimentos <b>ultraprocessados.</b> </p>
  <img src="alimentos/simpons.webp" alt="Exemplo" widht="300" height="200" >
</section>

<section id="exemplo">
  <h2>Consumir Moderadamente</h2>
  <p><li> Granola e barra de cereais. As duas são ótimas opções para o lanchinho entre as refeições! Mesmo assim, fique atento aos rótulos de cada produto.</li>

  • Oleaginosas, como castanhas, nozes, amêndoas e avelãs.
  • Frutas secas ou desidratadas. Ao contrário das consumidas in natura, as frutas secas representam uma fonte mais concentrada de fibras e outros nutrientes. Elas também possuem mais calorias e, por serem menores e mais leves, tendemos a exagerar nas porções.
  • açúcar mascavo. Ele está sempre presente na lista das dietas de emagrecimento! Mesmo assim, esse ingrediente possui quantidades semelhantes de calorias, se comparado ao açúcar refinado. Por isso, é preciso controlar as quantidades ingeridas da mesma forma.
  • light e diet.

  • Exemplo

    © 2024 - Saúde e Bem-estar

    CSS:
    /* Estilo Geral da Página */
    body{
    font-family: sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f0f0f0;
    }

    header {
    background-color: #333;
    color: #fff;
    padding: 20px;
    text-align: center;
    }

    h1{
    font-size: 2.5em;
    margin-bottom: 10px;
    }

    nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }

    nav li{
    display: inline-block;
    margin-right: 20px;
    }

    nav a{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    }

    /* Estilos para seções*/
    main{
    padding: 20px;
    }

    section{
    margin-bottom: 30px;
    }

    h2{
    font-size: 1.8em;
    margin-bottom: 15px;
    }

    p{
    text-align: justify;
    }

    img{
    width: 250px;
    height: 250px;
    object-fit: cover; /* Ajuste proporcional da imagem*/
    margin-bottom: 10px;
    }

    /* Estilo para o rodapé*/
    footer{
    text-align: center;
    padding: 10px;
    background-color: #ddd;

    @BigshowBiel
    Copy link
    Author

    Html

    <title>Treinando Seletores</title>

    Controle de Alimentos

      <div class="content"> 
      <h2>Saúdavel</h2> 
      <p>Água: Importante saber que a água é primordial para hidratar o corpo. Ela é a fonte de <b>energia</b> para as células e também é essencial para a manutenção da temperatura corporal.
      Ovo: Não diria que é o alimento mais querido, no entanto é fácil de encontrar e de baixo custo, além de fornecer variadas formas de consumo. Também temos o Café, Aveia, Banana, Oleaginosas, Peixes e Feijão. </p>     
     
    <img src="alimentos/vitamina.jfif" ALT="Alimento Limpo" width="400" height="200">
      </div>
    </section>
    
    <section id="exemplo">
      <h2>Prejudicial</h2>
      <p> Entram nessa lista os salgadinhos, sorvete, refrigerante, embutidos e achocolatados. A nutricionista infantil Gabriela Kapim, que apresentou o programa “Socorro” meu filho come mal”, no canal a cabo GNT, explica que eles são, na maioria, alimentos <b>ultraprocessados.</b> </p>
      <img src="alimentos/simpons.webp" alt="Exemplo" widht="300" height="200" >
    </section>
    
    <section id="exemplo">
      <h2>Consumir Moderadamente</h2>
      <p><li> Granola e barra de cereais. As duas são ótimas opções para o lanchinho entre as refeições! Mesmo assim, fique atento aos rótulos de cada produto.</li>
    

  • Oleaginosas, como castanhas, nozes, amêndoas e avelãs.
  • Frutas secas ou desidratadas. Ao contrário das consumidas in natura, as frutas secas representam uma fonte mais concentrada de fibras e outros nutrientes. Elas também possuem mais calorias e, por serem menores e mais leves, tendemos a exagerar nas porções.
  • açúcar mascavo. Ele está sempre presente na lista das dietas de emagrecimento! Mesmo assim, esse ingrediente possui quantidades semelhantes de calorias, se comparado ao açúcar refinado. Por isso, é preciso controlar as quantidades ingeridas da mesma forma.
  • light e diet.

  • Exemplo

    © 2024 - Saúde e Bem-estar

    Css
    /* Estilo Geral da Página */
    body{
    font-family: sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f0f0f0;
    }

    header {
    background-color: #333;
    color: #fff;
    padding: 20px;
    text-align: center;
    }

    h1{
    font-size: 2.5em;
    margin-bottom: 10px;
    }

    nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }

    nav li{
    display: inline-block;
    margin-right: 20px;
    }

    nav a{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    }

    /* Estilos para seções*/
    main{
    padding: 20px;
    }

    section{
    margin-bottom: 30px;
    }

    h2{
    font-size: 1.8em;
    margin-bottom: 15px;
    }

    p{
    text-align: justify;
    }

    img{
    width: 250px;
    height: 250px;
    object-fit: cover; /* Ajuste proporcional da imagem*/
    margin-bottom: 10px;
    }

    /* Estilo para o rodapé*/
    footer{
    text-align: center;
    padding: 10px;
    background-color: #ddd;

    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
    Labels
    None yet
    Projects
    None yet
    Development

    No branches or pull requests

    1 participant