ମୁଖ୍ୟ ବିଷୟବସ୍ତୁକୁ ଯାଆନ୍ତୁ | ଡକସ୍ ନେଭିଗେସନ୍ କୁ ଯାଆନ୍ତୁ |
in English

V5 କୁ ସ୍ଥାନାନ୍ତରିତ |

V4 ରୁ v5 କୁ ସ୍ଥାନାନ୍ତର କରିବାରେ ସାହାଯ୍ୟ କରିବାକୁ ବୁଟଷ୍ଟ୍ରାପ୍ ଉତ୍ସ ଫାଇଲ୍, ଡକ୍ୟୁମେଣ୍ଟେସନ୍, ଏବଂ ଉପାଦାନଗୁଡ଼ିକରେ ପରିବର୍ତ୍ତନଗୁଡ଼ିକୁ ଟ୍ରାକ୍ ଏବଂ ସମୀକ୍ଷା କରନ୍ତୁ |

ଏହି ପୃଷ୍ଠାରେ |

ନିର୍ଭରଶୀଳତା |

  • JQuery ଡ୍ରପ୍ ହୋଇଛି |
  • Popper v1.x ରୁ Popper v2.x କୁ ନବୀକରଣ କରାଯାଇଛି |
  • ଲିବ୍ସାସ୍କୁ ଦିଆଯାଇଥିବା ଆମର ସାସ୍ କମ୍ପାଇଲର୍ ପୁରୁଣା ହୋଇଥିବାରୁ ଡାର୍ଟ ସାସ୍ ସହିତ ଲିବସାସ୍ ବଦଳାଗଲା |
  • ଆମର ଡକ୍ୟୁମେଣ୍ଟେସନ୍ ନିର୍ମାଣ ପାଇଁ ଜେକିଲରୁ ହୁଗୋକୁ ସ୍ଥାନାନ୍ତରିତ |

ବ୍ରାଉଜର୍ ସମର୍ଥନ

  • ଇଣ୍ଟରନେଟ୍ ଏକ୍ସପ୍ଲୋରର୍ 10 ଏବଂ 11 ଡ୍ରପ୍ ହୋଇଛି |
  • ମାଇକ୍ରୋସଫ୍ଟ ଏଜ୍ <16 (ପୁରୁଣା ଏଜ୍) ଡ୍ରପ୍ ହୋଇଛି |
  • ଫାୟାରଫକ୍ସ <60
  • ସଫାରି <12
  • IOS ସଫାରି <12
  • ଡ୍ରପ୍ ହୋଇଥିବା କ୍ରୋମ୍ <60

ଡକ୍ୟୁମେଣ୍ଟେସନ୍ ପରିବର୍ତ୍ତନ |

  • ମୂଳପୃଷ୍ଠା, ଡକସ୍ ଲେଆଉଟ୍, ଏବଂ ଫୁଟର୍ |
  • ନୂତନ ପାର୍ସଲ୍ ଗାଇଡ୍ ଯୋଗ କରାଯାଇଛି |
  • Sass, ଗ୍ଲୋବାଲ୍ ବିନ୍ୟାସ ବିକଳ୍ପ, ରଙ୍ଗ ସ୍କିମ୍, CSS ଭେରିଏବଲ୍, ଏବଂ ଅଧିକ ବିଷୟରେ v4 ର ଥିମ୍ ପୃଷ୍ଠାକୁ ବଦଳାଇ ନୂତନ କଷ୍ଟୋମାଇଜ୍ ବିଭାଗ ଯୋଡାଗଲା |
  • ସମସ୍ତ ଫର୍ମ ଡକ୍ୟୁମେଣ୍ଟେସନ୍ କୁ ନୂତନ ଫର୍ମ ବିଭାଗରେ ପୁନ organ ସଂଗଠିତ କରି ବିଷୟବସ୍ତୁକୁ ଅଧିକ ଫୋକସ୍ ପୃଷ୍ଠାରେ ପୃଥକ କରି |
  • ସେହିଭଳି, ଗ୍ରୀଡ୍ ବିଷୟବସ୍ତୁକୁ ଅଧିକ ସ୍ପଷ୍ଟ ଭାବରେ ଲେଆଉଟ୍ ବିଭାଗକୁ ଅପଡେଟ୍ କଲା |
  • “ନାଭସ୍” ଉପାଦାନ ପୃଷ୍ଠାର ନାମ “ନାଭସ୍ ଏବଂ ଟ୍ୟାବ୍ସ” ରେ ନାମିତ |
  • “ଚେକ୍” ପୃଷ୍ଠାର ନାମ “ଚେକ୍ ଏବଂ ରେଡିଓ” |
  • ନାଭବାର୍କୁ ପୁନ es ଡିଜାଇନ୍ କରି ଆମର ସାଇଟ୍ ଏବଂ ଡକସ୍ ସଂସ୍କରଣକୁ ଯିବା ସହଜ କରିବାକୁ ଏକ ନୂତନ ସବନାଭ୍ ଯୋଡିଛି |
  • ସନ୍ଧାନ କ୍ଷେତ୍ର ପାଇଁ ନୂତନ କୀବୋର୍ଡ୍ ସର୍ଟକଟ୍ ଯୋଡାଗଲା : Ctrl + /।

