الفرق بين المراجعتين لصفحة: «HTML/bdi»
لا ملخص تعديل |
طلا ملخص تعديل |
||
(3 مراجعات متوسطة بواسطة نفس المستخدم غير معروضة) | |||
سطر 14: | سطر 14: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
== بطاقة العنصر == | |||
{| class="wikitable" style="width: 100%;" | {| class="wikitable" style="width: 100%;" | ||
|- | |- | ||
سطر 56: | سطر 57: | ||
*معيار [https://html.spec.whatwg.org/multipage/semantics.html#the-bdi-element HTML Living Standard]. | *معيار [https://html.spec.whatwg.org/multipage/semantics.html#the-bdi-element HTML Living Standard]. | ||
*مواصفة [http://www.w3.org/TR/html5/textlevel-semantics.html#the-bdi-element HTML5]. | *مواصفة [http://www.w3.org/TR/html5/textlevel-semantics.html#the-bdi-element HTML5]. | ||
[[تصنيف:HTML|{{SUBPAGENAME}}]] | |||
[[تصنيف: | [[تصنيف:HTML Elements|{{SUBPAGENAME}}]] | ||
[[تصنيف:HTML]] | [[تصنيف:HTML Inline text semantics|{{SUBPAGENAME}}]] | ||
[[تصنيف:HTML |
المراجعة الحالية بتاريخ 03:26، 19 فبراير 2018
يعزل العنصر <bdi>
(اختصار للعبارة bidirectional isolation) جزءًا من النص الذي يمكن تنسيقه باتجاه نص (أي اتجاه النص من اليمين إلى اليسار مثل اللغة العربية، أو من اليسار إلى اليمين مثل اللغات اللاتينية) مختلف عن النص الذي حوله.
هذا العنصر مفيدٌ عند تضمين نص لا يُعرَف اتجاهه تحديدًا -مثل تضمين نص من قاعدة البيانات- داخل نص له اتجاه نص معيّن.
المثال الآتي يستخدم العنصر <bdi>
لعرض جملة عربية بشكل سليم:
<p dir="ltr">This arabic word <bdi>جملة عربية في عنصر bdi الذي يعرض اتجاه النص بشكل مستقل عمّا حوله</bdi>
is automatically displayed right-to-left.</p>
إذا لم نستخدم العنصر <bdi>
واستعملنا <span>
بدلًا منه فستكون الجملة العربية غير مفهومة:
<p dir="ltr">This arabic word <span>جملة عربية في عنصر bdi الذي يعرض اتجاه النص بشكل مستقل عمّا حوله</span>
is automatically displayed right-to-left.</p>
بطاقة العنصر
تصنيفات المحتوى | عنصر تنظيمي أو عنصر عادي. |
---|---|
المحتوى المسموح | محتوى عادي. |
الوسم المختصر | لا يمكن حذف أيّ من وسمَي البداية أو النهاية. |
العناصر الأب | أي عنصر يقبل المحتوى العادي. |
واجهة DOM | HTMLElement
|
دعم المتصفحات
Chrome | Firefox | Edge | Safari | Opera |
---|---|---|---|---|
مدعوم | مدعوم | غير مدعوم | مدعوم | مدعوم |
أغلبية المتصفحات الحديثة التي تدعم HTML5 تدعم هذا العنصر.
الخاصيات
يمكن استخدام الخاصيات العامة في هذا العنصر؛ لكن مع اختلاف تنظيمي صغير ألا وهو عدم وراثة قيمة الخاصية dir
، فلو لم تُضبَط هذه الخاصية فستكون قيمتها الافتراضية هي auto
وسيقرر المتصفح ما هو اتجاه النص اعتمادًا على محتوى العنصر.
ملاحظات الاستخدام
صحيحٌ أنَّ من الممكن الحصول على نفس الأثر المرئي باستخدام خاصية unicode-bidi: isolate
في CSS على عنصر <span>
أو أي عنصر آخر يقبل النص، لكن لهذا العنصر معنى تنظيمي، وهو مفيد في حال عطّل المستخدم استخدام أنماط CSS، وفي تلك الحالة سيُعرَض النص بشكل صحيح باستخدام عنصر <bdi>
.
مصادر ومواصفات
- معيار HTML Living Standard.
- مواصفة HTML5.