Aprenda los colores de CSS construyendo un conjunto de marcadores de colores - Paso 16

Español HTML-CSS
1

Cuéntanos qué está pasando:
no entiendo cual es el problema en el codigo necesito ayuda. Gracias

Tu código hasta el momento

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Colored Markers</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1>CSS Color Markers</h1>
    <div class="container">
      <div class="one"class="marker"
      </div>
      <div class="marker">
      </div>
      <div class="marker">
      </div>
    </div>
  </body>
</html>

/* file: styles.css */
h1 {
  text-align: center;
}

.marker {
  width: 200px;
  height: 25px;
  background-color: red;
  margin: 10px auto;
}

Información de tu navegador:

El agente de usuario es: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36

Desafío: Aprenda los colores de CSS construyendo un conjunto de marcadores de colores - Paso 16

Enlaza al desafío:

2

Fijate que en el ejercicio te indican como agregar mas de una clase a un mismo elemento:

<div class="animal dog"></div>

Este div pertenece tanto a la clase .animal como a la clase .dog.

Trata de aplicar esta sintaxis al agregar multiples clases a tu primer div :muscle:

2 Likes
3

amablemente describa el problema en detalle

4

It appears that your code is missing some styling for the markers. For example, you could add a border or give the markers a different color. Additionally, you could add a class to each marker so you can style them differently. For example:

/* file: styles.css */
h1 {
  text-align: center;
}

.marker {
  width: 200px;
  height: 25px;
  background-color: red;
  margin: 10px auto;
}

.one {
  border: 2px solid blue;
}

.two {
  background-color: green;
}

.three {
  border-radius: 50%;
}
5

Okay por lo que entendí, el ejemplo " animal dog" se refiere a 2 tipos de clases. Significa que “marker” y “one” son dos tipos de clases y como se ve en el ejemplo no es necesario separarlos con una , o utilizando otro class=" ". Simplemente separándolos con un espacio. Quedaría así:

<div class="marker one"> </div> <div class="marker"> </div> <div class="marker"> </div>

6

que bien, programar es alucinante porque hay muchas mecánicas. Gracias por la información!!!