ସାସ୍ |

  • ଅନାବଶ୍ୟକ ମୂଲ୍ୟଗୁଡିକ ଅପସାରଣ କରିବାକୁ ସହଜ କରିବାକୁ ଆମେ ଡିଫଲ୍ଟ ସାସ୍ ମାନଚିତ୍ର ମିଶ୍ରଣକୁ ଖୋଳିଛୁ | ମନେରଖନ୍ତୁ ତୁମକୁ ବର୍ତ୍ତମାନ ସାସ୍ ମାନଚିତ୍ରରେ ସମସ୍ତ ମୂଲ୍ୟ ବ୍ୟାଖ୍ୟା କରିବାକୁ ପଡିବ $theme-colors| ସାସ୍ ମାନଚିତ୍ରଗୁଡିକ ସହିତ କିପରି ମୁକାବିଲା କରିବେ ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବାcolor-yiq()ଫଙ୍କସନ୍ ଏବଂ ଆନୁସଙ୍ଗିକ ଭେରିଏବଲ୍ସର ନାମ ପରିବର୍ତ୍ତନ ହୋଇଛି color-contrast()ଯେହେତୁ ଏହା ଆଉ YIQ ରଙ୍ଗ ସ୍ପେସ୍ ସହିତ ଜଡିତ ନୁହେଁ | # 30168 ଦେଖନ୍ତୁ |

    • $yiq-contrasted-thresholdକୁ ପୁନ amed ନାମିତ କରାଯାଇଛି $min-contrast-ratio|
    • $yiq-text-darkଏବଂ $yiq-text-lightଯଥାକ୍ରମେ ନାମିତ $color-contrast-darkଏବଂ $color-contrast-light|

  • ଭାଙ୍ଗିବାଅଧିକ ଯୁକ୍ତିଯୁକ୍ତ ଆଭିମୁଖ୍ୟ ପାଇଁ ମିଡିଆ ଜିଜ୍ଞାସା ମିଶ୍ରଣ ପାରାମିଟରଗୁଡିକ ପରିବର୍ତ୍ତନ ହୋଇଛି |

    • media-breakpoint-down()ପରବର୍ତ୍ତୀ ବ୍ରେକପଏଣ୍ଟ ବଦଳରେ ବ୍ରେକପଏଣ୍ଟ ନିଜେ ବ୍ୟବହାର କରିଥାଏ (ଉଦାହରଣ ସ୍ୱରୂପ, ଏହାଠାରୁ ଛୋଟ ଟାର୍ଗେଟ ଭ୍ୟୁପୋର୍ଟ media-breakpoint-down(lg)ବଦଳରେ ) |media-breakpoint-down(md)lg
    • ସେହିଭଳି, ଦ୍ୱିତୀୟ ପାରାମିଟର media-breakpoint-between()ମଧ୍ୟ ପରବର୍ତ୍ତୀ ବ୍ରେକପଏଣ୍ଟ ପରିବର୍ତ୍ତେ ନିଜେ ବ୍ରେକପଏଣ୍ଟ ବ୍ୟବହାର କରେ (ଉଦାହରଣ ସ୍ୱରୂପ, ଏବଂ ମଧ୍ୟରେ ଲକ୍ଷ୍ୟସ୍ଥଳ ଦୃଶ୍ୟ media-between(sm, lg)ବଦଳରେ ) |media-breakpoint-between(sm, md)smlg

  • ଭାଙ୍ଗିବାପ୍ରିଣ୍ଟ୍ ଶ yles ଳୀ ଏବଂ $enable-print-stylesଭେରିଏବଲ୍ ଅପସାରିତ | ପ୍ରିଣ୍ଟ୍ ଡିସପ୍ଲେ କ୍ଲାସ୍ ଗୁଡିକ ଏପର୍ଯ୍ୟନ୍ତ ଅଛି | # 28339 ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବାଭେରିଏବଲ୍ ସପକ୍ଷରେ ଡ୍ରପ୍ color(), theme-color()ଏବଂ ଫଙ୍କସନ୍ସ | # 29083 ଦେଖନ୍ତୁ |gray()

  • ଭାଙ୍ଗିବାtheme-color-level()ଫଙ୍କସନ୍ ର ନାମ ପରିବର୍ତ୍ତନ color-level()ଏବଂ ବର୍ତ୍ତମାନ କେବଳ ରଙ୍ଗ ବଦଳରେ ଆପଣ ଚାହୁଁଥିବା ଯେକ color ଣସି ରଙ୍ଗକୁ ଗ୍ରହଣ କରନ୍ତି $theme-color| ଦେଖନ୍ତୁ # 29083 ଦେଖନ୍ତୁ: color-level() ପରେ ଡ୍ରପ୍ ହୋଇଗଲା v5.0.0-alpha3|

  • ଭାଙ୍ଗିବାନାମ ପରିବର୍ତ୍ତନ $enable-prefers-reduced-motion-media-queryଏବଂ ସଂକ୍ଷିପ୍ତତା $enable-pointer-cursor-for-buttonsପାଇଁ |$enable-reduced-motion$enable-button-pointers

  • ଭାଙ୍ଗିବାମିଶ୍ରଣକୁ bg-gradient-variant()ହଟାଇଲେ | ଉତ୍ପାଦିତ ଶ୍ରେଣୀଗୁଡ଼ିକ .bg-gradientପରିବର୍ତ୍ତେ ଉପାଦାନଗୁଡ଼ିକରେ ଗ୍ରେଡିଏଣ୍ଟ୍ ଯୋଡିବାକୁ ଶ୍ରେଣୀ ବ୍ୟବହାର କରନ୍ତୁ |.bg-gradient-*

  • ଭାଙ୍ଗିବା ପୂର୍ବରୁ ପୁରୁଣା ହୋଇଥିବା ମିଶ୍ରଣଗୁଡିକ ଅପସାରଣ କରାଯାଇଛି:

    • hover,, ଏବଂ hover-focus_plain-hover-focushover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(ସଂପୃକ୍ତ ୟୁଟିଲିଟି କ୍ଲାସ୍ ମଧ୍ୟ ଛାଡିଦେଲା, .text-hide)
    • visibility()
    • form-control-focus()

  • ଭାଙ୍ଗିବାସାସ୍ ର ନିଜସ୍ୱ ରଙ୍ଗ ସ୍କେଲିଂ ଫଙ୍କସନ୍ ସହିତ ଧକ୍କା ନହେବା scale-color()ପାଇଁ ପୁନ function ନାମକରଣ |shift-color()

  • box-shadowମିକ୍ସିନଗୁଡ଼ିକ ବର୍ତ୍ତମାନ ମୂଲ୍ୟଗୁଡ଼ିକୁ ଅନୁମତି ଦିଏ ଏବଂ ଏକାଧିକ ଆର୍ଗୁମେଣ୍ଟରୁ nullଡ୍ରପ୍ ହୁଏ | # 30394 ଦେଖନ୍ତୁ |none

  • ମିଶ୍ରଣର ବର୍ତ୍ତମାନ border-radius()ଏକ ଡିଫଲ୍ଟ ମୂଲ୍ୟ ଅଛି |

ରଙ୍ଗ ବ୍ୟବସ୍ଥା |

  • ରଙ୍ଗ ପ୍ରଣାଳୀ ଯାହା ସହିତ କାମ କଲା color-level()ଏବଂ $theme-color-intervalଏକ ନୂତନ ରଙ୍ଗ ପ୍ରଣାଳୀ ସପକ୍ଷରେ ଅପସାରିତ ହେଲା | ଆମର କୋଡବେସରେ ଥିବା ସମସ୍ତ lighten()ଏବଂ ଫଙ୍କସନ୍ ଗୁଡିକ ଦ୍ୱାରା darken()ବଦଳାଯାଏ | ଏହି କାର୍ଯ୍ୟଗୁଡ଼ିକ ନିର୍ଦ୍ଦିଷ୍ଟ ପରିମାଣରେ ଏହାର ହାଲୁକା ପରିବର୍ତ୍ତନ କରିବା ପରିବର୍ତ୍ତେ ଧଳା କିମ୍ବା କଳା ସହିତ ରଙ୍ଗକୁ ମିଶ୍ରଣ କରିବ | ଏହାର ଓଜନ ପାରାମିଟର ସକରାତ୍ମକ କିମ୍ବା ନକାରାତ୍ମକ ଉପରେ ନିର୍ଭର କରି ଇଚ୍ଛା ରଙ୍ଗକୁ ଛାଇ କିମ୍ବା ଛାଇ କରିବ | ଅଧିକ ବିବରଣୀ ପାଇଁ # 30622 ଦେଖନ୍ତୁ |tint-color()shade-color()shift-color()

  • ପ୍ରତ୍ୟେକ ସାସ୍ ଭେରିଏବଲ୍ ଭାବରେ ପ୍ରତ୍ୟେକ ମୂଳ ରଙ୍ଗ ପାଇଁ ନଅଟି ଅଲଗା ରଙ୍ଗ ପ୍ରଦାନ କରି ପ୍ରତ୍ୟେକ ରଙ୍ଗ ପାଇଁ ନୂତନ ଟିଣ୍ଟ୍ ଏବଂ ଛାୟା ଯୋଗ କରାଯାଇଛି |

  • ଉନ୍ନତ ରଙ୍ଗ ବିପରୀତ | 3: 1 ରୁ 4.5: 1 ପର୍ଯ୍ୟନ୍ତ ବମ୍ପଡ୍ ରଙ୍ଗ ବିପରୀତ ଅନୁପାତ ଏବଂ WCAG 2.1 AA ବିପରୀତ ନିଶ୍ଚିତ କରିବାକୁ ନୀଳ, ସବୁଜ, ସିଆନ୍, ଏବଂ ଗୋଲାପୀ ରଙ୍ଗ ଅପଡେଟ୍ | ଆମର ରଙ୍ଗ ବିପରୀତ ରଙ୍ଗକୁ ମଧ୍ୟ $gray-900ବଦଳାଇଲା $black|

  • tint-color()ଆମର ରଙ୍ଗ ସିଷ୍ଟମକୁ ସମର୍ଥନ କରିବାକୁ, ଆମେ ଆମର ରଙ୍ଗକୁ ସଠିକ୍ ଭାବରେ ମିଶ୍ରଣ କରିବା ପାଇଁ ନୂତନ କଷ୍ଟମ୍ ଏବଂ shade-color()ଫଙ୍କସନ୍ ଯୋଡିଛୁ |

