Skip to main content

Exercise 1: Text, Background, Borders, and Lists

  • Change the text color of all paragraphs to blue.

  • Change the font size of all headings to 36 pixels.

  • Add a yellow background color to all thediv

  • Adds a solid red border, 2 pixels wide, to all elements with the class.caja

  • Change the style of the list items so they have a circle instead of a dot.

Interactive Solution​

Solution with complete HTML and CSS code​

HTML
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <title>Ejercicio 1</title>
    <style>
      /* Escribe tu CSS aquí */
      p {
        color: blue;
      }
      h1,
      h2 {
        font-size: 36px;
      }
      div {
        background-color: yellow;
      }
      .caja {
        border: 2px solid red;
      }
      li {
        list-style-type: circle;
      }
    </style>
  </head>
  <body>
    <p>Este es un párrafo.</p>
    <p>Este es otro párrafo.</p>
    <h1>Encabezado 1</h1>
    <h2>Encabezado 2</h2>
    <div>Este es un div.</div>
    <div class="caja">Este es un div con borde.</div>
    <ul>
      <li>Elemento 1</li>
      <li>Elemento 2</li>
      <li>Elemento 3</li>
    </ul>
  </body>
</html>
info

🔎Review the following sections where you will find more information on this topic: