in English

בראַוזערז און דעוויסעס

לערן וועגן די בראַוזערז און דעוויסעס, פון מאָדערן צו אַלט, וואָס זענען געשטיצט דורך Bootstrap, אַרייַנגערעכנט באַוווסט קווערקס און באַגז פֿאַר יעדער.

שטיצט בראַוזערז

באָאָטסטראַפּ שטיצט די לעצטע, סטאַביל ריליסיז פון אַלע הויפּט בראַוזערז און פּלאַטפאָרמס. אויף Windows, מיר שטיצן Internet Explorer 10-11 / Microsoft Edge .

אַלטערנאַטיווע בראַוזערז וואָס נוצן די לעצטע ווערסיע פון ​​​​WebKit, Blink אָדער Gecko, צי גלייך אָדער דורך די וועב View API פון דער פּלאַטפאָרמע, זענען נישט בפירוש געשטיצט. אָבער, Bootstrap זאָל (אין רובֿ פאלן) אַרויסווייַזן און פונקציאָנירן ריכטיק אין די בראַוזערז אויך. מער ספּעציפיש שטיצן אינפֿאָרמאַציע איז צוגעשטעלט אונטן.

איר קענען געפֿינען אונדזער געשטיצט קייט פון בראַוזערז און זייער ווערסיעס אין אונדזער.browserslistrc file :

# https://github.com/browserslist/browserslist#readme

>= 1%
last 1 major version
not dead
Chrome >= 45
Firefox >= 38
Edge >= 12
Explorer >= 10
iOS >= 9
Safari >= 9
Android >= 4.4
Opera >= 30

מיר נוצן אַוטאָפּרעפיקסער צו שעפּן בדעה בלעטערער שטיצן דורך CSS פּרעפיקסעס, וואָס ניצט בראַוזערזליסט צו פירן די בלעטערער ווערסיעס. באַראַטנ זיך זייער דאַקיומענטיישאַן פֿאַר ווי צו ויסשטימען די מכשירים אין דיין פּראַדזשעקס.

רירעוודיק דעוויסעס

בכלל גערעדט, Bootstrap שטיצט די לעצטע ווערסיעס פון די פעליקייַט בראַוזערז פון יעדער הויפּט פּלאַטפאָרמע. באַמערקונג אַז פּראַקסי בראַוזערז (אַזאַ ווי אָפּעראַ מיני, אָפּעראַ מאָביל ס טורבאָ מאָדע, UC בראַוזער מיני, אַמאַזאָן סילק) זענען נישט געשטיצט.

קראָום פירעפאָקס סאַפאַרי אַנדרויד בלעטערער און וועבוויעוו Microsoft Edge
אַנדרויד געשטיצט געשטיצט N/A אַנדרויד וו5.0+ שטיצט געשטיצט
יאָס געשטיצט געשטיצט געשטיצט N/A געשטיצט
Windows 10 מאָביל N/A N/A N/A N/A געשטיצט

דעסקטאָפּ בראַוזערז

סימילאַרלי, די לעצטע ווערסיעס פון רובֿ דעסקטאַפּ בראַוזערז זענען געשטיצט.

קראָום פירעפאָקס Internet Explorer Microsoft Edge אָפּעראַ סאַפאַרי
מעק געשטיצט געשטיצט N/A געשטיצט געשטיצט געשטיצט
Windows געשטיצט געשטיצט געשטיצט, IE10+ געשטיצט געשטיצט ניט געשטיצט

פֿאַר Firefox, אין אַדישאַן צו די לעצטע נאָרמאַל סטאַביל מעלדונג, מיר אויך שטיצן די לעצטע עקסטענדעד סופּפּאָרט ריליס (ESR) ווערסיע פון ​​Firefox.

אַנאַפישאַלי, Bootstrap זאָל קוקן און ביכייוו געזונט גענוג אין Chromium און Chrome פֿאַר לינוקס, Firefox פֿאַר לינוקס און Internet Explorer 9, כאָטש זיי זענען נישט אַפישאַלי געשטיצט.

