<span>

وسم الحاوية السطرية <span>

وسم span حاوية سطرية عامة — يلتف حول جزء من نص أو عناصر صغيرة لتنسيقها دون كسر السطر.

الشقيق السطري لـ div: لا معنى دلاليًّا له، ولا يكسر السطر، ومهمته الوحيدة إعطاؤك «مقبضًا» تلوّن به كلمة داخل جملة أو تستهدف به جزءًا صغيرًا بالجافاسكريبت.

الفرق الجوهري عن div هو سلوك العرض: span عنصر سطري (inline) يبقى داخل تدفق النص، بينما div كتلي (block) يبدأ سطرًا جديدًا.

الصياغة

<p>نص فيه <span class="highlight">كلمة مميزة</span> وسط الجملة.</p>

⚡ جرّب بنفسك

عدّل الكود واضغط «تحديث» لترى النتيجة فورًا — التجربة أفضل معلّم.

🎨 محرّر HTML/CSS

<p style="font-size:18px">
  تعلّم البرمجة
  <span style="color:#7c5cff; font-weight:bold">بالعربي</span>
  خطوة بخطوة.
</p>

النتيجة المباشرة:

أهم الخصائص

الخاصية	الوظيفة
class	لتنسيق الجزء الملفوف بـ CSS
id	معرّف فريد للاستهداف بالجافاسكريبت

💡 نصائح عملية

للنص المهم دلاليًّا استخدم <strong> أو <em> بدل span منسّق — لهما معنى تفهمه قارئات الشاشة
لا يقبل width/height لأنه سطري — إن احتجتهما فالأنسب display:inline-block أو div

⚠️ أخطاء شائعة

وضع عناصر كتلية (div/p) داخل span — تداخل غير صالح
استخدام span للعناوين أو الفقرات بدل الوسوم الدلالية

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار HTML الكامل بالعربي.

📚 للتعمق التقني الكامل بالإنجليزية: MDN Web Docs