ଗ୍ରୀଡ୍ ଅଦ୍ୟତନଗୁଡିକ |

  • ନୂତନ ବ୍ରେକପଏଣ୍ଟ! ଏବଂ ଅପ୍ ପାଇଁ ନୂତନ xxlବ୍ରେକପଏଣ୍ଟ ଯୋଡିଛି | 1400pxଅନ୍ୟ ସମସ୍ତ ବ୍ରେକପଏଣ୍ଟରେ କ changes ଣସି ପରିବର୍ତ୍ତନ ନାହିଁ |

  • ଉନ୍ନତ ଗୁଟଖା | ଗୁଟର୍ସ ବର୍ତ୍ତମାନ ରେମ୍ସରେ ସେଟ୍ ହୋଇଛି, ଏବଂ v4 ( 1.5remକିମ୍ବା ପ୍ରାୟ 24px, ତଳକୁ 30px) ଠାରୁ ସଂକୀର୍ଣ୍ଣ | ଏହା ଆମର ସ୍ପେସ୍ ୟୁଟିଲିଟି ସହିତ ଆମର ଗ୍ରୀଡ୍ ସିଷ୍ଟମର ଗୁଟର୍ଗୁଡ଼ିକୁ ଆଲାଇନ୍ କରେ |

    • ଭୂସମାନ୍ତର / ଭୂଲମ୍ବ ଗୁଟର, ଭୂସମାନ୍ତର ଗୁଟର ଏବଂ ଭୂଲମ୍ବ ଗୁଟରକୁ ନିୟନ୍ତ୍ରଣ କରିବା ପାଇଁ ନୂତନ ଗୁଟର ଶ୍ରେଣୀ ( .g-*,, .gx-*ଏବଂ ) ଯୋଗ କରାଯାଇଛି |.gy-*
    • ଭାଙ୍ଗିବାନୂତନ ଗୁଟର ଉପଯୋଗିତା ସହିତ ମେଳ .no-guttersକରିବାକୁ ପୁନ amed ନାମିତ |.g-0

  • ସ୍ତମ୍ଭଗୁଡିକ ଆଉ ପ୍ରୟୋଗ ହୋଇନାହିଁ, ତେଣୁ ସେହି ଆଚରଣକୁ ପୁନ restore ସ୍ଥାପନ କରିବା ପାଇଁ ଆପଣଙ୍କୁ କିଛି ଉପାଦାନରେ position: relativeଯୋଗ କରିବାକୁ ପଡିପାରେ |.position-relative

  • ଭାଙ୍ଗିବାଅନେକ .order-*କ୍ଲାସ୍ ଛାଡିଦେଲେ ଯାହା ପ୍ରାୟତ un ଅବ୍ୟବହୃତ ହୋଇଗଲା | ଆମେ ବର୍ତ୍ତମାନ କେବଳ ବାକ୍ସ ବାହାରେ ଯୋଗାଇଦେଉ .order-1|.order-5

  • ଭାଙ୍ଗିବାଉପାଦାନକୁ ଡ୍ରପ୍ .mediaକରାଗଲା କାରଣ ଏହା ସହଜରେ ଉପଯୋଗୀତା ସହିତ ନକଲ ହୋଇପାରିବ | ଏକ ଉଦାହରଣ ପାଇଁ # 28265 ଏବଂ ଫ୍ଲେକ୍ସ ୟୁଟିଲିଟିଜ୍ ପେଜ୍ ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବା bootstrap-grid.cssବର୍ତ୍ତମାନ କେବଳ box-sizing: border-boxଗ୍ଲୋବାଲ୍ ବକ୍ସ-ସାଇଜ୍ ପୁନ res ସେଟ୍ କରିବା ପରିବର୍ତ୍ତେ ସ୍ତମ୍ଭରେ ପ୍ରଯୁଜ୍ୟ | ଏହି ଉପାୟରେ, ଆମର ଗ୍ରୀଡ୍ ଶ yles ଳୀଗୁଡିକ ବାଧା ବିନା ଅଧିକ ସ୍ଥାନରେ ବ୍ୟବହାର କରାଯାଇପାରିବ |

  • $enable-grid-classesକଣ୍ଟେନର ଶ୍ରେଣୀର ପି generation ଼ିକୁ ଆଉ ଅକ୍ଷମ କରେ ନାହିଁ | # 29146 ଦେଖନ୍ତୁ |

  • make-colନିର୍ଦ୍ଦିଷ୍ଟ ଆକାର ବିନା ସମାନ ସ୍ତମ୍ଭରେ ଡିଫଲ୍ଟ ଭାବରେ ମିକ୍ସିନକୁ ଅଦ୍ୟତନ କଲେ |

ବିଷୟବସ୍ତୁ, ପୁନ o ବୁଟ୍ ଇତ୍ୟାଦି |

  • RFS ବର୍ତ୍ତମାନ ଡିଫଲ୍ଟ ଭାବରେ ସକ୍ଷମ ହୋଇଛି | ମିକ୍ସିନ ବ୍ୟବହାର କରୁଥିବାfont-size()ହେଡିଙ୍ଗଗୁଡ଼ିକ ସ୍ୱୟଂଚାଳିତ ଭାବରେfont-sizeଭ୍ୟୁପୋର୍ଟ ସହିତ ସ୍କେଲ କରିବାକୁ ଆଡଜଷ୍ଟ କରିବ | ଏହି ବ feature ଶିଷ୍ଟ୍ୟ ପୂର୍ବରୁ v4 ସହିତ ଅପ୍ଟ-ଇନ୍ ଥିଲା |

  • ଭାଙ୍ଗିବା$display-*ଆମର ଭେରିଏବଲ୍ ଏବଂ $display-font-sizesସାସ୍ ମାନଚିତ୍ର ସହିତ ବଦଳାଇବା ପାଇଁ ଆମର ପ୍ରଦର୍ଶନ ଟାଇପୋଗ୍ରାଫି ମରାମତି | $display-*-weightଏକକ $display-font-weightଏବଂ ଆଡଜଷ୍ଟେଡ୍ font-sizes ପାଇଁ ବ୍ୟକ୍ତିଗତ ଭେରିଏବଲ୍ ଗୁଡିକ ମଧ୍ୟ ଅପସାରଣ କରାଗଲା |

  • .display-*ଦୁଇଟି ନୂତନ ହେଡିଙ୍ଗ୍ ସାଇଜ୍ ଯୋଡାଗଲା , .display-5ଏବଂ .display-6।

  • ଲିଙ୍କଗୁଡିକ ଡିଫଲ୍ଟ ଭାବରେ ଅଣ୍ଡରଲାଇନ୍ ହୋଇଛି (କେବଳ ହୋଭରରେ ନୁହେଁ), ଯେପର୍ଯ୍ୟନ୍ତ ସେମାନେ ନିର୍ଦ୍ଦିଷ୍ଟ ଉପାଦାନଗୁଡ଼ିକର ଅଂଶ ନୁହଁନ୍ତି |

  • ସେମାନଙ୍କର ଶ yles ଳୀକୁ ସତେଜ କରିବା ଏବଂ ଷ୍ଟାଇଲିଂ ଉପରେ ଅଧିକ ନିୟନ୍ତ୍ରଣ ପାଇଁ CSS ଭେରିଏବଲ୍ ସହିତ ପୁନ build ନିର୍ମାଣ କରିବା ପାଇଁ ସାରଣୀଗୁଡ଼ିକୁ ପୁନ es ଡିଜାଇନ୍ କରାଯାଇଛି |

  • ଭାଙ୍ଗିବାନେଷ୍ଟେଡ୍ ଟେବୁଲଗୁଡିକ ଶ yles ଳୀକୁ ଆଉ ଉତ୍ତରାଧିକାରୀ କରନ୍ତି ନାହିଁ |

  • ଭାଙ୍ଗିବା .thead-lightଏବଂ ପ୍ରକାର ଶ୍ରେଣୀ .thead-darkସପକ୍ଷରେ ଛାଡି ଦିଆଗଲା ଯାହା ସମସ୍ତ ଟେବୁଲ୍ ଉପାଦାନଗୁଡ଼ିକ ପାଇଁ ବ୍ୟବହୃତ ହୋଇପାରେ ( ,,, ଏବଂ ) |.table-*theadtbodytfoottrthtd

  • ଭାଙ୍ଗିବାଏହି table-row-variant()ମିଶ୍ରଣର ନାମ ପରିବର୍ତ୍ତନ କରାଯାଇଛି table-variant()ଏବଂ କେବଳ 2 ପାରାମିଟର ଗ୍ରହଣ କରେ: $color(ରଙ୍ଗ ନାମ) ଏବଂ $value(ରଙ୍ଗ କୋଡ୍) | ଟେବୁଲ୍ ଫ୍ୟାକ୍ଟର୍ ଭେରିଏବଲ୍ ଉପରେ ଆଧାର କରି ସୀମା ରଙ୍ଗ ଏବଂ ଉଚ୍ଚାରଣ ରଙ୍ଗ ସ୍ୱୟଂଚାଳିତ ଭାବରେ ଗଣନା କରାଯାଏ |

  • ଟେବୁଲ୍ ସେଲ୍ ପ୍ୟାଡିଂ ଭେରିଏବଲ୍ ଗୁଡିକୁ -yଏବଂ-x

  • ଭାଙ୍ଗିବାଡ୍ରପ୍ .pre-scrollableକ୍ଲାସ୍ | # 29135 ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବା .text-*ଉପଯୋଗିତାଗୁଡ଼ିକ ଆଉ ଲିଙ୍କ୍ ପାଇଁ ହୋଭର ଏବଂ ଫୋକସ୍ ଷ୍ଟେଟସ୍ ଯୋଡେ ନାହିଁ | .link-*ଏହା ବଦଳରେ ହେଲପର କ୍ଲାସ୍ ବ୍ୟବହାର କରାଯାଇପାରିବ | # 29267 ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବାଡ୍ରପ୍ .text-justifyକ୍ଲାସ୍ | # 29793 ଦେଖନ୍ତୁ |

  • ବ୍ରାଉଜର୍ ଡିଫଲ୍ଟରୁ ଡିଫଲ୍ଟ ଭୂସମାନ୍ତର ଏବଂ ଉପାଦାନଗୁଡ଼ିକୁ ପୁନ Res ସେଟ୍ padding-leftକରନ୍ତୁ |<ul><ol>40px2rem

  • ଯୋଡା ଯାଇଛି $enable-smooth-scroll, ଯାହା ସର୍ବଭାରତୀୟ ସ୍ତରରେ ପ୍ରଯୁଜ୍ୟ - ମିଡିଆ ଜିଜ୍ଞାସା scroll-behavior: smoothମାଧ୍ୟମରେ ହ୍ରାସ ହୋଇଥିବା ଗତି ମାଗୁଥିବା ବ୍ୟବହାରକାରୀଙ୍କ ବ୍ୟତୀତ | # 31877 ଦେଖନ୍ତୁ |prefers-reduced-motion