פֿאַר אַ רשימה פון עטלעכע פון ​​די בלעטערער באַגז וואָס Bootstrap האט צו האַנדלען מיט, זען אונדזער וואנט פון בלעטערער באַגז .

Internet Explorer

Internet Explorer 10+ איז געשטיצט; IE9 און אַראָפּ איז נישט. ביטע זיין אַווער אַז עטלעכע CSS3 פּראָפּערטיעס און HTML5 עלעמענטן זענען נישט גאָר געשטיצט אין IE10, אָדער דאַרפן פּרעפיקסעד פּראָפּערטיעס פֿאַר פול פאַנגקשאַנאַליטי. באַזוכן קען איך נוצן ... פֿאַר דעטאַילס וועגן בלעטערער שטיצן פון CSS3 און HTML5 פֿעיִקייטן. אויב איר דאַרפֿן IE8-9 שטיצן, נוצן Bootstrap 3.

מאָדאַלס און דראָפּדאָוונס אויף רירעוודיק

לויפן און סקראָללינג

שטיצן פֿאַר overflow: hidden;די <body>עלעמענט איז גאַנץ לימיטעד אין יאָס און אַנדרויד. צו דעם סוף, ווען איר מעגילע פאַרגאַנגענהייט די שפּיץ אָדער דנאָ פון אַ מאָדאַל אין איינער פון די בראַוזערז פון די דעוויסעס, דער <body>אינהאַלט וועט אָנהייבן צו מעגילע. זען קראָום זשוק #175502 (פאַרפעסטיקט אין קראָום וו40) און וועבקיט זשוק #153852 .

יאָס טעקסט פעלדער און סקראָללינג

זינט יאָס 9.2, בשעת אַ מאָדאַל איז אָפן, אויב דער ערשט פאַרבינדן פון אַ מעגילע האַווייַע איז ין דער גרענעץ פון אַ טעקסט <input>אָדער אַ <textarea>, די <body>אינהאַלט אונטער די מאָדאַל וועט זיין סקראָלאַלד אַנשטאָט פון די מאָדאַל זיך. זען וועבקיט זשוק #153856 .

דער .dropdown-backdropעלעמענט איז נישט געניצט אויף יאָס אין די נאַוו ווייַל פון די קאַמפּלעקסיטי פון ז-ינדעקסינג. אַזוי, צו פאַרמאַכן דראָפּדאָוונס אין נאַוובאַרס, איר מוזן גלייך גיט די דראָפּדאָוון עלעמענט (אָדער קיין אנדערע עלעמענט וואָס וועט פייערן אַ קליק געשעעניש אין יאָס ).

בלעטער זומינג

בלאַט זומינג ינעוואַטאַבלי גיט רענדערינג אַרטאַפאַקץ אין עטלעכע קאַמפּאָונאַנץ, ביידע אין באָאָטסטראַפּ און די רעשט פון די וועב. דעפּענדינג אויף דעם אַרויסגעבן, מיר קען זיין ביכולת צו פאַרריכטן עס (זוכן ערשטער און דעמאָלט עפענען אַן אַרויסגעבן אויב נייטיק). אָבער, מיר טענד צו איגנאָרירן די ווייַל זיי אָפט האָבן קיין דירעקט לייזונג אנדערע ווי כאַקי וואָרקאַראָונדס.

קלעפּיק :hover/ :focusאויף יאָס

כאָטש :hoverעס איז ניט מעגלעך אויף רובֿ פאַרבינדן דעוויסעס, יאָס עמיאַלייץ דעם נאַטור, ריזאַלטינג אין "קלעפּיק" האָווער סטיילז וואָס אָנהאַלטן נאָך טאַפּינג איין עלעמענט. די האָווער סטיילז זענען אַוועקגענומען בלויז ווען יוזערז צאַפּן אויף אן אנדער עלעמענט. דעם אָפּפירונג איז לאַרגעלי אַנדיזייראַבאַל און איז נישט אַן אַרויסגעבן אויף אַנדרויד אָדער Windows דעוויסעס.

