Source

ବ୍ରାଉଜର୍ ଏବଂ ଉପକରଣଗୁଡ଼ିକ |

ଆଧୁନିକରୁ ପୁରାତନ ପର୍ଯ୍ୟନ୍ତ ବ୍ରାଉଜର୍ ଏବଂ ଡିଭାଇସ୍ ବିଷୟରେ ଜାଣନ୍ତୁ, ଯାହା ବୁଟଷ୍ଟ୍ରାପ୍ ଦ୍ୱାରା ସମର୍ଥିତ, ପ୍ରତ୍ୟେକ ପାଇଁ ଜଣାଶୁଣା କ୍ୱିକ୍ସ ଏବଂ ବଗ୍ ଅନ୍ତର୍ଭୁକ୍ତ କରେ |

ସମର୍ଥିତ ବ୍ରାଉଜର୍ |

ବୁଟ୍ ଷ୍ଟ୍ରାପ୍ ସମସ୍ତ ପ୍ରମୁଖ ବ୍ରାଉଜର୍ ଏବଂ ପ୍ଲାଟଫର୍ମଗୁଡିକର ସର୍ବଶେଷ, ସ୍ଥିର ପ୍ରକାଶନକୁ ସମର୍ଥନ କରେ | ୱିଣ୍ଡୋଜ୍ ରେ, ଆମେ ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ 10-11 / ମାଇକ୍ରୋସଫ୍ଟ ଏଜ୍ କୁ ସମର୍ଥନ କରୁ |

ବିକଳ୍ପ ବ୍ରାଉଜର୍ ଯାହା ୱେବ୍ କିଟ୍, ବ୍ଲିଙ୍କ୍, କିମ୍ବା ଗେକୋର ସର୍ବଶେଷ ସଂସ୍କରଣ ବ୍ୟବହାର କରେ, ସିଧାସଳଖ କିମ୍ବା ପ୍ଲାଟଫର୍ମର ୱେବ୍ ଭ୍ୟୁ API ମାଧ୍ୟମରେ ହେଉ, ସ୍ପଷ୍ଟ ଭାବରେ ସମର୍ଥିତ ନୁହେଁ | ଯଦିଓ, ବୁଟଷ୍ଟ୍ରାପ୍ (ଅଧିକାଂଶ କ୍ଷେତ୍ରରେ) ଏହି ବ୍ରାଉଜର୍ ଗୁଡିକରେ ସଠିକ୍ ଭାବରେ ପ୍ରଦର୍ଶନ ଏବଂ କାର୍ଯ୍ୟ କରିବା ଉଚିତ୍ | ଅଧିକ ନିର୍ଦ୍ଦିଷ୍ଟ ସମର୍ଥନ ସୂଚନା ନିମ୍ନରେ ପ୍ରଦାନ କରାଯାଇଛି |

ଆପଣ ଆମର ସମର୍ଥିତ ବ୍ରାଉଜର୍ ପରିସର ଏବଂ ସେମାନଙ୍କର ସଂସ୍କରଣଗୁଡିକ ଆମ ଭିତରେ.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 ଉପସର୍ଗ ମାଧ୍ୟମରେ ଉଦ୍ଦିଷ୍ଟ ବ୍ରାଉଜର୍ ସମର୍ଥନ ପରିଚାଳନା କରିବାକୁ ଆମେ ଅଟୋଫ୍ରେଫିକ୍ସର୍ ବ୍ୟବହାର କରୁ, ଯାହା ଏହି ବ୍ରାଉଜର୍ ସଂସ୍କରଣଗୁଡ଼ିକୁ ପରିଚାଳନା କରିବା ପାଇଁ ବ୍ରାଉଜର୍ ତାଲିକା ବ୍ୟବହାର କରେ | ତୁମର ପ୍ରୋଜେକ୍ଟରେ ଏହି ଉପକରଣଗୁଡ଼ିକୁ କିପରି ସଂଯୋଗ କରାଯିବ ସେ ସମ୍ବନ୍ଧରେ ସେମାନଙ୍କର ଡକ୍ୟୁମେଣ୍ଟେସନ୍ ସହିତ ପରାମର୍ଶ କର |

ମୋବାଇଲ୍ ଡିଭାଇସ୍ |

