عرض مصدر Bootstrap/browsers devices

<noinclude>{{DISPLAYTITLE:دعم المتصفحات في إطار Bootstrap}}</noinclude>
اقرأ عن المتصفّحات والأجهزة، من الحديثة إلى القديمة، التي يدعمها Bootstrap وتعرّف على الحالات الفريدة والعلل الخاصّة بكل واحد منها.

== المتصفّحات المدعومة ==
يدعم Bootstrap الإصدارات الأحدث والأكثر استقرارًا من جميع المتصفّحات والمنصّات الشهيرة. فعلى نظام ويندوز يدعم Bootstrap الإصدرايْن 10 و 11 من متصفح Internet Explorer وكذلك متصفح Microsoft Edge.

لا يدعم Bootstrap صراحةً المتصفّحات البديلة التي تستخدم الإصدارات الأخيرة من محركات Blink أو WebKit أو Gecko؛ سواء كان الاستخدام مباشرًا أو عن طريق واجهات WebView API التي توفّرها تلك المنصات. على الرغم من ذلك؛ يُفترَض  أن يظهر Bootstrap ويعمل على نحو صحيح في المتصفّحات المُشار إليها. توجد أدناه معلومات أكثر تفصيلًا عن دعم المتصفّحات.

=== الأجهزة الجوّالة ===
عمومًا؛ يدعم Bootstrap الإصدارات الحديثة من المتصفح الأساسي لكلّ منصة شهيرة. يُرجى ملاحظة أن المتصفّحات الوسيطة - مثل Opera Mini أو UC Browser Mini، أو وضع Turbo على Opera Mobile أو Amazon Silk - غير مدعومة.
{| class="wikitable"
!
!Chrome
!Firefox
!Safari
!متصفّح أندرويد وWebView
!Microsoft Edge
|-
!أندرويد
|مدعوم
|مدعوم
|غير موجود
|يدعم الإصدار 5.0 فما فوق
|مدعوم
|-
!iOS
|مدعوم
|مدعوم
|مدعوم
|غير موجود
|مدعوم
|-
!Windows 10 Mobile
|غير موجود
|غير موجود
|غير موجود
|غير موجود
|مدعوم
|}