RTL

  • ଭୂସମାନ୍ତର ଦିଗ ନିର୍ଦ୍ଦିଷ୍ଟ ଭେରିଏବଲ୍, ୟୁଟିଲିଟି, ଏବଂ ମିକ୍ସିନଗୁଡିକ ଲଜିକାଲ୍ ଗୁଣଗୁଡିକ ବ୍ୟବହାର କରିବାକୁ ନାମକରଣ କରାଯାଇଛି ଯେପରି ଫ୍ଲେକ୍ସବକ୍ସ ଲେଆଉଟ୍ ଗୁଡିକରେ ମିଳିଥାଏ - ଯଥା, startଏବଂ endଏହା ବଦଳରେ leftଏବଂ right|

ଫର୍ମଗୁଡିକ

  • ନୂତନ ଭାସମାନ ଫର୍ମ ଯୋଡାଗଲା! ସମ୍ପୂର୍ଣ୍ଣ ରୂପେ ସମର୍ଥିତ ଫର୍ମ ଉପାଦାନଗୁଡିକ ପାଇଁ ଆମେ ଫ୍ଲୋଟିଂ ଲେବଲ୍ ଉଦାହରଣକୁ ପ୍ରୋତ୍ସାହିତ କରିଛୁ | ନୂତନ ଫ୍ଲୋଟିଂ ଲେବଲ୍ ପୃଷ୍ଠା ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବା ଏକତ୍ରିତ ଦେଶୀ ଏବଂ କଷ୍ଟମ୍ ଫର୍ମ ଉପାଦାନଗୁଡିକ | ଚେକ୍ ବକ୍ସ, ରେଡିଓ, ସିଲେକ୍ଟ, ଏବଂ ଅନ୍ୟାନ୍ୟ ଇନପୁଟ୍ ଯାହା v4 ରେ ଦେଶୀ ଏବଂ କଷ୍ଟମ୍ କ୍ଲାସ୍ ରହିଥିଲା ​​| ବର୍ତ୍ତମାନ ଆମର ପ୍ରାୟ ସମସ୍ତ ଫର୍ମ ଉପାଦାନଗୁଡ଼ିକ ସଂପୂର୍ଣ୍ଣ କଷ୍ଟମ୍, ଅଧିକାଂଶ କଷ୍ଟମ୍ HTML ର ଆବଶ୍ୟକତା ବିନା |

    • .custom-checkବର୍ତ୍ତମାନ ଅଟେ .form-check|
    • .custom-check.custom-switchବର୍ତ୍ତମାନ ଅଟେ .form-check.form-switch|
    • .custom-selectବର୍ତ୍ତମାନ ଅଟେ .form-select|
    • .custom-fileଏବଂ .form-fileଉପରେ କଷ୍ଟମ୍ ଶ yles ଳୀ ଦ୍ୱାରା ସ୍ଥାନିତ ହୋଇଛି .form-control|
    • .custom-rangeବର୍ତ୍ତମାନ ଅଟେ .form-range|
    • ମୂଳ ଦେଶୀ .form-control-fileଏବଂ .form-control-range।

  • ଭାଙ୍ଗିବାଡ୍ରପ୍ .input-group-appendଏବଂ .input-group-prepend। ଆପଣ ବର୍ତ୍ତମାନ କେବଳ ବଟନ୍ ଏବଂ .input-group-textଇନପୁଟ୍ ଗୋଷ୍ଠୀର ପ୍ରତ୍ୟକ୍ଷ ପିଲା ଭାବରେ ଯୋଗ କରିପାରିବେ |

  • ବ valid ଧତା ମତାମତ ବଗ୍ ସହିତ ଇନପୁଟ୍ ଗ୍ରୁପ୍ ଉପରେ ଦୀର୍ଘ ଦିନର ନିଖୋଜ ସୀମା ବ୍ୟାସାର୍ଦ୍ଧ ଶେଷରେ ବ valid ଧତା ସହିତ ଇନପୁଟ୍ ଗୋଷ୍ଠୀକୁ ଏକ ଅତିରିକ୍ତ .has-validationଶ୍ରେଣୀ ଯୋଗ କରି ସ୍ଥିର ହୋଇଛି |

  • ଭାଙ୍ଗିବା ଆମର ଗ୍ରୀଡ୍ ସିଷ୍ଟମ୍ ପାଇଁ ଫର୍ମ-ନିର୍ଦ୍ଦିଷ୍ଟ ଲେଆଉଟ୍ କ୍ଲାସ୍ ଡ୍ରପ୍ | .form-group, .form-rowକିମ୍ବା ପରିବର୍ତ୍ତେ ଆମର ଗ୍ରୀଡ୍ ଏବଂ ଉପଯୋଗିତା ବ୍ୟବହାର କରନ୍ତୁ .form-inline|

  • ଭାଙ୍ଗିବାଫର୍ମ ଲେବଲ୍ ବର୍ତ୍ତମାନ ଆବଶ୍ୟକ କରେ .form-label|

  • ଭାଙ୍ଗିବା .form-textଆଉ displayHTML ସେଟ୍ ବଦଳାଇ ଇନଲାଇନ ସୃଷ୍ଟି କରିବାକୁ କିମ୍ବା ହେଲପ୍ ଟେକ୍ସଟ୍ ବ୍ଲକ୍ କରିବାକୁ ଅନୁମତି ଦିଏ ନାହିଁ |

  • <select>ବ with ଧତା ଆଇକନ୍ ଗୁଡିକ s ସହିତ ଆଉ ପ୍ରୟୋଗ କରାଯାଏ ନାହିଁ multiple|

  • scss/forms/ଇନପୁଟ୍ ଗ୍ରୁପ୍ ଶ yles ଳୀ ଅନ୍ତର୍ଭୂକ୍ତ କରି ପୁନ arr ସଜ୍ଜିତ ଉତ୍ସ ସାସ୍ ଫାଇଲଗୁଡିକ |

ଉପାଦାନଗୁଡ଼ିକ |

  • ଆମର ଭେରିଏବଲ୍ ଉପରେ ଆଧାରିତ ଆଲର୍ଟ, ବ୍ରେଡ୍ କ୍ରମ୍, କାର୍ଡ, ଡ୍ରପଡାଉନ୍, ତାଲିକା ଗୋଷ୍ଠୀ, ମୋଡାଲ୍, ପପୋଭର, ଏବଂ ଟୁଲଟିପ୍ ପାଇଁ ଏକୀକୃତ paddingମୂଲ୍ୟ | # 30564 ଦେଖନ୍ତୁ |$spacer