ସାଧାରଣତ speaking କହିବାକୁ ଗଲେ, ବୁଟଷ୍ଟ୍ରାପ୍ ପ୍ରତ୍ୟେକ ପ୍ରମୁଖ ପ୍ଲାଟଫର୍ମର ଡିଫଲ୍ଟ ବ୍ରାଉଜର୍ଗୁଡ଼ିକର ସର୍ବଶେଷ ସଂସ୍କରଣକୁ ସମର୍ଥନ କରେ | ଧ୍ୟାନ ଦିଅନ୍ତୁ ଯେ ପ୍ରକ୍ସି ବ୍ରାଉଜର୍ (ଯେପରିକି ଅପେରା ମିନି, ଅପେରା ମୋବାଇଲର ଟର୍ବୋ ମୋଡ୍, ୟୁସି ବ୍ରାଉଜର ମିନି, ଆମାଜନ ସିଲ୍କ) ସମର୍ଥିତ ନୁହେଁ |

କ୍ରୋମ୍ ଫାୟାରଫକ୍ସ | ସଫାରି | ଆଣ୍ଡ୍ରଏଡ୍ ବ୍ରାଉଜର୍ ଏବଂ ୱେବ୍ ଭିଭ୍ | ମାଇକ୍ରୋସଫ୍ଟ ଏଜ୍
ଆଣ୍ଡ୍ରଏଡ୍ | ସମର୍ଥିତ | ସମର୍ଥିତ | N / A ଆଣ୍ଡ୍ରଏଡ୍ v5.0 + ସମର୍ଥିତ | ସମର୍ଥିତ |
iOS ସମର୍ଥିତ | ସମର୍ଥିତ | ସମର୍ଥିତ | N / A ସମର୍ଥିତ |
ୱିଣ୍ଡୋଜ୍ 10 ମୋବାଇଲ୍ | N / A N / A N / A N / A ସମର୍ଥିତ |

ଡେସ୍କଟପ୍ ବ୍ରାଉଜର୍ |

ସେହିଭଳି, ଅଧିକାଂଶ ଡେସ୍କଟପ୍ ବ୍ରାଉଜରର ସର୍ବଶେଷ ସଂସ୍କରଣ ସମର୍ଥିତ |

କ୍ରୋମ୍ ଫାୟାରଫକ୍ସ | ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ | ମାଇକ୍ରୋସଫ୍ଟ ଏଜ୍ ଅପେରା ସଫାରି |
ମ୍ୟାକ୍ ସମର୍ଥିତ | ସମର୍ଥିତ | N / A N / A ସମର୍ଥିତ | ସମର୍ଥିତ |
ୱିଣ୍ଡୋଜ୍ ସମର୍ଥିତ | ସମର୍ଥିତ | ସମର୍ଥିତ, IE10 + ସମର୍ଥିତ | ସମର୍ଥିତ | ସମର୍ଥିତ ନୁହେଁ |

ଫାୟାରଫକ୍ସ ପାଇଁ, ଅତ୍ୟାଧୁନିକ ସାଧାରଣ ସ୍ଥିର ପ୍ରକାଶନ ସହିତ, ଆମେ ଫାୟାରଫକ୍ସର ସର୍ବଶେଷ ବିସ୍ତାରିତ ସମର୍ଥନ ପ୍ରକାଶନ (ESR) ସଂସ୍କରଣକୁ ମଧ୍ୟ ସମର୍ଥନ କରୁ |

ଅଣଆନୁଷ୍ଠାନିକ ଭାବରେ, ବୁଟଷ୍ଟ୍ରାପ୍ କ୍ରୋମିୟମ୍ ଏବଂ ଲିନକ୍ସ ପାଇଁ କ୍ରୋମ୍, ଲିନକ୍ସ ପାଇଁ ଫାୟାରଫକ୍ସ ଏବଂ ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ 9 ରେ ଯଥେଷ୍ଟ ଭଲ ଦେଖାଯିବା ଉଚିତ, ଯଦିଓ ସେଗୁଡିକ ସରକାରୀ ଭାବରେ ସମର୍ଥିତ ନୁହେଁ |

