---
id: bad87fee1348bd9aedf08845
title: Use a span to Target Inline Elements
challengeType: 0
videoUrl: ''
localeTitle: استخدم مسافة للعناصر المضمنة الهدف
---
## Description
يمكنك استخدام الامتدادات لإنشاء عناصر مضمنة. أتذكر عندما استخدمنا فئة btn-block لجعل الزر يملأ الصف بأكمله؟ يوضح الفرق بين عنصر "inline" وعنصر "block". باستخدام عنصر span المضمن ، يمكنك وضع العديد من العناصر على نفس السطر ، وحتى وضع أجزاء مختلفة من نفس السطر بشكل مختلف. عش كلمة "love" في عنصر "Things cats love" الخاص بك أدناه داخل عنصر span . ثم إعطاء التي span الطبقة text-danger لجعل أحمر النص. في ما يلي كيفية القيام بذلك باستخدام عنصر "أهم ثلاثة أشياء للقطط التي تكره": <p>Top 3 things cats <span class="text-danger">hate:</span></p>
## Instructions
undefined
## Tests
```yml
tests:
- text: ''
testString: 'assert($("p span") && $("p span").length > 0, "Your span element should be inside your p element.");'
- text: يجب أن يحتوي عنصر span الخاص بك على نص love فقط.
testString: 'assert($("p span") && $("p span").text().match(/love/i) && !$("p span").text().match(/Things cats/i), "Your span element should have just the text love.");'
- text: ''
testString: 'assert($("span").hasClass("text-danger"), "Your span element should have class text-danger.");'
- text: ''
testString: 'assert(code.match(/<\/span>/g) && code.match(//g).length === code.match(/span element has a closing tag.");'
```
## Challenge Seed