---
id: bad87fee1348bd9aedf04756
title: Override Styles in Subsequent CSS
challengeType: 0
videoUrl: ''
localeTitle: ''
---
## Description
undefined
## Instructions
إنشاء فئة CSS إضافية تسمى blue-text
يعطي عنصر باللون الأزرق. تأكد من أنه أقل من pink-text
الفصل pink-text
. قم blue-text
فئة blue-text
على عنصر h1
بالإضافة إلى فصل pink-text
، ودعنا نرى أيهما يفوز. يتم تطبيق سمات فئات متعددة على عنصر HTML بمسافة بينها مثل: class="class1 class2"
ملاحظة: لا يهم أي ترتيب يتم سرد الفئات في عنصر HTML. ومع ذلك ، فإن ترتيب إعلانات class
في قسم <style>
هو ما هو مهم. سوف يكون للإعلان الثاني الأسبقية على الأول. نظرًا لأنه يتم الإعلان عن .blue-text
الثانية ، فإنه يؤدي إلى تجاوز سمات .pink-text
## Tests
```yml
tests:
- text: يجب أن يحتوي عنصر h1
pink-text
.
testString: 'assert($("h1").hasClass("pink-text"), "Your h1
element should have the class pink-text
.");'
- text: يجب أن يحتوي عنصر h1
على الفصل blue-text
.
testString: 'assert($("h1").hasClass("blue-text"), "Your h1
element should have the class blue-text
.");'
- text: يجب أن ينتمي blue-text
pink-text
إلى نفس عنصر h1
.
testString: 'assert($(".pink-text").hasClass("blue-text"), "Both blue-text
and pink-text
should belong to the same h1
element.");'
- text: ''
testString: 'assert($("h1").css("color") === "rgb(0, 0, 255)", "Your h1
element should be blue.");'
```
## Challenge Seed
## Solution
```js
// solution required
```