କିଛି ବ୍ରାଉଜର୍ ବଗ୍ ର ଏକ ତାଲିକା ପାଇଁ ଯାହା ବୁଟଷ୍ଟ୍ରାପ୍ ସହିତ ମୁକାବିଲା କରିବାକୁ ପଡିବ, ଆମର ୱାଲ୍ ଅଫ୍ ବ୍ରାଉଜର୍ ବଗ୍ ଦେଖନ୍ତୁ |

ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ |

ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ 10+ ସମର୍ଥିତ; IE9 ଏବଂ ତଳ ନୁହେଁ | ଦୟାକରି ସଚେତନ ରୁହନ୍ତୁ ଯେ କିଛି CSS3 ଗୁଣ ଏବଂ HTML5 ଉପାଦାନଗୁଡିକ IE10 ରେ ସମ୍ପୂର୍ଣ୍ଣ ଭାବରେ ସମର୍ଥିତ ନୁହଁନ୍ତି, କିମ୍ବା ପୂର୍ଣ୍ଣ କାର୍ଯ୍ୟକାରିତା ପାଇଁ ଉପସର୍ଗ ଗୁଣ ଆବଶ୍ୟକ କରନ୍ତି | CSS3 ଏବଂ HTML5 ବ features ଶିଷ୍ଟ୍ୟଗୁଡିକର ବ୍ରାଉଜର୍ ସମର୍ଥନ ବିଷୟରେ ସବିଶେଷ ତଥ୍ୟ ପାଇଁ ମୁଁ ବ୍ୟବହାର କରିପାରିବି କି ? ଯଦି ଆପଣ IE8-9 ସମର୍ଥନ ଆବଶ୍ୟକ କରନ୍ତି, ବୁଟଷ୍ଟ୍ରାପ୍ 3 ବ୍ୟବହାର କରନ୍ତୁ |

ମୋବାଇଲରେ ମୋଡାଲ୍ ଏବଂ ଡ୍ରପ୍ ଡାଉନ୍ |

ଓଭରଫ୍ଲୋ ଏବଂ ସ୍କ୍ରୋଲିଂ |

overflow: hidden;ଉପାଦାନ ପାଇଁ ସମର୍ଥନ <body>iOS ଏବଂ ଆଣ୍ଡ୍ରଏଡରେ ସୀମିତ ଅଟେ | ସେହି ଉଦ୍ଦେଶ୍ୟରେ, ଯେତେବେଳେ ଆପଣ ସେହି ଉପକରଣଗୁଡ଼ିକର ବ୍ରାଉଜର୍ ମଧ୍ୟରୁ ଏକ ମୋଡାଲର ଉପର କିମ୍ବା ତଳ ଅତୀତକୁ ସ୍କ୍ରୋଲ୍ କରନ୍ତି, <body>ବିଷୟବସ୍ତୁ ସ୍କ୍ରୋଲ୍ କରିବା ଆରମ୍ଭ କରିବ | Chrome ବଗ୍ # 175502 (Chrome v40 ରେ ସ୍ଥିର ହୋଇଛି) ଏବଂ ୱେବ୍ କିଟ୍ ବଗ୍ # 153852 ଦେଖନ୍ତୁ |

iOS ପାଠ୍ୟ କ୍ଷେତ୍ର ଏବଂ ସ୍କ୍ରୋଲିଂ |

<input>IOS 9.2 ପରି, ଯେତେବେଳେ ଏକ ମୋଡାଲ୍ ଖୋଲା ଅଛି, ଯଦି ଏକ ସ୍କ୍ରୋଲ୍ ଅଙ୍ଗଭଙ୍ଗୀର ପ୍ରାରମ୍ଭିକ ସ୍ପର୍ଶ ଏକ ପାଠ୍ୟ କିମ୍ବା a ର ସୀମା ମଧ୍ୟରେ ଅଛି , ମୋଡାଲ୍ ତଳେ <textarea>ଥିବା <body>ବିଷୟବସ୍ତୁ ମୋଡାଲ୍ ପରିବର୍ତ୍ତେ ସ୍କ୍ରୋଲ୍ ହେବ | ୱେବ୍ କିଟ୍ ବଗ୍ # 153856 ଦେଖନ୍ତୁ |

.dropdown-backdropZ- ସୂଚକାଙ୍କ ଜଟିଳତା ହେତୁ ନାଭରେ iOS ରେ ଉପାଦାନ ବ୍ୟବହୃତ ହୁଏ ନାହିଁ | ଏହିପରି, ନାଭବାରରେ ଡ୍ରପଡାଉନ୍ ବନ୍ଦ କରିବାକୁ, ଆପଣଙ୍କୁ ସିଧାସଳଖ ଡ୍ରପଡାଉନ୍ ଉପାଦାନ (କିମ୍ବା ଅନ୍ୟ କ element ଣସି ଉପାଦାନ ଯାହା iOS ରେ ଏକ କ୍ଲିକ୍ ଇଭେଣ୍ଟକୁ ଅଗ୍ନି ଦେବ ) କ୍ଲିକ୍ କରିବାକୁ ପଡିବ |

