الفرق بين المراجعتين ل"HTML/em"
ط (استبدال النص - ':(Content sectioning|Edits|Embedded content|Forms|Inline text semantics|Input Types|Interactive elements|Main Root|Metadata|Multimedia|Scripting|Table|Text Content)' ب':HTML $1') |
(إضافة قسمين ومثال) |
||
| سطر 5: | سطر 5: | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
<p> | <p> | ||
| − | + | موسوعة حسوب تهتم <em>بتوثيق</em> | |
| − | + | لغات البرمجة، وليس بتقديم | |
| − | <em> | + | <em>دروس</em> عنها. |
</p> | </p> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| + | == بطاقة العنصر == | ||
{| class="wikitable" style="width: 100%;" | {| class="wikitable" style="width: 100%;" | ||
|- | |- | ||
| سطر 62: | سطر 63: | ||
أما مثال عن العنصر <code>[[HTML/i|<nowiki><i></nowiki>]]</code>: «محمد يتعلّم لغة ''PHP'' حاليًا»، إذ لا يوجد توكيد أو أهمية لكلمة «PHP» في الجملة السابقة، وإنما إشارة إلى اسم اللغة. | أما مثال عن العنصر <code>[[HTML/i|<nowiki><i></nowiki>]]</code>: «محمد يتعلّم لغة ''PHP'' حاليًا»، إذ لا يوجد توكيد أو أهمية لكلمة «PHP» في الجملة السابقة، وإنما إشارة إلى اسم اللغة. | ||
| + | |||
| + | == التنسيق الافتراضي == | ||
| + | تعرض أغلبية المتصفحات العنصر <code><nowiki><em></nowiki></code> مع ضبط نمط الخط (الخاصية <code>[[CSS/font-style|font-style]]</code>) إلى <code>italic</code>:<syntaxhighlight lang="css"> | ||
| + | em { | ||
| + | font-style: italic; | ||
| + | } | ||
| + | </syntaxhighlight> | ||
==مصادر ومواصفات== | ==مصادر ومواصفات== | ||
المراجعة الحالية بتاريخ 08:23، 19 فبراير 2018
يُعطي العنصر <em> توكيدًا للنص الموجود فيه، ويمكن تشعّب العنصر <em> (أي استخدام أكثر من عنصر <em> داخل بعضها) وكل مستوى من مستويات التشعب يعطي توكيدًا أكثر للنص.
يمكن استخدام العنصر <em> للإشارة إلى اختلاف بين شيئين اثنين كما في المثال الآتي:
<p>
موسوعة حسوب تهتم <em>بتوثيق</em>
لغات البرمجة، وليس بتقديم
<em>دروس</em> عنها.
</p>
بطاقة العنصر
| تصنيفات المحتوى | عنصر تنظيمي أو عنصر عادي. |
|---|---|
| المحتوى المسموح | محتوى عادي. |
| الوسم المختصر | لا يمكن حذف أيّ من وسمَي البداية أو النهاية. |
| العناصر الأب | أي عنصر يقبل المحتوى العادي. |
| واجهة DOM | HTMLSpanElement
|
دعم المتصفحات
| Chrome | Firefox | Edge | Safari | Opera |
|---|---|---|---|---|
| مدعوم | مدعوم | مدعوم | مدعوم | مدعوم |
الخاصيات
يمكن استخدام الخاصيات العامة في هذا العنصر.
ملاحظات الاستخدام
صحيحٌ أنَّ هذا العنصر يُعرَض عادةً بخطٍ مائل (italic)، لكن لا يجوز استخدامه لعرض عرض النص بالخط المائل، وإنما يجب استخدام CSS لأمور التنسيق.
استخدم العنصر <cite> لتوسيم عنوان أحد الأعمال الإبداعية (كتاب أو مسرحية أو أغنية ...إلخ.) والذي يُعرَض عادةً بخطٍ مائل أيضًا لكن له معنى مختلف.
استخدم العنصر <strong> للإشارة إلى أنَّ النص المحتوى داخله له أهمية أكثر مما حوله من النص.
العنصر <i> والعنصر <em>
وجود العديد من العناصر لتوكيد النص يؤدي إلى إرباك الكثير من المطورين، ومن أكثر تلك العناصر شهرةً العنصرين <i> و <em>، فالسؤال الشائع بين المطورين الجدد هو متى نستخدم <em> ومتى نستخدم <i>؟ أليست النتيجة نفسها؟
صحيحٌ أنَّ طريقة عرض العنصرين <em> و <i> افتراضيًا هي نفسها والتي تجعل النص معروضًا بخطٍ مائل، لكن المعنى التنظيمي يختلف تمامًا؛ فالعنصر <em> يضفي توكيدًا على محتواه، بينما العنصر <i> يُمثِّل نصًا يجب أن يتميز عن المحتوى العادي مثل اسم كتاب أو فلم، أو كلمة أجنبية، أو عندما يُشير النص إلى معنى كلمة ما.
فمثلًا، يمكن استخدام العنصر <em> في الجملة الآتية: «يجب علينا اتخاذ إجراء لمنع ذلك» أو «هل تفكر جديًّا بفعل ذلك؟!». فالشخص أو البرنامج الذي سيقرأ الجملتين السابقتين سيلفظ الكلمات المكتوبة بخطٍ مائل بقوة (مشيرًا إلى توكيدها).
أما مثال عن العنصر <i>: «محمد يتعلّم لغة PHP حاليًا»، إذ لا يوجد توكيد أو أهمية لكلمة «PHP» في الجملة السابقة، وإنما إشارة إلى اسم اللغة.
التنسيق الافتراضي
تعرض أغلبية المتصفحات العنصر <em> مع ضبط نمط الخط (الخاصية font-style) إلى italic:
em {
font-style: italic;
}
مصادر ومواصفات
- معيار HTML Living Standard.
- مواصفة HTML5.
- مواصفة HTML 4.01.