ଆକର୍ଡିଅନ୍ |

ସତର୍କତା

  • ଆଇକନ୍ ସହିତ ଆଲର୍ଟଗୁଡ଼ିକରେ ବର୍ତ୍ତମାନ ଉଦାହରଣ ଅଛି |

  • <hr>ପ୍ରତ୍ୟେକ ଆଲର୍ଟରେ s ପାଇଁ କଷ୍ଟମ୍ ଶ yles ଳୀଗୁଡିକ ଅପସାରଣ କରାଯାଇଛି ଯେହେତୁ ସେମାନେ ପୂର୍ବରୁ ବ୍ୟବହାର କରନ୍ତି currentColor|

ବ୍ୟାଜ୍

  • ଭାଙ୍ଗିବାପୃଷ୍ଠଭୂମି ଉପଯୋଗୀତା ପାଇଁ ସମସ୍ତ ରଙ୍ଗ ଶ୍ରେଣୀଗୁଡିକ ଡ୍ରପ୍ କରିଦେଲେ .badge-*(ଉଦାହରଣ ସ୍ୱରୂପ, .bg-primaryଏହା ବଦଳରେ ବ୍ୟବହାର କରନ୍ତୁ .badge-primary) |

  • ଭାଙ୍ଗିବାଡ୍ରପ୍ .badge-pillହୋଇଛି - .rounded-pillଏହା ବଦଳରେ ଉପଯୋଗିତାକୁ ବ୍ୟବହାର କରନ୍ତୁ |

  • ଭାଙ୍ଗିବା<a>ଉପାଦାନ ଏବଂ ଉପାଦାନଗୁଡ଼ିକ ପାଇଁ ହୋଭର ଏବଂ ଫୋକସ୍ ଶ yles ଳୀଗୁଡିକ ଅପସାରଣ କରାଯାଇଛି <button>|

  • .25em/ ରୁ / .5emପର୍ଯ୍ୟନ୍ତ .35emବ୍ୟାଜ୍ ପାଇଁ ଡିଫଲ୍ଟ ପ୍ୟାଡିଂ ବୃଦ୍ଧି .65em|

  • paddingଅପସାରଣ କରି background-color, ଏବଂ , ରୁଟି ଖଣ୍ଡଗୁଡ଼ିକର ଡିଫଲ୍ଟ ଦୃଶ୍ୟକୁ ସରଳୀକୃତ border-radius|

  • --bs-breadcrumb-dividerCSS ର ପୁନ omp ସଂକଳନ ଆବଶ୍ୟକ ନକରି ସହଜ କଷ୍ଟମାଇଜେସନ୍ ପାଇଁ ନୂତନ CSS କଷ୍ଟମ୍ ପ୍ରପର୍ଟି ଯୋଡିଛି |

ବଟନ୍

  • ଭାଙ୍ଗିବା ଚେକ୍ ବକ୍ସ କିମ୍ବା ରେଡିଓ ସହିତ ବଟନ୍ ଟୋଗଲ୍ କରନ୍ତୁ, ଆଉ ଜାଭାସ୍କ୍ରିପ୍ଟ ଆବଶ୍ୟକ କରେ ନାହିଁ ଏବଂ ନୂତନ ମାର୍କଅପ୍ ଅଛି | ଆମେ ଆଉ ଏକ ରାପିଙ୍ଗ୍ ଉପାଦାନ ଆବଶ୍ୟକ କରୁନାହୁଁ, ଏହାକୁ ଯୋଡିବା.btn-checkଏବଂ<input>ଏହାକୁ ଯେକ any ଣସି.btnଶ୍ରେଣୀ<label>| # 30650 ଦେଖନ୍ତୁ | ଏଥିପାଇଁ ଡକସ୍ ଆମର ବଟନ୍ ପୃଷ୍ଠାରୁ ନୂତନ ଫର୍ମ ବିଭାଗକୁ ଚାଲିଯାଇଛି |

  • ଭାଙ୍ଗିବା .btn-blockଉପଯୋଗିତା ପାଇଁ ଡ୍ରପ୍ | .btn-blockଉପରେ ବ୍ୟବହାର କରିବା ପରିବର୍ତ୍ତେ .btn, ଆପଣଙ୍କର ବଟନ୍ଗୁଡ଼ିକୁ ଗୁଡ଼ାଇ ରଖନ୍ତୁ .d-gridଏବଂ ଆବଶ୍ୟକ ଅନୁଯାୟୀ ସ୍ପେସ୍ କରିବା ପାଇଁ ଏକ .gap-*ଉପଯୋଗୀତା | ସେମାନଙ୍କ ଉପରେ ଅଧିକ ନିୟନ୍ତ୍ରଣ ପାଇଁ ପ୍ରତିକ୍ରିୟାଶୀଳ ଶ୍ରେଣୀକୁ ସୁଇଚ୍ କରନ୍ତୁ | କିଛି ଉଦାହରଣ ପାଇଁ ଡକସ୍ ପ Read ନ୍ତୁ |

  • ଅତିରିକ୍ତ ପାରାମିଟରଗୁଡିକୁ ସମର୍ଥନ କରିବାକୁ ଆମର button-variant()ଏବଂ ମିଶ୍ରଣକୁ ଅଦ୍ୟତନ କଲେ |button-outline-variant()

  • ହୋଭର ଏବଂ ସକ୍ରିୟ ସ୍ଥିତି ଉପରେ ବର୍ଦ୍ଧିତ ବିପରୀତ ନିଶ୍ଚିତ କରିବାକୁ ବଟନ୍ଗୁଡ଼ିକୁ ଅଦ୍ୟତନ କରାଯାଇଛି |

  • ଅକ୍ଷମ ବଟନ୍ ଗୁଡିକ ବର୍ତ୍ତମାନ ଅଛି pointer-events: none;|

କାର୍ଡ

  • ଭାଙ୍ଗିବା.card-deckଆମର ଗ୍ରୀଡ୍ ସପକ୍ଷରେ ଡ୍ରପ୍ | ସ୍ତମ୍ଭ କ୍ଲାସରେ ତୁମର କାର୍ଡ ଗୁଡ଼ାଇ ରଖ ଏବଂ .row-cols-*କାର୍ଡ ଡେକ୍ସ ସୃଷ୍ଟି କରିବାକୁ ଏକ ପ୍ୟାରେଣ୍ଟ୍ ପାତ୍ର ଧାରଣ କର (କିନ୍ତୁ ପ୍ରତିକ୍ରିୟାଶୀଳ ଆଲାଇନ୍ମେଣ୍ଟ ଉପରେ ଅଧିକ ନିୟନ୍ତ୍ରଣ ସହିତ) |

  • ଭାଙ୍ଗିବାମାନସଙ୍କ .card-columnsସପକ୍ଷରେ ଛାଡିଦେଲେ | # 28922 ଦେଖନ୍ତୁ |

  • ଭାଙ୍ଗିବା.cardଆଧାରିତ ଆକର୍ଡିଅନ୍ କୁ ଏକ ନୂତନ ଆକର୍ଡିଅନ୍ ଉପାଦାନ ସହିତ ବଦଳାଇଲା |

  • ଗା dark ଼ ପାଠ୍ୟ, ନିୟନ୍ତ୍ରଣ, ଏବଂ ସୂଚକଗୁଡ଼ିକ ପାଇଁ ନୂତନ .carousel-darkପ୍ରକାର ଯୋଗ କରାଯାଇଛି (ହାଲୁକା ପୃଷ୍ଠଭୂମି ପାଇଁ ଉତ୍ତମ) |

  • ବୁଟଷ୍ଟ୍ରାପ୍ ଆଇକନ୍ ଗୁଡିକରୁ ନୂତନ SVG ସହିତ କାରୁସେଲ୍ ନିୟନ୍ତ୍ରଣ ପାଇଁ ସେଭ୍ରନ୍ ଆଇକନ୍ ଗୁଡିକ ସ୍ଥାନାନ୍ତରିତ |