איבער אונדזער וו4 אַלף און ביתא ריליסיז, מיר ינקלודעד דערענדיקט און קאַמענטאַד קאָד פֿאַר אַפּט אין אַ מעדיאַ אָנפֿרעג שים וואָס וואָלט דיסייבאַל האָווער סטיילז אין פאַרבינדן מיטל בראַוזערז וואָס עמיאַלייט כאַווערינג. די אַרבעט איז קיינמאָל גאָר געענדיקט אָדער ענייבאַלד, אָבער צו ויסמיידן גאַנץ ברייקידזש, מיר האָבן אַפּטיד צו דיפּרישיייט דעם שים און האַלטן די מיקסינס ווי דורכוועג פֿאַר די פּסעוודאָ-קלאסן.

דרוק

אפילו אין עטלעכע מאָדערן בראַוזערז, פּרינטינג קענען זיין קווערקי.

ווי פון Safari v8.0, די נוצן פון די פאַרפעסטיקט-ברייט .containerקלאַס קענען אָנמאַכן Safari צו נוצן אַ אַניוזשואַלי קליין שריפֿט גרייס ווען דרוקן. זען אַרויסגעבן #14868 און WebKit זשוק #138192 פֿאַר מער דעטאַילס. איין פּאָטענציעל וואָרקאַראָונד איז די פאלגענדע CSS:

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

אַנדרויד לאַגער בלעטערער

אויס פון די קעסטל, אַנדרויד 4.1 (און אפילו עטלעכע נייַער ריליסיז משמעות) שיף מיט די בראַוזער אַפּ ווי די פעליקייַט וועב בלעטערער פון ברירה (ווי קעגן צו קראָום). צום באַדויערן, די בראַוזער אַפּ האט פילע באַגז און ינגקאַנסיסטענסיז מיט CSS אין אַלגעמיין.

אויסקלייַבן מעניו

אויף <select>עלעמענטן, דער אַנדרויד לאַגער בלעטערער וועט נישט ווייַזן די זייַט קאָנטראָלס אויב עס איז אַ border-radiusאון / אָדער borderגעווענדט. (זען דעם StackOverflow קשיא פֿאַר דעטאַילס.) ניצן די סניפּאַט פון קאָד אונטן צו באַזייַטיקן די אַפענדינג CSS און מאַכן דעם <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>

ווילן צו זען אַ בייַשפּיל? קוק דעם JS Bin דעמאָ .

וואַלידאַטאָרס

אין סדר צו צושטעלן די בעסטער מעגלעך דערפאַרונג צו אַלט און וואָגן בראַוזערז, Bootstrap ניצט CSS בלעטערער כאַקס אין עטלעכע ערטער צו ציל ספּעציעלע CSS צו זיכער בלעטערער ווערסיעס צו אַרבעטן אַרום באַגז אין די בראַוזערז זיך. די כאַקס פאַרשטיייק פאַרשאַפן CSS וואַלאַדייטערז צו באַקלאָגנ זיך אַז זיי זענען פאַרקריפּלט. אין עטלעכע ערטער, מיר אויך נוצן בלידינג-ברעג CSS פֿעיִקייטן וואָס זענען נאָך נישט גאָר סטאַנדערדייזד, אָבער די זענען בלויז געניצט פֿאַר פּראָגרעסיוו ענכאַנסמאַנט.

די וואַלאַדיישאַן וואָרנינגז טאָן ניט ענין אין פיר זינט די ניט-כאַקי חלק פון אונדזער CSS איז גאָר וואַלאַדייטאַד און די כאַקי פּאָרשאַנז טאָן ניט אַרייַנמישנ זיך מיט די געהעריק פאַנגקשאַנינג פון די ניט-האַקי חלק, דערפאר מיר דיליבראַטלי איגנאָרירן די באַזונדער וואָרנינגז.

אונדזער HTML דאָקס אויך האָבן עטלעכע טריוויאַל און ינקאַנסעקווענטשאַל HTML וואַלאַדיישאַן וואָרנינגז רעכט צו אונדזער ינקלוזשאַן פון אַ וואָרקאַראָונד פֿאַר אַ זיכער Firefox זשוק .