Source

براؤزر اور آلات

ان براؤزرز اور آلات کے بارے میں جانیں، جدید سے پرانے تک، جو بوٹسٹریپ کے ذریعے تعاون یافتہ ہیں، بشمول ہر ایک کے لیے معلوم نرالا اور کیڑے۔

تائید شدہ براؤزرز

بوٹسٹریپ تمام بڑے براؤزرز اور پلیٹ فارمز کی تازہ ترین، مستحکم ریلیز کو سپورٹ کرتا ہے۔ ونڈوز پر، ہم Internet Explorer 10-11 / Microsoft Edge کو سپورٹ کرتے ہیں۔

متبادل براؤزرز جو WebKit، Blink، یا Gecko کا تازہ ترین ورژن استعمال کرتے ہیں، چاہے براہ راست یا پلیٹ فارم کے ویب ویو API کے ذریعے، واضح طور پر تعاون یافتہ نہیں ہیں۔ تاہم، بوٹسٹریپ کو (زیادہ تر معاملات میں) ان براؤزرز میں بھی صحیح طریقے سے ڈسپلے اور کام کرنا چاہیے۔ مزید مخصوص معاون معلومات ذیل میں فراہم کی گئی ہیں۔

آپ ہمارے براؤزرز کی حمایت یافتہ رینج اور ان کے ورژن تلاش کر سکتے ہیںpackage.json :

"browserslist": [
  "last 1 major version",
  ">= 1%",
  "Chrome >= 45",
  "Firefox >= 38",
  "Edge >= 12",
  "Explorer >= 10",
  "iOS >= 9",
  "Safari >= 9",
  "Android >= 4.4",
  "Opera >= 30"
]

ہم CSS سابقہ ​​جات کے ذریعے مطلوبہ براؤزر سپورٹ کو ہینڈل کرنے کے لیے Autoprefixer کا استعمال کرتے ہیں، جو براؤزر کے ان ورژنز کو منظم کرنے کے لیے Browserslist استعمال کرتا ہے۔ ان کے دستاویزات سے مشورہ کریں کہ ان ٹولز کو اپنے پروجیکٹس میں کیسے ضم کیا جائے۔

موبائل آلات

