Respuestas Ejercicio 1 (HTML & CSS Junio)

Comparte tu respuesta del ejercicio 1.

Nota: Recuerdas que puedes formatear el bloque de codigo que compartas agregando 3 backticks, comillas francesas, o tildes al reves
Ejemplo:

<html>
  <body>
    <div id="root"></div>
  </body>
</html>

[quote=“khriztianmoreno, post:1, topic:5688, full:true”]
Comparte tu respuesta del ejercicio 1.

Nota: Recuerdas que puedes formatear el bloque de codigo que compartas agregando 3 backticks, comillas francesas, o tildes al reves
Ejemplo:

<html>
  <body>
    <div id="root"></div>
  </body>
</html>

[/quote] respuesta a ejercicio !

<title>HTML debugging examples</title>

HTML debugging examples

<p>What causes errors in HTML?<p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly</strong>, then its effect can spread to areas you didn't intend</li>
</ul>
  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong> <em>strong
    emphasised?</strong> what is this?</em>
  </li>
  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a> href="https://www.mozilla.org/>link to Mozilla homepage </a>
  </li>  
</ul>
<title>HTML debugging examples</title>

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend
</li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised?</strong> what is this?</em> 
</li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example:
<a href="https://www.mozilla.org/>link to Mozilla homepage</a> </ul> </body> </html>
<title>HTML debugging examples</title>

<!--[if lt IE 9]-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<!--[endif]-->

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly,</strong> then its effect can spread to areas you didn't intend</li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong</em> emphasised?</strong> what is this </li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a></li>
</ul>
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised?</em></strong> what is this?

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/>link to Mozilla homepage</a>
</ul>
<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <title>
        HTML debugging examples
    </title>
  </head>
  <body>
    <h1>HTML debugging examples</h1>
    <p>What causes errors in HTML?</p> 
    <!--Faltaba el cierre de la etiqueta-->
    <ul>
      <li>Unclosed elements: If an element is 
           <strong> not closed properly, then its effect can spread to areas you didn't intend </strong>        
           <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. 
                <strong> 
                    strong 
                    <em>strong emphasised?</em>  
                    <!--El cierre de la etiqueta em estaba mal ubicado-->
                </strong> what is this?
           </li>
           <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: 
              <a> href="https://www.mozilla.org/>link to Mozilla homepage"</a> 
              <!--Faltaba el cierre de las comillas dobles, faltaba el carácter que cerraba la etiqueta al inicio-->
           </li>
      </li>    
    </ul>
  </body>
</html>

HTML debugging examples

HTML debugging examples

What causes errors in HTML?

  • Unclosed elements: If an element is not closed properly, then its effect can spread to areas you didn't intend
  • Badly nested elements: Nesting elements properly is also very important for code behaving correctly. strong strong emphasised? what is this?
  • Unclosed attributes: Another common source of HTML problems. Let's look at an example: href="https://www.mozilla.org/>link to Mozilla homepage"
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Hello, world!</title>
  </head>
  <body>
    here is a body
  </body>
</html>
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend </strong> </li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised? what is this?</em></strong></li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a></li>
</ul>
<html>
  <head>
    <meta charset="utf-8">

    <title>HTML debugging examples</title>

    <!--[if lt IE 9]>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>HTML debugging examples</h1>

    <p>What causes errors in HTML?</p>

    <ul>
      <li>Unclosed elements: If an element is 
        <strong>not closed properly, then its effect can spread to areas you didn't intend
        </strong>
      </li>
      <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. 
        <em>
            <strong>strong strong emphasised?</strong> what is this?
        </em>
      </li>
    </ul>

  </body>  
</html>

Ejercicio #1

HTML debugging examples
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend</strong></li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong</strong> <em>strong emphasised? what is this?</em></li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a></li>
</ul>
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend</strong>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong</strong> <em>strong emphasised? what is this?</em></li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a></li>
</ul>
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend</strong></li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly.  <em><strong> emphasised?</strong> what is this?</em></li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a></li>
</ul>
<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML?

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend </li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised?</strong> what is this?</em> </li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a> href="https://www.mozilla.org/>link to Mozilla homepage></a> </li>
</ul>

Respuesta Ejercicio de Goye

HTML debugging examples

HTML debugging examples

What causes errors in HTML?

  • Unclosed elements: If an element is not closed properly, then its effect can spread to areas you didn't intend
  • Badly nested elements: Nesting elements properly is also very important for code behaving correctly. strong strong emphasised? what is this?
  • Unclosed attributes: Another common source of HTML problems. Let's look at an example: href="https://www.mozilla.org/>link to Mozilla homepage"

» HELLO WORLD

<!DOCTYPE html>  
<html>  
  <head>  
    <meta charset="utf-8">  
    <title>Hello, world!</title>  
  </head>  
  <body>  
    here is a body  
  </body>  
</html>

Hello, world! here is a body
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">

    <title>HTML debugging examples</title>

    <!--[if lt IE 9]>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <![endif]-->
  </head>

  <body>
    <h1>HTML debugging examples</h1>

    <p>What causes errors in HTML? </p>

    <ul>
      <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend </strong> </li>

      <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised? </em> </strong>  <em> what is this?</em>  </li>

      <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/ ">link to Mozilla homepage" </a> </li>
    </ul>
  </body>
</html>

<title>HTML debugging examples</title>

<!--[if lt IE 9]>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
<![endif]-->

HTML debugging examples

<p>What causes errors in HTML? </p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend </strong> </li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised? </em> </strong>  <em> what is this?</em>  </li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/ ">link to Mozilla homepage" </a> </li>
</ul>

Ejercicio 1 Debugging

HTML debugging examples

<p>What causes errors in HTML?</p>

<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly</strong>, then its effect can spread to areas you didn't intend</li>

  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong> <em>strong emphasised?</strong> what is this?</em></li>

  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/">link to Mozilla homepage</a> 
  </li>
</ul>