ବଟନ୍ ବନ୍ଦ କରନ୍ତୁ |

  • ଭାଙ୍ଗିବାକମ୍ ଜେନେରିକ୍ ନାମ ପାଇଁ .closeପୁନ amed ନାମିତ |.btn-close

  • ବନ୍ଦ ବଟନ୍ ଗୁଡିକ ବର୍ତ୍ତମାନ HTML ରେ background-imageପରିବର୍ତ୍ତେ ଏକ (ଏମ୍ବେଡ୍ ହୋଇଥିବା SVG) ବ୍ୟବହାର &times;କରନ୍ତୁ, ଯାହା ଆପଣଙ୍କର ମାର୍କଅପ୍ ଛୁଇଁବାର ଆବଶ୍ୟକତା ବିନା ସହଜ କଷ୍ଟମାଇଜେସନ୍ ପାଇଁ ଅନୁମତି ଦିଏ |

  • ନୂତନ ପ୍ରକାର ଯୋଡା ଯାଇଛି ଯାହାକି ଗା dark ଼ ପୃଷ୍ଠଭୂମି ବିରୁଦ୍ଧରେ ଉଚ୍ଚ ବିପରୀତ ବରଖାସ୍ତ ଆଇକନ୍ ସକ୍ଷମ କରିବାକୁ .btn-close-whiteବ୍ୟବହାର କରେ |filter: invert(1)

ଭୁଶୁଡ଼ିବା |

  • ଆକର୍ଡିଅନ୍ ପାଇଁ ସ୍କ୍ରୋଲ୍ ଆଙ୍କରିଙ୍ଗ୍ ଅପସାରଣ କରାଯାଇଛି |

  • .dropdown-menu-darkଅନ୍-ଡିମାଣ୍ଡ ଡାର୍କ ଡ୍ରପଡାଉନ୍ ପାଇଁ ନୂତନ ଭାରିଆଣ୍ଟ ଏବଂ ଆନୁଷଙ୍ଗିକ ଭେରିଏବଲ୍ ଯୋଡାଗଲା |

  • ପାଇଁ ନୂଆ ଭେରିଏବଲ୍ ଯୋଡିଛି $dropdown-padding-x|

  • ଉନ୍ନତ ବିପରୀତ ପାଇଁ ଡ୍ରପଡାଉନ୍ ଡିଭାଇଡର୍ ଅନ୍ଧକାର |

  • ଭାଙ୍ଗିବାଡ୍ରପଡାଉନ୍ ପାଇଁ ସମସ୍ତ ଘଟଣା ବର୍ତ୍ତମାନ ଡ୍ରପଡାଉନ୍ ଟୋଗଲ୍ ବଟନ୍ ଉପରେ ଟ୍ରିଗର ହୋଇଛି ଏବଂ ତା’ପରେ ପ୍ୟାରେଣ୍ଟ୍ ଉପାଦାନ ପର୍ଯ୍ୟନ୍ତ ବବୁଲ୍ ହୋଇଛି |

  • ଡ୍ରପ୍ ଡାଉନ୍ ମେନୁଗୁଡ଼ିକର ବର୍ତ୍ତମାନ ଏକ data-bs-popper="static"ଆଟ୍ରିବ୍ୟୁଟ୍ ସେଟ୍ ଅଛି ଯେତେବେଳେ ଡ୍ରପଡାଉନ୍ ର ପୋଜିସନ୍ ସ୍ଥିର ଥାଏ ଏବଂ data-bs-popper="none"ଯେତେବେଳେ ଡ୍ରପଡାଉନ୍ ନାଭବାର୍ ରେ ଥାଏ | ଏହା ଆମର ଜାଭାସ୍କ୍ରିପ୍ଟ ଦ୍ୱାରା ଯୋଡା ଯାଇଛି ଏବଂ ପପର୍ ର ପୋଜିସନ୍ରେ ହସ୍ତକ୍ଷେପ ନକରି କଷ୍ଟମ୍ ପୋଜିସନ୍ ଷ୍ଟାଇଲ୍ ବ୍ୟବହାର କରିବାରେ ସାହାଯ୍ୟ କରେ |

  • ଭାଙ୍ଗିବାflipଦେଶୀ ପପର୍ ବିନ୍ୟାସ ସପକ୍ଷରେ ଡ୍ରପଡାଉନ୍ ପ୍ଲଗଇନ୍ ପାଇଁ ଡ୍ରପ୍ ଅପ୍ସନ୍ | ଫ୍ଲିପ୍ ମୋଡିଫାୟର୍ରେ fallbackPlacementsବିକଳ୍ପ ପାଇଁ ଏକ ଖାଲି ଆରେ ପାସ୍ କରି ଆପଣ ବର୍ତ୍ତମାନ ଫ୍ଲପିଂ ଆଚରଣକୁ ଅକ୍ଷମ କରିପାରିବେ |

  • ଅଟୋ ବନ୍ଦ ଆଚରଣକୁ ପରିଚାଳନା କରିବା ପାଇଁ ଡ୍ରପଡାଉନ୍ ମେନୁଗୁଡ଼ିକ ବର୍ତ୍ତମାନ ଏକ ନୂତନ autoCloseବିକଳ୍ପ ସହିତ କ୍ଲିକ୍ ହୋଇପାରିବ | ଏହାକୁ ଇଣ୍ଟରାକ୍ଟିଭ୍ କରିବା ପାଇଁ ଡ୍ରପଡାଉନ୍ ମେନୁ ଭିତରେ କିମ୍ବା ବାହାରେ କ୍ଲିକ୍ ଗ୍ରହଣ କରିବାକୁ ଆପଣ ଏହି ବିକଳ୍ପକୁ ବ୍ୟବହାର କରିପାରିବେ |

  • ଡ୍ରପଡାଉନ୍ ଗୁଡିକ ବର୍ତ୍ତମାନ .dropdown-items ରେ ଗୁଡ଼ାଯାଇଥିବା <li>s କୁ ସମର୍ଥନ କରେ |

ଜମ୍ବୋଟ୍ରନ୍ |

ଗୋଷ୍ଠୀ ତାଲିକା |

  • ,, ଏବଂ ଶ୍ରେଣୀ ପାଇଁ ନୂତନ nullଭେରିଏବଲ୍ ଯୋଡିଛି |font-sizefont-weightcolor:hover color.nav-link
  • ଭାଙ୍ଗିବାନାଭବର୍ସ ବର୍ତ୍ତମାନ ଭିତରେ ଏକ ପାତ୍ର ଆବଶ୍ୟକ କରେ (ବ୍ୟବଧାନ ଆବଶ୍ୟକତା ଏବଂ CSS ଆବଶ୍ୟକତାକୁ ସରଳ କରିବାକୁ) |

ଅଫକାନଭାସ୍ |

ପୃଷ୍ଠା

  • ପେଜିନେସନ୍ ଲିଙ୍କଗୁଡ଼ିକରେ ବର୍ତ୍ତମାନ କଷ୍ଟମାଇଜେବଲ୍ ଅଛି margin-leftଯାହାକି ପରସ୍ପରଠାରୁ ଅଲଗା ହେବା ସମୟରେ ଗତିଶୀଳ ଭାବରେ ସମସ୍ତ କୋଣରେ ଗୋଲାକାର |

  • transitionପୃଷ୍ଠା ଲିଙ୍କରେ s ଯୋଡା ଯାଇଛି |

ପପୋଭର୍ସ |

  • ଭାଙ୍ଗିବାଆମର ଡିଫଲ୍ଟ ପପଓଭର ଟେମ୍ପଲେଟରେ ନାମିତ .arrow|.popover-arrow

  • ର ନାମ ପରିବର୍ତ୍ତନ whiteListକରାଯାଇଛି allowList|

ସ୍ପିନର୍ସ |

  • ସ୍ପିନରମାନେ ବର୍ତ୍ତମାନ prefers-reduced-motion: reduceଆନିମେସନ୍ ମନ୍ଥର କରି ସମ୍ମାନିତ କରନ୍ତି | # 31882 ଦେଖନ୍ତୁ |

  • ଉନ୍ନତ ସ୍ପିନର ଭୂଲମ୍ବ ଆଲାଇନ୍ମେଣ୍ଟ |