عام طور پر، بوٹسٹریپ ہر بڑے پلیٹ فارم کے ڈیفالٹ براؤزرز کے تازہ ترین ورژن کو سپورٹ کرتا ہے۔ نوٹ کریں کہ پراکسی براؤزرز (جیسے Opera Mini، Opera Mobile's Turbo mode، UC Browser Mini، Amazon Silk) تعاون یافتہ نہیں ہیں۔

کروم فائر فاکس سفاری اینڈرائیڈ براؤزر اور ویب ویو مائیکروسافٹ ایج
انڈروئد حمایت یافتہ حمایت یافتہ N / A Android v5.0+ تعاون یافتہ حمایت یافتہ
iOS حمایت یافتہ حمایت یافتہ حمایت یافتہ N / A حمایت یافتہ
ونڈوز 10 موبائل N / A N / A N / A N / A حمایت یافتہ

ڈیسک ٹاپ براؤزرز

اسی طرح، زیادہ تر ڈیسک ٹاپ براؤزرز کے تازہ ترین ورژن سپورٹ ہوتے ہیں۔

کروم فائر فاکس انٹرنیٹ ایکسپلورر مائیکروسافٹ ایج اوپرا سفاری
میک حمایت یافتہ حمایت یافتہ N / A N / A حمایت یافتہ حمایت یافتہ
ونڈوز حمایت یافتہ حمایت یافتہ تعاون یافتہ، IE10+ حمایت یافتہ حمایت یافتہ سہولت مہیا نہیں

Firefox کے لیے، تازہ ترین عام مستحکم ریلیز کے علاوہ، ہم Firefox کے تازہ ترین ایکسٹینڈڈ سپورٹ ریلیز (ESR) ورژن کی بھی حمایت کرتے ہیں۔

غیر سرکاری طور پر، Bootstrap کو Chromium اور Chrome for Linux، Firefox for Linux، اور Internet Explorer 9 میں کافی اچھا نظر آنا اور برتاؤ کرنا چاہیے، حالانکہ وہ سرکاری طور پر تعاون یافتہ نہیں ہیں۔

کچھ براؤزر بگس کی فہرست کے لیے جن کا بوٹسٹریپ کو سامنا کرنا پڑتا ہے، ہماری وال آف براؤزر بگ دیکھیں ۔

انٹرنیٹ ایکسپلورر

انٹرنیٹ ایکسپلورر 10+ تعاون یافتہ ہے۔ IE9 اور نیچے نہیں ہے۔ براہ کرم آگاہ رہیں کہ کچھ CSS3 خصوصیات اور HTML5 عناصر IE10 میں مکمل طور پر تعاون یافتہ نہیں ہیں، یا مکمل فعالیت کے لیے سابقہ ​​خصوصیات کی ضرورت ہے۔ CSS3 اور HTML5 خصوصیات کے براؤزر سپورٹ کے بارے میں تفصیلات کے لیے کیا میں استعمال کر سکتا ہوں... ملاحظہ کریں ۔

اگر آپ کو IE8-9 سپورٹ درکار ہے تو بوٹسٹریپ 3 استعمال کریں۔ یہ ہمارے کوڈ کا سب سے مستحکم ورژن ہے اور اب بھی اہم بگ فکسز اور دستاویزی تبدیلیوں کے لیے ہماری ٹیم کی طرف سے تعاون کیا جاتا ہے۔ تاہم اس میں کوئی نئی خصوصیات شامل نہیں کی جائیں گی۔

موبائل پر ماڈلز اور ڈراپ ڈاؤن

اوور فلو اور سکرولنگ

overflow: hidden;آئی او ایس اور اینڈرائیڈ میں عنصر کے لیے سپورٹ <body>کافی محدود ہے۔ اس مقصد کے لیے، جب آپ ان آلات کے براؤزرز میں سے کسی ایک موڈل کے اوپر یا نیچے سے گزرتے ہیں، تو <body>مواد اسکرول کرنا شروع کر دے گا۔ کروم بگ #175502 ( کروم v40 میں طے شدہ) اور ویب کٹ بگ #153852 دیکھیں ۔

iOS ٹیکسٹ فیلڈز اور سکرولنگ

<input>iOS 9.2 کے مطابق، جب ایک موڈل کھلا ہے، اگر اسکرول کے اشارے کا ابتدائی ٹچ ٹیکسٹول یا a کی حدود میں ہے <textarea>، <body>تو موڈل کے نیچے موجود مواد کو موڈل کے بجائے اسکرول کیا جائے گا۔ WebKit بگ #153856 دیکھیں ۔

.dropdown-backdropz-انڈیکسنگ کی پیچیدگی کی وجہ سے عنصر کو nav میں iOS پر استعمال نہیں کیا جاتا ہے ۔ اس طرح، navbars میں ڈراپ ڈاؤن کو بند کرنے کے لیے، آپ کو براہ راست ڈراپ ڈاؤن عنصر پر کلک کرنا ہوگا (یا کوئی دوسرا عنصر جو iOS میں کلک ایونٹ کو فائر کرے گا )۔

براؤزر زومنگ

صفحہ زوم کرنا ناگزیر طور پر بوٹسٹریپ اور باقی ویب دونوں میں، کچھ اجزاء میں پیش کرنے والے نمونے پیش کرتا ہے۔ مسئلہ پر منحصر ہے، ہم اسے ٹھیک کرنے کے قابل ہو سکتے ہیں (پہلے تلاش کریں اور پھر ضرورت پڑنے پر مسئلہ کھولیں)۔ تاہم، ہم ان کو نظر انداز کرتے ہیں کیونکہ ان کے پاس اکثر ہیکی ورک آراؤنڈ کے علاوہ کوئی براہ راست حل نہیں ہوتا ہے۔

چسپاں :hover/ :focusiOS پر

اگرچہ :hoverزیادہ تر ٹچ ڈیوائسز پر ممکن نہیں ہے، iOS اس طرز عمل کی تقلید کرتا ہے، جس کے نتیجے میں "چپچپا" ہوور اسٹائلز ہوتے ہیں جو ایک عنصر کو تھپتھپانے کے بعد برقرار رہتے ہیں۔ یہ ہوور اسٹائل صرف اس وقت ہٹائے جاتے ہیں جب صارف کسی دوسرے عنصر کو تھپتھپاتے ہیں۔ یہ رویہ بڑی حد تک ناپسندیدہ سمجھا جاتا ہے اور ایسا لگتا ہے کہ یہ اینڈرائیڈ یا ونڈوز ڈیوائسز پر کوئی مسئلہ نہیں ہے۔

اپنی پوری v4 الفا اور بیٹا ریلیزز کے دوران، ہم نے میڈیا استفسار شیم کو منتخب کرنے کے لیے نامکمل اور کمنٹ آؤٹ کوڈ کو شامل کیا جو ٹچ ڈیوائس براؤزرز میں ہوور اسٹائل کو غیر فعال کر دے گا جو ہوورنگ کی تقلید کرتے ہیں۔ یہ کام کبھی بھی مکمل طور پر مکمل یا فعال نہیں کیا گیا تھا، لیکن مکمل ٹوٹ پھوٹ سے بچنے کے لیے، ہم نے اس شیم کو فرسودہ کرنے کا انتخاب کیا ہے اور سیوڈو کلاسز کے لیے شارٹ کٹ کے طور پر مکسنس کو برقرار رکھا ہے۔

پرنٹنگ

یہاں تک کہ کچھ جدید براؤزرز میں بھی پرنٹنگ نرالی ہو سکتی ہے۔

Safari v8.0 کے مطابق، فکسڈ چوڑائی .containerکلاس کا استعمال سفاری کو پرنٹنگ کے وقت غیر معمولی طور پر چھوٹے فونٹ سائز کا استعمال کرنے کا سبب بن سکتا ہے۔ مزید تفصیلات کے لیے شمارہ #14868 اور ویب کٹ بگ #138192 دیکھیں ۔ ایک ممکنہ حل مندرجہ ذیل CSS ہے:

@media print {
  .container {
    width: auto;
  }
}

اینڈرائیڈ اسٹاک براؤزر

باکس سے باہر، Android 4.1 (اور یہاں تک کہ بظاہر کچھ نئی ریلیزز بھی) براؤزر ایپ کے ساتھ بطور ڈیفالٹ ویب براؤزر (کروم کے برخلاف) بھیجتا ہے۔ بدقسمتی سے، براؤزر ایپ میں عام طور پر CSS کے ساتھ بہت سارے کیڑے اور تضادات ہیں۔

مینو منتخب کریں۔

عناصر پر ، اگر کوئی اور/یا اطلاق ہوتا <select>ہے تو Android اسٹاک براؤزر سائیڈ کنٹرولز کو ظاہر نہیں کرے گا ۔ ( تفصیلات کے لیے یہ StackOverflow سوال دیکھیں۔) گستاخانہ CSS کو ہٹانے کے لیے نیچے کوڈ کا ٹکڑا استعمال کریں اور اسے اینڈرائیڈ اسٹاک براؤزر پر غیر اسٹائل شدہ عنصر کے طور پر پیش کریں۔ صارف ایجنٹ سونگھنا کروم، سفاری، اور موزیلا براؤزرز کے ساتھ مداخلت سے گریز کرتا ہے۔border-radiusborder<select>

<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>

ایک مثال دیکھنا چاہتے ہیں؟ یہ جے ایس بن ڈیمو چیک کریں۔

تصدیق کرنے والے

پرانے اور چھوٹی چھوٹی براؤزرز کو بہترین ممکنہ تجربہ فراہم کرنے کے لیے، بوٹسٹریپ کئی جگہوں پر سی ایس ایس براؤزر ہیکس کا استعمال کرتا ہے تاکہ مخصوص سی ایس ایس کو مخصوص براؤزر ورژنز کو نشانہ بنایا جا سکے تاکہ براؤزرز میں موجود کیڑے کو دور کیا جا سکے۔ یہ ہیکس سی ایس ایس کی توثیق کرنے والوں کو یہ شکایت کرنے کا باعث بنتے ہیں کہ وہ غلط ہیں۔ ایک دو جگہوں پر، ہم بلیڈنگ ایج سی ایس ایس کی خصوصیات بھی استعمال کرتے ہیں جو ابھی تک مکمل طور پر معیاری نہیں ہیں، لیکن ان کا استعمال خالصتاً ترقی پسندانہ اضافہ کے لیے کیا جاتا ہے۔

توثیق کے ان انتباہات سے عملی طور پر کوئی فرق نہیں پڑتا ہے کیونکہ ہمارے سی ایس ایس کا غیر ہیکی حصہ پوری طرح سے توثیق کرتا ہے اور ہیکی حصے غیر ہیکی والے حصے کے مناسب کام میں مداخلت نہیں کرتے ہیں، اس لیے ہم جان بوجھ کر ان مخصوص انتباہات کو کیوں نظر انداز کرتے ہیں۔

اسی طرح ہمارے HTML دستاویزات میں کچھ معمولی اور غیر ضروری HTML توثیق کے انتباہات ہیں جس کی وجہ سے ایک مخصوص فائر فاکس بگ کے لیے ہمارے حل کو شامل کیا گیا ہے ۔