=== المتصفّحات على الحواسيب ===
على نحو مشابه، يدعم Bootstrap الإصدارات الأحدث من متصفّحات الحواسيب.
{| class="wikitable"
!
!Chrome
!Firefox
!Internet Explorer
!Microsoft Edge
!Opera
!Safari
|-
!ماك
|مدعوم
|مدعوم
|غير معروف
|غير معروف
|مدعوم
|مدعوم
|-
!ويندوز
|مدعوم
|مدعوم
|يدعم الإصدار 10 فما فوق
|مدعوم
|مدعوم
|غير مدعوم
|}
بالنسبة لمتصفح Firefox؛ يدعم Bootstrap، علاوة على الإصدار العادي المستقر الأحدث، الإصدارَ ذا الدعم الممدَّد [https://www.mozilla.org/en-US/firefox/organizations/faq/ Extended Support Release] (اختصارًا ESR) منه.

يجب أن يعمل إطار Bootstrap جيدا على متصفحات Chromium و Chrome و Firefox في نظام لينكس، ومتصفح Internet Explorer 9؛ بغض النظر أنَّها غير مدعومة رسميًا.

راجع [https://getbootstrap.com/docs/4.0/browser-bugs/ قائمة بعلل Bootstrap على المتصفّحات] للقراءة عن بعض العلل التي يعاني منها Bootstrap في التعامل مع بعض المتصفّحات.

== Internet Explorer ==
يدعم Bootstrap الإصدارات 10 فما فوق من Internet Explorer. الإصدار 9 والإصدارات التي تسبقه غير مدعومة. يُرجى الانتباه إلى أن خاصيّاتٍ من [[CSS|CSS3]] وعناصر من [[HTML|HTML5]] غير مدعومة تمامًا في الإصدار 10، أو تحتاج لخاصيات ببادئة (Prefix) لتعمل بتوافق تام. انظر إلى قسم «دعم المتصفحات» في صفحات عناصر [[HTML]] وخاصيات [[CSS]] لتفاصيل عن دعم المتصفحات لها.

استخدم [https://getbootstrap.com/docs/3.3/ الإصدار 3 من Bootstrap] إن كنت تحتاج لدعم الإصدار 8 أو 9 من Internet Explorer. الإصدار 3 من Bootstrap هو الأكثر ثباتًا ويدعمه فريق التطوير بترقيعات للعلل الخطرة والتوثيق؛ إلا أنه لا تُضاف إليه ميزات جديدة.

== النوافذ الشرطية Modals والقوائم المنسدلة على الأجهزة الجوّالة ==

=== الطّفح Overflow والتمرير Scrolling ===
لا تدعم الأجهزة الجوّالة العاملة بأندرويد وiOS الخاصيّة <code>[[CSS/overflow|overflow: hidden;‎]]</code> في العنصُر <code>[[HTML/body|<body>]]</code> إلا بقدر محدود جدّا. لهذا السبّب يبدأ محتوى <code>[[HTML/body|<body>]]</code> بالتحرّك عندما تتجاوز حدود النافذة الشرطية العليا أو السفلى على متصفّحات هذه الأجهزة. راجع ا[https://bugs.chromium.org/p/chromium/issues/detail?id=175502 لعلّة ‎#175502 في Chrome] (صدر لها ترقيع في الإصدار 40) والعلّة [https://bugs.webkit.org/show_bug.cgi?id=153852 ‎#153852 في Webkit].

=== الحقول النصيّة في iOS والتمرير ===
تؤدّي اللمسة الأولى من حركة تمرير إن كانت داخل حدود عنصُر <code>[[HTML/input|<input>]]</code> أو <code>[[HTML/textarea|<textarea>]]</code> نصّي إلى تحرّك محتوى <code>[[HTML/body|<body>]]</code> بدلا من النافذة الشرطية نفسها. راجع [https://bugs.webkit.org/show_bug.cgi?id=153856 العلة ‎#153856] على WebKit. تنطبق هذه الملاحظة - على الأقل - على الإصدار 10 من iOS والإصدارات التي تسبقه.

=== القوائم المنسدلة في شريط التصفّح ===
لا يُستخدَم العنصُر ‎<code>.dropdown-backdrop</code> في شريط التصفّح على الأجهزة العاملة بنظام iOS نظرا لتعقّد [[CSS/z-index|وضع العناصر على المحور Z]]. لذا يجب عليك النقر مباشرة على عنصر القائمة المنسدلة (أو أي [https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile عنصُر آخر يتسبّب في حدَث نقر على iOS]) لإغلاق القائمة في شريط التصفّح.

== التقريب Zooming على المتصفّحات ==
لا بدّ أن توجد أخطاء في عرض بعض العناصر عند تقريب الصفحات، في Bootstrap وفي بقيّة الويب. يمكن إصلاح المشكلة أحيانًا (ابحث أولًا ثم أنشئ علةً على مستودع Bootstrap إن احتجت لذلك). على الرغم من ذلك، يميل فريق مطوّري Bootstrap إلى تجاهل هذه العلل نظرًا لعدم وجود حلّ مباشر في الغالب؛ بدلًا من الحلول الترقيعية.

== تأثير <code>‎:hover/:focus</code> ثابت على iOS ==
على الرغم من أن الصنف الزائف <code>[[CSS/:hover|hover:]]</code> غير قابل للاستخدام على معظم الشاشات اللمسية إلا أن iOS يحاكي عمل هذه الخاصيّة ممّا ينتُج عنه تنسيق حومان "ثابت" يستمر بعد الضغط على العنصُر. لا تُحذَف تأثيرات الحومان هذه إلا بعد الضغط على عنصُر آخر. يعدّ هذا السلوك عمومًا غير مرغوب فيه ويبدو أنه لا يحدث مشكلة على الأجهزة العاملة بأندرويد ووندوز.

ضمَّن المطوّرون خلال المراحل التجريبية من الإصدار 4 من Bootstrap شفرةً تحتوي على استعلام وسائط (Media query) يعطّل تنسيق الحومان على المتصفّحات التي تعمل على أجهزة تحاكي هذا السلوك. لم تكتمل هذه الشفرة وتُركت في تعليقات ضمن الشفرة المصدرية لإطار العمل. اختار المطورون هجر [https://github.com/twbs/mq4-hover-shim الشفرة المذكورة] للحيلولة دون انعدام التوافق بين مراحل إصدار إطار العمل.

== الطباعة ==
قد ينتُج عن الطباعة نتائج غريبة، حتى في المتصفّحات الحديثة.

يتسبّب الصنف <code>‎.container</code> في متصفّح Safari - حتى الإصدار 8.0- بجعل المتصفّح يستخدم قياسًا صغيرًا للخطّ عند الطباعة، على نحو غير معتاد. راجع [https://github.com/twbs/bootstrap/issues/14868 المشكلة رقم 14868] في Bootstrap و[https://bugs.webkit.org/show_bug.cgi?id= العلة ‎#138192] في Webkit.

شفرة CSS التالية هي حلّ بديل مُحتمَل:<syntaxhighlight lang="css">
@media print {
 .container {
   width: auto;
 }
}
</syntaxhighlight>

== متصفّح أندرويد الأساسي ==
يأتي أندرويد 4.1 (والإصدارات الأحدث) مبدئيًا بتطبيق متصفّح خاص (بدلًا من Chrome). توجد في هذا المتصفّح للأسف علل كثيرة وتناقضات عدّة مع تنسيقات [[CSS]] عمومًا.

== قائمة الاختيار Select ==
لا يعرض متصفّح أندرويد من المصنع أزرار التحكّم الجانبية عند تطبيق <code>[[CSS/border-radius|border-radius]]</code> أو <code>[[CSS/border|border]]</code> أو كلاهما معًا على عناصر <code>[[HTML/select|<select>]]</code>. (انظر [https://stackoverflow.com/questions/14744437/html-select-box-not-showing-drop-down-arrow-on-android-version-4-0-when-set-with هذا السؤال على موقع StackOverflow] لتفاصيل أكثر). استخدم الشفرة أدناه لإزالة تنسيقات CSS المُشكِلة وعرض <code>[[HTML/select|<select>]]</code> دون تنسيق على متصفّح أندرويد المبدئي. استكشاف المتصفّح يحول دون التداخل مع متصفّحات Chrome و Safari و Firefox.<syntaxhighlight lang="javascript">
<script>
$(function () {
 var nua = navigator.userAgent
 var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
 if (isAndroid) {
   $('select.form-control').removeClass('form-control').css('width', '100%')
 }
})
</script>
</syntaxhighlight>
== المصدِّقات ==
يستند Bootstrap في أماكن عدة على مجموعة سكربتات [[CSS]] و [[JavaScript]] تُعرَف باسم [http://browserhacks.com/ CSS browser hacks] (تصليحات أنماط المتصفح) تعمل على إصدارات محدّدة من بعض المتصفّحات وتتجاوز العلل الموجودة في المتصفّحات ذاتها، بهدف توفير تجربة الاستخدام الأفضل - حسب الإمكان - على المتصفّحات القديمة والمعلولة. تتسبّب هذه التصليحات في جعل مصدِّقات صفحات الأنماط (CSS Validators) تعدّها غير صالحة. يستخدم Bootstrap كذلك في أماكن معدودة ميزات جديدة في [[CSS]] لم تُضَف بعد إلى المعيار؛ إلا أن هذه الميزات مستخدمة فقط للتحسين المتدرّج لإطار العمل.

لا تمثّل تنبيهات التصديق تلك أي أهمية عمليًّا، إذ أن أنماط التنسيق غير التصليحية متوافقة تمامًا مع المصدِّقات كما أن الأنماط التصليحية لا يتداخل عملها مع الأنماط الأخرى؛ لهذا السبب نتجاهل عمدًا تحذيرات التصديق المتعلّقة بها.

على نحو مشابه، تحوي مستندات [[HTML]] الخاصّة بإطار العمل تنبيهات بسيطة وغير مهمة أثناء تصديق [[HTML]] نظرًا لتضمين حل بديل للحيلولة دون [https://bugzilla.mozilla.org/show_bug.cgi?id=654072 علّة في متصفح Firefox].

== مصادر ==
* [https://getbootstrap.com/docs/4.0/getting-started/browsers-devices/ صفحة Browsers and devices في توثيق Bootstrap].
[[تصنيف:Bootstrap|{{SUBPAGENAME}}]]
[[تصنيف:Bootstrap Getting Started|{{SUBPAGENAME}}]]