ଟୋଷ୍ଟ

  • ଟୋଷ୍ଟଗୁଡିକ ବର୍ତ୍ତମାନ ପୋଜିସନ୍ ୟୁଟିଲିଟିଜ୍ ସାହାଯ୍ୟରେ ଏକ ପୋଜିସନ୍ ହୋଇପାରିବ |.toast-container

  • ଡିଫଲ୍ଟ ଟୋଷ୍ଟ ଅବଧି 5 ସେକେଣ୍ଡକୁ ପରିବର୍ତ୍ତନ କରାଯାଇଛି |

  • ଟୋଷ୍ଟରୁ ଅପସାରିତ ହୋଇଛି ଏବଂ ଫଙ୍କସନ୍ overflow: hiddenସହିତ ସଠିକ୍ border-radiuss ସହିତ ସ୍ଥାନିତ ହୋଇଛି |calc()

ସାଧନଗୁଡ଼ିକ

  • ଭାଙ୍ଗିବାଆମର ଡିଫଲ୍ଟ ଟୁଲ୍ ଟିପ୍ ଟେମ୍ପଲେଟ୍ ରେ .arrowନାମିତ |.tooltip-arrow

  • ଭାଙ୍ଗିବାପପର୍ ଉପାଦାନଗୁଡିକର ଉନ୍ନତ ସ୍ଥାନିତ ପାଇଁ the ପାଇଁ ଡିଫଲ୍ଟ ମୂଲ୍ୟକୁ fallbackPlacementsପରିବର୍ତ୍ତନ କରାଯାଇଛି |['top', 'right', 'bottom', 'left']

  • ଭାଙ୍ଗିବାର ନାମ ପରିବର୍ତ୍ତନ whiteListକରାଯାଇଛି allowList|

ଉପଯୋଗିତା

  • ଭାଙ୍ଗିବାRTL ସମର୍ଥନ ସହିତ ନିର୍ଦ୍ଦେଶନାତ୍ମକ ନାମ ପରିବର୍ତ୍ତେ ଲଜିକାଲ୍ ପ୍ରପର୍ଟି ନାମ ବ୍ୟବହାର କରିବାକୁ ଅନେକ ଉପଯୋଗିତାକୁ ପୁନ amed ନାମିତ କରାଗଲା:

    • ନାମ ପରିବର୍ତ୍ତନ .left-*ଏବଂ ଏବଂ .right-*_.start-*.end-*
    • ନାମ ପରିବର୍ତ୍ତନ .float-leftଏବଂ ଏବଂ .float-right_.float-start.float-end
    • ନାମ ପରିବର୍ତ୍ତନ .border-leftଏବଂ ଏବଂ .border-right_.border-start.border-end
    • ନାମ ପରିବର୍ତ୍ତନ .rounded-leftଏବଂ ଏବଂ .rounded-right_.rounded-start.rounded-end
    • ନାମ ପରିବର୍ତ୍ତନ .ml-*ଏବଂ ଏବଂ .mr-*_.ms-*.me-*
    • ନାମ ପରିବର୍ତ୍ତନ .pl-*ଏବଂ ଏବଂ .pr-*_.ps-*.pe-*
    • ନାମ ପରିବର୍ତ୍ତନ .text-leftଏବଂ ଏବଂ .text-right_.text-start.text-end

  • ଭାଙ୍ଗିବାଡିଫଲ୍ଟ ଭାବରେ ନକାରାତ୍ମକ ମାର୍ଜିନଗୁଡିକ ଅକ୍ଷମ କରନ୍ତୁ |

  • ଅତିରିକ୍ତ ଉପାଦାନଗୁଡ଼ିକରେ ଶୀଘ୍ର ପୃଷ୍ଠଭୂମି .bg-bodyସେଟିଂ ପାଇଁ ନୂତନ ଶ୍ରେଣୀ ଯୋଡାଗଲା |<body>

  • ପାଇଁ , ଏବଂ , ପାଇଁ ନୂତନ ସ୍ଥିତି ଉପଯୋଗିତା ଯୋଗ କରାଯାଇଛି | ମୂଲ୍ୟଗୁଡିକ ଅନ୍ତର୍ଭୂକ୍ତ କରେ ଏବଂ ପ୍ରତ୍ୟେକ ସମ୍ପତ୍ତି ପାଇଁ |toprightbottomleft050%100%

  • ଭୂସମାନ୍ତରାଳ କିମ୍ବା ଭୂଲମ୍ବ ଭାବରେ ସଂପୂର୍ଣ୍ଣ / ସ୍ଥିର ସ୍ଥିତ ଉପାଦାନଗୁଡ଼ିକରେ ନୂତନ .translate-middle-xଏବଂ ଉପଯୋଗିତା ଯୋଗ କରାଯାଇଛି |.translate-middle-y

  • ନୂତନ border-widthଉପଯୋଗିତା ଯୋଗ କରାଯାଇଛି |

  • ଭାଙ୍ଗିବାକୁ ପୁନ amed ନାମିତ .text-monospaceକରାଯାଇଛି .font-monospace|

  • ଭାଙ୍ଗିବାପାଠ୍ୟ ଲୁଚାଇବା ପାଇଁ ଏହା ଏକ ପୁରାତନ ପଦ୍ଧତି ଭାବରେ ଅପସାରିତ .text-hideହୋଇଛି ଯାହା ଆଉ ବ୍ୟବହାର ହେବା ଉଚିତ ନୁହେଁ |

  • .fs-*ଉପଯୋଗିତା ପାଇଁ ଉପଯୋଗିତା ଯୋଗ କରାଯାଇଛି font-size(RFS ସକ୍ଷମ ସହିତ) | ଏମାନେ HTML ର ଡିଫଲ୍ଟ ହେଡିଙ୍ଗ୍ ସହିତ ସମାନ ସ୍କେଲ୍ ବ୍ୟବହାର କରନ୍ତି (1-6, ବଡରୁ ଛୋଟ), ଏବଂ ସାସ୍ ମାନଚିତ୍ର ମାଧ୍ୟମରେ ପରିବର୍ତ୍ତନ କରାଯାଇପାରିବ |

  • ଭାଙ୍ଗିବାକ୍ଷୁଦ୍ରତା ଏବଂ ସ୍ଥିରତା ପାଇଁ .font-weight-*ଉପଯୋଗିତାଗୁଡ଼ିକର ନାମ ପରିବର୍ତ୍ତନ କରାଯାଇଛି |.fw-*

  • ଭାଙ୍ଗିବାକ୍ଷୁଦ୍ରତା ଏବଂ ସ୍ଥିରତା ପାଇଁ .font-style-*ଉପଯୋଗିତାଗୁଡ଼ିକର ନାମ ପରିବର୍ତ୍ତନ କରାଯାଇଛି |.fst-*

  • CSS ଗ୍ରୀଡ୍ ଏବଂ ଫ୍ଲେକ୍ସବକ୍ସ ଲେଆଉଟ୍ ପାଇଁ .d-gridୟୁଟିଲିଟି ଏବଂ ନୂତନ gapୟୁଟିଲିଟି ( ) ପ୍ରଦର୍ଶନ କରିବାକୁ ଯୋଡା ଯାଇଛି |.gap

  • ଭାଙ୍ଗିବାଅପସାରିତ ହୋଇଛି .rounded-smଏବଂ rounded-lg, ଏବଂ ଶ୍ରେଣୀର ଏକ ନୂତନ ସ୍କେଲ୍ ଉପସ୍ଥାପନ .rounded-0କରିଛି .rounded-3| # 31687 ଦେଖନ୍ତୁ |

  • ନୂତନ line-heightଉପଯୋଗିତା .lh-1ଯୋଗ କରାଯାଇଛି :, .lh-smଏବଂ .lh-base। ଏଠାରେ.lh-lg ଦେଖନ୍ତୁ |

  • .d-noneଅନ୍ୟ CSS ଉପଯୋଗୀତା ଉପରେ ଏହାକୁ ଅଧିକ ଓଜନ ଦେବା ପାଇଁ ଆମର CSS ରେ ଉପଯୋଗିତାକୁ ଘୁଞ୍ଚାଇଲା |

  • .visually-hidden-focusableବ୍ୟବହାର କରି ପାତ୍ରରେ କାମ କରିବାକୁ ହେଲପରକୁ ବିସ୍ତାର କର :focus-within|

