---
id: 618a132676346ac9f7fd59dd
title: الخطوة 39
challengeType: 0
dashedName: step-39
---

# --description--

لاحظ كيف أن عينيك تُسحب بشكل طبيعي إلى اللون الأحمر في المركز؟ عند تصميم موقع، يمكنك استخدام هذا التأثير لتوجيه الانتباه إلى عناوين أو أزرار أو روابط هامة.

هناك العديد من مجموعات الألوان الهامة الأخرى خارج الألوان التكميلية (complementary colors)، لكنك ستتعلم هذه في وقت لاحق.

For now, use the `rgb` function in the `.two` CSS rule to set the `background-color` to black.

# --hints--

يجب أن يكون لقاعدة CSS لـ `.two` الخاصية `background-color` بقيمة `rgb(0, 0, 0)`.

```js
assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'rgb(0, 0, 0)');
```

# --seed--

## --seed-contents--

```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="marker one">
      </div>
      <div class="marker two">
      </div>
      <div class="marker three">
      </div>
    </div>
  </body>
</html>
```

```css
h1 {
  text-align: center;
  background-color: rgb(0, 255, 255);
}

.container {
  background-color: rgb(255, 255, 255);
  padding: 10px 0;
}

.marker {
  width: 200px;
  height: 25px;
  margin: 10px auto;
}

.one {
  background-color: rgb(0, 0, 0);
}

--fcc-editable-region--
.two {
  background-color: rgb(255, 0, 0);
}
--fcc-editable-region--

.three {
  background-color: rgb(0, 0, 0);
}

```
