HTML Será que esse desafio em html está correto dessa forma ?

Eli Almeida · 19 de janeiro

Fiz desse jeito :

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> Mensagens</title>
</head>
<body>
    <h1>Desafios das Mensagens</h1>
    <p>* Um <br>
     ** Dois<br>
     *** Três<br>
     **** Quatro</p>
    <p> **** Quatro <br>
     *** Três <br>
     ** Dois <br>
     * Um</p>
</body>
</html>

DiF · 19 de janeiro

@Eli Almeida Completamente errado.

NO enunciado fica claro e evitdente que ele pede que não use "vários" " "

No seu código, você usou 6 elementos

Além disso, no enunciado não diz nada a respeito de não poder usar CSS para fazer algo... então eu faria deste modo:

<!DOCTYPE html>

<html lang="pt-br">

<head>

    <meta charset="UTF-8">

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

    <title> Mensagens</title>
  <style type="text/css">
  
   p{
  line-height: 1px;  
}


body > p:nth-child(5){
  margin-bottom: 30px;
}

    
  </style>

</head>

<body>

    <h1>Desafios das Mensagens</h1>

<p>* Um </p>
<p> ** Dois</p>
<p> *** Três</p>
<p>**** Quatro</p>
<p> **** Quatro </p>
<p> *** Três </p>
<p>** Dois </p>
<p> * Um</p>

</body>

</html>

Claro, você pode remover a regra do body:nth-child e colocar um entre os dois " quatros" ali.

47 minutos atrás, Eli Almeida disse:

Você deve criar um código HTML que use apenas parágrafos e quebra de linhas

Então... parágrafos e quebra de linhas.......... ele colocou no plural. Ou seja, cada linha de texto, é um parágrafo.

No seu código, você fez o contrário... colocou 2 parágrafos contendo os textos, e várias quebra de linhas.

Veja o exemplo online: https://jsfiddle.net/dife/ugjp4605/

Eli Almeida · 20 de janeiro

@DiF , obrigada. Acabei de entrar no assunto de html, só vi umas três tags mais ou menos, não vi nada ainda de css. Não sei qual é a melhor maneira de resolver essa questão.

Vi um tutorial e resolveram dessa maneira também:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mensagens</title>
    <style>
        div {
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
    <h1>Desafios das Mensagens</h1>
    * Um 
    <br>
    ** Dois
    <br>
    *** Três
    <br>
    <div> **** Quatro </div>
    **** Quatro
    <br>
    *** Três 
    <br>
    ** Dois 
    <br>
    * Um
</body>
</html>

DiF · 20 de janeiro

@Eli Almeida Esta é uma maneira de fazer, mas está errada. Muitas coisas sempre, tem N formas de resolver... Geralmente não podemos dizer que uma é certa ou errada, por conta disso.. que tem N maneiras... MAS, o enunciado foi bastante especifico, pois era um desafio.

NO enunciado, diz para fazer com "parágrafos(elemento ) e quebra de linha (elemento )", logo, usar o elemento <div> está fora de cogitação, também foi dito " nada de usar vários BRs"... nesta solução foi usada 6 elementos , o que torna errado também, além disso, não foi usado nenhum elemento de parágrafo.

Não digo e nem afirmo que a solução que eu apresentei é a verdade absoluta, mas ao meu ver é a que mais se aproxima do objetivo do enunciado do exercício. Afinal, eu usei apenas parágrafos. O CSS usado, foi somente para dar espaçamento entre os elementos, é só pura estética.. como eu disse anteriormente, bastaria remover a regra do " body > p:nth-child " e colocar o elemento entre os dois nomes "quatro" ali. Usar 1 não tem problema, afinal o enunciado pede 1 quebra de linha também, só não pode exagerar nas quebras