ସାହାଯ୍ୟକାରୀ

  • ଭାଙ୍ଗିବା ପ୍ରତିକ୍ରିୟାଶୀଳ ଏମ୍ବେଡ୍ ହେଲପର୍ ମାନଙ୍କୁ ନୂତନ ଶ୍ରେଣୀ ନାମ ଏବଂ ଉନ୍ନତ ଆଚରଣ ସହିତ ଅନୁପାତ ସହାୟକକାରୀଙ୍କ ନାମରେ ନାମିତ କରାଯାଇଛି, ଏବଂ ଏକ ସହାୟକ CSS ଭେରିଏବଲ୍ |

    • ଦିଗ ଅନୁପାତରେ ପରିବର୍ତ୍ତନ byକରିବାକୁ ଶ୍ରେଣୀଗୁଡ଼ିକର ନାମ ପରିବର୍ତ୍ତନ କରାଯାଇଛି | xଉଦାହରଣ ସ୍ୱରୂପ, .ratio-16by9ବର୍ତ୍ତମାନ ଅଟେ .ratio-16x9|
    • ଆମେ .embed-responsive-itemଏକ ସରଳ ଚୟନକର୍ତ୍ତାଙ୍କ ସପକ୍ଷରେ ଏବଂ ଉପାଦାନ ଗୋଷ୍ଠୀ ଚୟନକର୍ତ୍ତାଙ୍କୁ .ratio > *ଛାଡିଛୁ | ଆଉ କ class ଣସି ଶ୍ରେଣୀର ଆବଶ୍ୟକତା ନାହିଁ, ଏବଂ ଅନୁପାତ ସହାୟକ ବର୍ତ୍ତମାନ କ HTML ଣସି HTML ଉପାଦାନ ସହିତ କାମ କରେ |
    • $embed-responsive-aspect-ratiosସାସ୍ ମାନଚିତ୍ରର ନାମ ପରିବର୍ତ୍ତନ କରାଯାଇଛି ଏବଂ ଏହାର $aspect-ratiosମୂଲ୍ୟଗୁଡିକ ଶ୍ରେଣୀ ନାମ ଏବଂ ଶତକଡା key: valueଯୋଡି ଭାବରେ ଅନ୍ତର୍ଭୂକ୍ତ କରିବା ପାଇଁ ସରଳୀକୃତ ହୋଇଛି |
    • CSS ଭେରିଏବଲ୍ ଗୁଡିକ ବର୍ତ୍ତମାନ ସୃଷ୍ଟି ହୋଇଛି ଏବଂ ସାସ୍ ମାନଚିତ୍ରରେ ପ୍ରତ୍ୟେକ ମୂଲ୍ୟ ପାଇଁ ଅନ୍ତର୍ଭୂକ୍ତ କରାଯାଇଛି | ଯେକ any ଣସି କଷ୍ଟମ୍ ଆସପେକ୍ଟ ଅନୁପାତ ସୃଷ୍ଟି କରିବାକୁ --bs-aspect-ratioଭେରିଏବଲ୍ କୁ ପରିବର୍ତ୍ତନ କରନ୍ତୁ |.ratio

  • ଭାଙ୍ଗିବା “ସ୍କ୍ରିନ୍ ରିଡର୍” କ୍ଲାସ୍ଗୁଡ଼ିକ ବର୍ତ୍ତମାନ “ଭିଜୁଆଲ୍ ଲୁକ୍କାୟିତ” କ୍ଲାସ୍ |

    • ସାସ୍ ଫାଇଲ୍ କୁ ବଦଳାଇଲା scss/helpers/_screenreaders.scss|scss/helpers/_visually-hidden.scss
    • ନାମକରଣ .sr-onlyଏବଂ .sr-only-focusableଏବଂ .visually-hiddenଏବଂ.visually-hidden-focusable
    • ଏବଂ ଏହାର ନାମ ପରିବର୍ତ୍ତନ sr-only()ଏବଂ sr-only-focusable()ମିଶ୍ରିତ |visually-hidden()visually-hidden-focusable()

  • bootstrap-utilities.cssବର୍ତ୍ତମାନ ଆମର ସହାୟକମାନଙ୍କୁ ମଧ୍ୟ ଅନ୍ତର୍ଭୁକ୍ତ କରେ | କଷ୍ଟମ ବିଲ୍ଡରେ ହେଲପରମାନଙ୍କୁ ଆମଦାନୀ କରିବା ଆବଶ୍ୟକ ନାହିଁ |

ଜାଭାସ୍କ୍ରିପ୍ଟ |

  • ନିୟମିତ ଜାଭାସ୍କ୍ରିପ୍ଟରେ ରହିବାକୁ jQuery ନିର୍ଭରଶୀଳତା ଏବଂ ପ୍ଲଗଇନଗୁଡ଼ିକୁ ପୁନ r ଲିଖନ କର |

  • ଭାଙ୍ଗିବାସମସ୍ତ ଜାଭାସ୍କ୍ରିପ୍ଟ ପ୍ଲଗଇନ୍ ପାଇଁ ଡାଟା ଆଟ୍ରିବ୍ୟୁଟ୍ ବର୍ତ୍ତମାନ ବୁଟ୍ ଷ୍ଟ୍ରାପ୍ କାର୍ଯ୍ୟକାରିତାକୁ ତୃତୀୟ ପକ୍ଷ ଏବଂ ଆପଣଙ୍କ ନିଜ କୋଡ୍ ଠାରୁ ଭିନ୍ନ କରିବାରେ ସାହାଯ୍ୟ କରିବାକୁ ନାମ ସ୍ଥାନିତ ହୋଇଛି | ଉଦାହରଣ ସ୍ୱରୂପ, ଆମେ data-bs-toggleଏହା ବଦଳରେ ବ୍ୟବହାର କରୁ data-toggle|

  • ସମସ୍ତ ପ୍ଲଗଇନ୍ ବର୍ତ୍ତମାନ ପ୍ରଥମ ଆର୍ଗୁମେଣ୍ଟ୍ ଭାବରେ ଏକ CSS ଚୟନକର୍ତ୍ତା ଗ୍ରହଣ କରିପାରିବ | ପ୍ଲଗଇନ୍ ର ଏକ ନୂତନ ଉଦାହରଣ ସୃଷ୍ଟି କରିବାକୁ ଆପଣ ଏକ DOM ଉପାଦାନ କିମ୍ବା ଯେକ valid ଣସି ବ valid ଧ CSS ଚୟନ��ର୍ତ୍ତା ପାସ୍ କରିପାରିବେ:

    var modal = new bootstrap.Modal('#myModal')
var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')

  • popperConfigଏକ ଫଙ୍କସନ୍ ଭାବରେ ପାସ୍ ହୋଇପାରିବ ଯାହା ବୁଟଷ୍ଟ୍ରାପ୍ ର ଡିଫଲ୍ଟ ପପର୍ ବିନ୍ୟାସକୁ ଏକ ଯୁକ୍ତି ଭାବରେ ଗ୍ରହଣ କରେ, ଯାହା ଦ୍ you ାରା ତୁମେ ଏହି ଡିଫଲ୍ଟ ବିନ୍ୟାସକୁ ତୁମ ପଥରେ ମିଶ୍ରଣ କରିପାରିବ | ଡ୍ରପଡାଉନ୍, ପପୋଭର, ଏବଂ ଟୁଲଟିପ୍ ପାଇଁ ପ୍ରଯୁଜ୍ୟ |

  • ପପର୍ ଉପାଦାନଗୁଡିକର ଉନ୍ନତ ସ୍ଥାନିତ ପାଇଁ the ପାଇଁ ଡିଫଲ୍ଟ ମୂଲ୍ୟକୁ fallbackPlacementsପରିବର୍ତ୍ତନ କରାଯାଇଛି | ଡ୍ରପଡାଉନ୍, ପପୋଭର, ଏବଂ ଟୁଲଟିପ୍ ପାଇଁ ପ୍ରଯୁଜ୍ୟ |['top', 'right', 'bottom', 'left']

  • _getInstance()Public ପରି ସର୍ବସାଧାରଣ ଷ୍ଟାଟିକ୍ ପଦ୍ଧତିରୁ ଅଣ୍ଡରସ୍କୋର୍ ଅପସାରିତ getInstance()|