Browser iyo aaladaha
Baro wax ku saabsan daalacashada iyo aaladaha, laga bilaabo casriga ilaa kuwii hore, ee ay taageerto Bootstrap, oo ay ku jiraan quirks iyo cayayaan kasta.
daalacashada la taageeray
Bootstrap waxay taageertaa sii dayntii ugu dambeysay, xasilloon ee dhammaan daalacashada waaweyn iyo aaladaha. On Windows, waxaan taageernaa Internet Explorer 10-11 / Microsoft Edge .
Daalacashada beddelka ah ee adeegsata noocii ugu dambeeyay ee WebKit, Blink, ama Gecko, ha ahaato si toos ah ama ha ahaato goobta muuqaalka shabakadda API, si cad looma taageero. Si kastaba ha ahaatee, Bootstrap waa in (xaaladaha intooda badan) ay si sax ah u soo bandhigaan oo si sax ah ugu shaqeeyaan daalacashadan sidoo kale. Macluumaad dheeri ah oo gaar ah ayaa lagu bixiyaa hoosta.
Waxaad ka heli kartaa daalacashadayada kala duwan ee la taageeray iyo noocyadooda.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
Waxaan u isticmaalnaa Autoprefixer si aan u maareyno taageerada browser-ka loogu tala galay anagoo adeegsanayna horgalayaasha CSS, kaas oo isticmaala liiska Browsers si uu u maamulo noocyada browserka. Kala tasho dukumeentiyadooda sida loogu dari karo qalabkan mashaariicdaada.
Qalabka mobilada
Guud ahaan, Bootstrap waxay taageertaa noocyadii ugu dambeeyay ee madal kasta oo daalacashada caadiga ah. Ogow in browsers-yada wakiillada ah (sida Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk) aan la taageerin.
| Chrome | Firefox | Safari | Android Browser & WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Taageeray | Taageeray | N/A | Android v5.0+ waa la taageeray | Taageeray |
| IOS | Taageeray | Taageeray | Taageeray | N/A | Taageeray |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Taageeray |
daalacashada Desktop
Sidoo kale, noocyadii ugu dambeeyay ee inta badan daalacashada desktop-ka waa la taageerayaa.
| Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Taageeray | Taageeray | N/A | Taageeray | Taageeray | Taageeray |
| Daaqadaha | Taageeray | Taageeray | La taageeray, IE10+ | Taageeray | Taageeray | Lama taageero |
Firefox, marka lagu daro sii dayntii ugu dambeysay ee xasilloonida, waxaan sidoo kale taageernaa sii deynta Taageerada Dheeraadka ah ee ugu dambeysay (ESR) ee Firefox.
Si aan rasmi ahayn, Bootstrap waa inuu si fiican ugu dhaqmaa Chromium iyo Chrome ee Linux, Firefox for Linux, iyo Internet Explorer 9, in kasta oo aan si rasmi ah loo taageerin.
Liisaska qaar ka mid ah cilladaha browserka ee Bootstrap ay tahay in uu la tacaalo, arag darbigayaga kutaannada browserka .
Internet Explorer
Internet Explorer 10+ waa la taageeray; IE9 iyo hoos ma aha. Fadlan la soco in qaar ka mid ah guryaha CSS3 iyo HTML5 aan si buuxda loogu taageerin IE10, ama ay u baahan yihiin guryaha horgalayaasha ah ee shaqayn buuxda. Booqo Miyaan isticmaali karaa… si aad u hesho faahfaahinta taageerada browserka ee CSS3 iyo astaamaha HTML5. Haddii aad u baahan tahay taageerada IE8-9, isticmaal Bootstrap 3.
Hababka iyo hoos u dhigida mobilada
Buux-dhaaf iyo rogrogid
Taageerada curiyaha overflow: hidden;ayaa <body>aad u xaddidan macruufka iyo Android. Si taas loo gaaro, marka aad ka gudubto xagga sare ama hoose ee modal mid ka mid ah daalacashada aaladahaas, <body>waxa ku jira ayaa bilaabi doona in ay rogaan. Eeg bug Chrome ah #175502 (ku xidhan Chrome v40) iyo bug WebKit #153852 .
Garoomada qoraalka ee iOS iyo duuduub
Sida iOS 9.2, halka modal furan yahay, haddii taabashada bilowga ah ee tilmaanta duubku ay ku dhex jirto xadka qoraalka <input>ama a <textarea>, <body>waxa ku jira modalka hoostiisa waa la rogrogmi doonaa halkii modal laftiisa. Fiiri WebKit bug #153856 .
Navbar Dropdowns
Cunsurka .dropdown-backdroplooma isticmaalo IOS ee nav sababtoo ah kakanaanta z-indexing. Markaa, si aad u xidho hoos u dhaca navbars, waa inaad si toos ah u gujisaa qaybta hoos u dhaca (ama shay kasta oo kale kaas oo kicin doona dhacdo gujin ah oo ku taal iOS ).
Browser-gaaban
Soo-dhoweynta bogga ayaa si lama filaan ah u soo bandhigaysa samaynta farshaxan ee qaybaha qaarkood, labadaba Bootstrap iyo inta kale ee shabakadda. Iyadoo ay ku xiran tahay arrinta, waxaa laga yaabaa inaan awoodno inaan hagaajino (marka hore raadi ka dibna fur arrin haddii loo baahdo). Si kastaba ha ahaatee, waxaan u muuqannaa inaan iska indhatirno kuwan maadaama aysan inta badan haysan xal toos ah oo aan ahayn xalal xun.
Ku dheggan :hover/ :focusiOS
In kasta :hoveroo aanay suurtogal ahayn inta badan aaladaha taabashada, IOS waxa ay ku daydaa hab-dhaqankan, taas oo keenta qaabab “dheg-dheg leh” oo sii socda ka dib marka la taabto hal shay. Hababkan dullidda waxa la saaraa kaliya marka isticmaalayaashu taabtaan shay kale. Dhaqankan waxa loo arkaa mid aan si weyn loo jeclayn oo u muuqda in aanu ahayn arrin ku saabsan aaladaha Android ama Windows.
Inta lagu jiro sii deynta v4 alpha iyo beta, waxaan ku soo darnay mid aan dhameystirneyn oo ka faalloonnay koodka xulashada shimka weydiinta warbaahinta kaas oo baabi'in doona qaababka dullida ee daalacashada aaladaha taabashada ee ku dayda dullidda. Shaqadani weligeed si buuxda looma dhammaystirin ama looma hawlgelin, laakiin si aan uga fogaano burbur dhammaystiran, waxaanu door bidnay in aanu meesha ka saarno shimkan oo aanu ka dhigno waxyaabaha la isku daray in ay noqdaan hab-gaabyo loogu talagalay fasallada been abuurka ah.
Daabacaadda
Xataa daalacashada casriga ah qaarkood, daabacaaddu waxay noqon kartaa mid qariib ah.
Marka la eego Safari v8.0, isticmaalka fasalka ballac-go'an .containerwuxuu sababi karaa Safari inay isticmaasho cabbir faryar oo aan caadi ahayn marka la daabacayo. Fiiri arrinta #14868 iyo bug WebKit #138192 wixii faahfaahin dheeraad ah. Mid ka mid ah xalinta suurtagalka ah waa CSS soo socota:
@media print {
.container {
width: auto;
}
}
browserka stock Android
Marka laga reebo sanduuqa, Android 4.1 (iyo xitaa qaar cusub oo la sii daayay sida muuqata) waxay la soo degtaa abka Browser-ka oo ah browser-ka caadiga ah ee dookha (oo ka duwan Chrome). Nasiib darro, abka Browserku wuxuu leeyahay kutaanno badan iyo iswaafaqla'aan la xiriira CSS guud ahaan.
Dooro liiska
Cunsurrada <select>, browserka saamiyada Android ma soo bandhigi doono kontaroolada dhinac haddii ay jiraan border-radiusiyo/ama borderlagu dabaqay. ( Faahfaahinta ka eeg su'aashan StackOverflow <select>Wakiilka adeegsadaha dhuuqida ayaa ka fogaanaya faragelinta Chrome, Safari, iyo daalacashada Mozilla.
<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>
Ma rabtaa inaad aragto tusaale? Fiiri JS Bin demo .
Ansixiyeyaal
Si loo siiyo waayo-aragnimada ugu wanaagsan ee suurtogalka ah ee daalacashada hore iyo kuwa buggy, Bootstrap waxay isticmaashaa hacks browser CSS meelo badan si ay u beegsato CSS gaar ah noocyada browserka qaarkood si ay uga shaqeeyaan kutaannada daalacashada laftooda. Dhacdooyinkan si la fahmi karo waxay sababaan ansaxayaasha CSS inay ka cawdaan inay khaldan yihiin. Meelo lamaane ah, waxaan sidoo kale isticmaalnaa astaamaha CSS-da ee dhiig-baxa kuwaas oo aan wali si buuxda loo habayn, laakiin kuwan waxa kaliya loo isticmaalaa kobcinta horumarka.
Digniintan ansaxinta ah shaqo kuma laha ficil ahaan maadaama qaybta aan jabsanayn ee CSS-tayadu si buuxda u ansixiso oo qaybaha jabsiga ahi aanay faragelin habsami u shaqaynta qaybta aan jabsanayn, sidaa awgeed sababta aanu si ula kac ah isaga indho-tirno digniinahaas gaarka ah.
Dukumeentiyadayada HTML sidoo kale waxay leeyihiin digniino ansax ah oo HTML ah oo aan waxtar lahayn oo aan macno lahayn taas oo ay ugu wacan tahay ku darista hab-dhaqanka cilad Firefox gaar ah .