ବ୍ରାଉଜର୍ ଜୁମିଙ୍ଗ୍ |

ପେଜ୍ ଜୁମିଙ୍ଗ୍ ଅବଶ୍ୟ ବୁଟଷ୍ଟ୍ରାପ୍ ଏବଂ ବାକି ୱେବରେ କିଛି ଉପାଦାନରେ କଳାକୃତି ଉପସ୍ଥାପନ କରିଥାଏ | ସମସ୍ୟା ଉପରେ ନିର୍ଭର କରି, ଆମେ ଏହାକୁ ସମାଧାନ କରିବାକୁ ସକ୍ଷମ ହୋଇପାରିବା (ପ୍ରଥମେ ଖୋଜ ଏବଂ ପରେ ଆବଶ୍ୟକ ହେଲେ ଏକ ସମସ୍ୟା ଖୋଲନ୍ତୁ) | ତଥାପି, ଆମେ ଏଗୁଡିକୁ ଅଣଦେଖା କରିବାକୁ ପ୍ରବୃତ୍ତି କରୁ କାରଣ ସେମାନଙ୍କର ପ୍ରାୟତ ha ହ୍ୟାକି ୱାର୍କଆଉଟ୍ ବ୍ୟତୀତ ଅନ୍ୟ କ direct ଣସି ପ୍ରତ୍ୟକ୍ଷ ସମାଧାନ ନଥାଏ |

ଷ୍ଟିକ୍ :hover/ :focusiOS ରେ |

:hoverଅଧିକାଂଶ ଟଚ୍ ଡିଭାଇସରେ ଏହା ସମ୍ଭବ ନୁହେଁ, ଆଇଓଏସ୍ ଏହି ଆଚରଣକୁ ଅନୁକରଣ କରିଥାଏ, ଫଳସ୍ୱରୂପ “ଷ୍ଟିକି” ହୋଭର ଶ yles ଳୀ ଯାହା ଗୋଟିଏ ଉପାଦାନକୁ ଟ୍ୟାପ୍ କରିବା ପରେ ରହିଥାଏ | ଯେତେବେଳେ ଉପଭୋକ୍ତାମାନେ ଅନ୍ୟ ଏକ ଉପାଦାନ ଟ୍ୟାପ୍ କରନ୍ତି ଏହି ହୋଭର ଶ yles ଳୀଗୁଡ଼ିକ ଅପସାରିତ ହୁଏ | ଏହି ଆଚରଣ ମୁଖ୍ୟତ und ଅବାଞ୍ଛିତ ଭାବରେ ବିବେଚନା କରାଯାଏ ଏବଂ ଆଣ୍ଡ୍ରଏଡ୍ କିମ୍ବା ୱିଣ୍ଡୋଜ୍ ଡିଭାଇସରେ ଏକ ସମସ୍ୟା ହୋଇନଥିବା ପରି ଦେଖାଯାଏ |

ଆମର v4 ଆଲଫା ଏବଂ ବିଟା ପ୍ରକାଶନରେ, ଆମେ ଏକ ମିଡିଆ ଜିଜ୍ଞାସା ଶିମ୍ ଚୟନ କରିବା ପାଇଁ ଅସମ୍ପୂର୍ଣ୍ଣ ଏବଂ ମନ୍ତବ୍ୟ ଦେଇଥିଲୁ ଯାହା ହୋଭର୍ ଅନୁକରଣ କରୁଥିବା ଟଚ୍ ଡିଭାଇସ୍ ବ୍ରାଉଜରରେ ହୋଭର ଶ yles ଳୀକୁ ଅକ୍ଷମ କରିବ | ଏହି କାର୍ଯ୍ୟ କଦାପି ସଂପୂର୍ଣ୍ଣ ରୂପେ ସମାପ୍ତ କିମ୍ବା ସକ୍ଷମ ହୋଇନଥିଲା, କିନ୍ତୁ ସଂପୂର୍ଣ୍ଣ ଭାଙ୍ଗିବା ଠାରୁ ଦୂରେଇ ରହିବା ପାଇଁ, ଆମେ ଏହି ଶିମ୍କୁ ନାପସନ୍ଦ କରିବାକୁ ଏବଂ ସିଉଡୋ-କ୍ଲାସ୍ ପାଇଁ ସର୍ଟକଟ୍ ଭାବରେ ମିଶ୍ରଣକୁ ବାଛିଛୁ |

ମୁଦ୍ରଣ

କେତେକ ଆଧୁନିକ ବ୍ରାଉଜରରେ ମଧ୍ୟ ପ୍ରିଣ୍ଟିଙ୍ଗ୍ କ irk ତୁକିଆ ହୋଇପାରେ |

Safari v8.0 ପରି, ସ୍ଥିର-ଓସାର .containerଶ୍ରେଣୀର ବ୍ୟବହାର ପ୍ରିଣ୍ଟ କରିବା ସମୟରେ ସଫାରିକୁ ଏକ ଅସାଧାରଣ ଛୋଟ ଫଣ୍ଟ ଆକାର ବ୍ୟବହାର କରିପାରେ | ଅଧିକ ବିବରଣୀ ପାଇଁ ଇସୁ # 14868 ଏବଂ ୱେବ୍ କିଟ୍ ବଗ୍ # 138192 ଦେଖନ୍ତୁ | ଗୋଟିଏ ସମ୍ଭାବ୍ୟ କାର୍ଯ୍ୟ ହେଉଛି ନିମ୍ନଲିଖିତ CSS:

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

ଆଣ୍ଡ୍ରଏଡ୍ ଷ୍ଟକ୍ ବ୍ରାଉଜର୍ |

ବାକ୍ସ ବାହାରେ, ଆଣ୍ଡ୍ରଏଡ୍ 4.1 (ଏବଂ କିଛି ନୂତନ ରିଲିଜ୍ ମଧ୍ୟ ବୋଧହୁଏ) ବ୍ରାଉଜର୍ ଆପ୍ ସହିତ ଡିଫଲ୍ଟ ୱେବ୍ ବ୍ରାଉଜର୍ ଭାବରେ ପସନ୍ଦ କରେ (କ୍ରୋମ୍ ତୁଳନାରେ) | ଦୁର୍ଭାଗ୍ୟବଶତ।, ବ୍ରାଉଜର୍ ଆପରେ ସାଧାରଣତ CS CSS ସହିତ ଅନେକ ତ୍ରୁଟି ଏବଂ ଅସଙ୍ଗତି ଅଛି |

ମେନୁ ଚୟନ କରନ୍ତୁ |

ଉପାଦାନଗୁଡିକ ଉପରେ , ଆଣ୍ଡ୍ରଏଡ୍ ଷ୍ଟକ୍ ବ୍ରାଉଜର୍ ଯଦି ଏବଂ / କିମ୍ବା ପ୍ରୟୋଗ <select>ହୁଏ ତେବେ ପାର୍ଶ୍ୱ ନିୟନ୍ତ୍ରଣ ପ୍ରଦର୍ଶନ କରିବ ନାହିଁ | ( ସବିଶେଷ ତଥ୍ୟ ପାଇଁ ଏହି ଷ୍ଟାକ୍ ଓଭରଫ୍ଲୋ ପ୍ରଶ୍ନ ଦେଖନ୍ତୁ |) ଆପତ୍ତିଜନକ 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>

ଏକ ଉଦାହରଣ ଦେଖିବାକୁ ଚାହୁଁଛନ୍ତି କି? ଏହି JS ବିନ୍ ଡେମୋ ଦେଖନ୍ତୁ |

ବ id ଧତାକାରୀ |

In order to provide the best possible experience to old and buggy browsers, Bootstrap uses CSS browser hacks in several places to target special CSS to certain browser versions in order to work around bugs in the browsers themselves. These hacks understandably cause CSS validators to complain that they are invalid. In a couple places, we also use bleeding-edge CSS features that aren’t yet fully standardized, but these are used purely for progressive enhancement.

These validation warnings don’t matter in practice since the non-hacky portion of our CSS does fully validate and the hacky portions don’t interfere with the proper functioning of the non-hacky portion, hence why we deliberately ignore these particular warnings.

ଆମର HTML ଡକଗୁଡ଼ିକରେ ମଧ୍ୟ କିଛି ନିର୍ଦ୍ଦିଷ୍ଟ ଫାୟାରଫକ୍ସ ବଗ୍ ପାଇଁ ଏକ ୱାର୍କଆଉଟ୍ ଅନ୍ତର୍ଭୂକ୍ତ ହେତୁ କିଛି ଗୁରୁତ୍ୱପୂର୍ଣ୍ଣ ଏବଂ ଅପରିପକ୍ୱ HTML ବ valid ଧତା ଚେତାବନୀ ଅଛି |