ꯃꯔꯨꯑꯣꯏꯕꯥ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯆꯠꯂꯨ꯫ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯁꯤꯡ ꯅꯦꯚꯤꯒꯦꯁꯅꯗꯥ ꯆꯠꯂꯨ꯫
in English

v5ꯗꯥ ꯃꯥꯏꯒ꯭ꯔꯦꯠ ꯇꯧꯕꯥ꯫

v4ꯗꯒꯤ v5ꯗꯥ ꯃꯥꯏꯒ꯭ꯔꯦꯠ ꯇꯧꯕꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯁꯣꯔꯁ ꯐꯥꯏꯂꯁꯤꯡ, ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯦꯁꯟ, ꯑꯃꯁꯨꯡ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯗꯥ ꯑꯍꯣꯡꯕꯥ ꯂꯥꯀꯄꯥ ꯇ꯭ꯔꯦꯛ ꯑꯃꯁꯨꯡ ꯔꯤꯚꯤꯌꯨ ꯇꯧ꯫

ꯄꯦꯖ ꯑꯁꯤꯗꯥ ꯌꯥꯑꯣꯔꯤ꯫

ꯗꯤꯄꯦꯟꯗꯦꯟꯁꯁꯤꯡ꯫

  • jQuery ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯄꯣꯄꯔ v1.x ꯗꯒꯤ ꯄꯣꯄꯔ v2.x ꯗꯥ ꯑꯄꯒ꯭ꯔꯦꯗ ꯇꯧꯈ꯭ꯔꯦ꯫
  • ꯂꯤꯕꯁꯥꯁ ꯄꯤꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯁ ꯀꯝꯄꯥꯏꯂꯔ ꯑꯁꯤ ꯁꯤꯖꯤꯟꯅꯗꯕꯥ ꯃꯔꯝꯅꯥ ꯂꯤꯕꯁꯥꯁꯀꯤ ꯃꯍꯨꯠꯇꯥ ꯗꯥꯔꯠ ꯁꯥꯁꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯅꯈꯤ꯫
  • ꯑꯩꯈꯣꯌꯒꯤ ꯗꯣꯀꯨꯃꯦꯟꯇꯁꯤꯡ ꯁꯦꯃꯒꯠꯄꯒꯤꯗꯃꯛ ꯖꯦꯀꯤꯂꯗꯒꯤ ꯍꯨꯒꯣꯗꯥ ꯃꯥꯏꯒ꯭ꯔꯦꯠ ꯇꯧꯈꯤ꯫

ꯕ꯭ꯔꯥꯎꯖꯔ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

  • ꯏꯟꯇꯔꯅꯦꯠ ꯑꯦꯛꯁꯞꯂꯣꯌꯥꯔ ꯱꯰ ꯑꯃꯁꯨꯡ ꯱꯱ ꯊꯥꯗꯣꯀꯈꯤ꯫
  • ꯃꯥꯏꯛꯔꯣꯁꯣꯐꯠ ꯑꯦꯖ < 16 (ꯂꯦꯒꯦꯁꯤ ꯑꯦꯖ) ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯐꯥꯏꯔꯐꯛꯁ < ꯶꯰ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯊꯥꯗꯣꯀꯈꯤꯕꯥ ꯁꯐꯔꯤ < ꯱꯲
  • ꯑꯥꯏ.ꯑꯣ.ꯑꯦꯁ.ꯀꯤ ꯁꯥꯐꯥꯔꯤ < ꯱꯲ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯀ꯭ꯔꯣꯝ < ꯶꯰ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫

ꯗꯣꯀꯨꯃꯦꯟꯇꯁꯤꯡ ꯍꯣꯡꯏ꯫

  • ꯍꯣꯃꯄꯦꯖ, ꯗꯣꯀꯁ ꯂꯦꯑꯥꯎꯠ, ꯑꯃꯁꯨꯡ ꯐꯨꯇꯔ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯗꯤꯖꯥꯏꯟ ꯇꯧꯈ꯭ꯔꯦ꯫
  • ꯑꯅꯧꯕꯥ ꯄꯥꯔꯁꯦꯜ ꯒꯥꯏꯗ ꯍꯥꯄꯆꯤꯜꯂꯦ .
  • ꯑꯅꯧꯕꯥ ꯀꯁ꯭ꯇꯃꯔ ꯁꯦꯛꯁꯟ ꯍꯥꯄꯆꯤꯜꯂꯦ , v4ꯒꯤ ꯊꯤꯃꯤꯡ ꯄꯦꯖꯒꯤ ꯃꯍꯨꯠ ꯁꯤꯜꯂꯤ , ꯁꯥꯁ, ꯃꯥꯂꯦꯃꯒꯤ ꯀꯅꯐꯤꯒꯔꯦꯁꯟ ꯑꯣꯄꯁꯅꯁꯤꯡ, ꯃꯆꯨꯒꯤ ꯁ꯭ꯀꯤꯃꯁꯤꯡ, ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯑꯅꯧꯕꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ꯫
  • ꯐꯣꯔꯝ ꯗꯣꯀꯨꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯑꯅꯧꯕꯥ ꯐꯣꯔꯃꯁꯤꯡ ꯁꯦꯛꯁꯅꯗꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯑꯣꯔꯒꯅꯥꯏꯖ ꯇꯧꯈꯤ , ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯍꯦꯟꯅꯥ ꯃꯤꯠꯌꯦꯡ ꯊꯝꯕꯥ ꯄꯦꯖꯁꯤꯡꯗꯥ ꯈꯥꯌꯗꯣꯀꯈꯤ꯫
  • ꯃꯇꯧ ꯑꯁꯨꯝꯅꯥ, ꯂꯦꯑꯥꯎꯠ ꯁꯦꯛꯁꯟ ꯑꯄꯗꯦꯠ ꯇꯧꯈꯤ , ꯒ꯭ꯔꯤꯗ ꯀꯟꯇꯦꯟꯇ ꯍꯦꯟꯅꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ ꯐ꯭ꯂꯦꯁ ꯇꯧꯅꯕꯥ꯫
  • “ꯅꯥꯚꯁ” ꯀꯝꯄꯣꯅꯦꯟꯇ ꯄꯦꯖ ꯑꯁꯤ “ꯅꯥꯚꯁ & ꯇꯦꯕꯁ” ꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • “ꯆꯦꯀꯁ” ꯄꯦꯖ ꯑꯁꯤ “ꯆꯦꯀꯁ & ꯔꯦꯗꯤꯑꯣꯁꯤꯡ” ꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯏꯠꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯗꯣꯀꯁ ꯚꯔꯁꯅꯁꯤꯡꯗꯥ ꯆꯠꯄꯗꯥ ꯂꯥꯏꯍꯟꯅꯕꯥ ꯅꯕꯕꯥꯔ ꯑꯁꯤ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯗꯤꯖꯥꯏꯟ ꯇꯧꯈꯤ ꯑꯃꯁꯨꯡ ꯑꯅꯧꯕꯥ ꯁꯕꯅꯦꯚ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫
  • ꯁꯥꯔꯆ ꯐꯤꯜꯗꯀꯤꯗꯃꯛ ꯑꯅꯧꯕꯥ ꯀꯤꯕꯣꯔꯗ ꯁꯣꯔꯇꯀꯥꯠ ꯍꯥꯄꯆꯤꯜꯂꯦ: Ctrl + /.

ꯁꯥꯁꯁ ꯇꯧꯕꯥ꯫

  • ꯔꯤꯗꯟꯗꯦꯟꯇ ꯚꯦꯜꯌꯨꯁꯤꯡ ꯂꯧꯊꯣꯀꯄꯗꯥ ꯂꯥꯏꯍꯟꯅꯕꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯗꯤꯐꯣꯜꯇ ꯁꯥꯁ ꯃꯦꯞ ꯃꯔꯖꯁꯤꯡ ꯗꯤꯆ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯋꯥꯈꯂꯗꯥ ꯊꯝꯃꯨ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯗꯣꯝꯅꯥ ꯁꯥꯁ ꯃꯦꯄꯁꯤꯡꯗꯥ ꯚꯦꯜꯌꯨ ꯄꯨꯝꯅꯃꯛ ꯗꯤꯐꯥꯏꯟ ꯇꯧꯒꯗꯕꯅꯤ ꯃꯗꯨꯗꯤ $theme-colors. ꯁꯥꯁ ꯃꯦꯄꯁꯤꯡꯒꯥ ꯀꯔꯝꯅꯥ ꯊꯦꯡꯅꯒꯅꯤ ꯍꯥꯌꯕꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫color-yiq()ꯐꯉ꯭ꯀꯁꯟ ꯑꯃꯁꯨꯡ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ color-contrast()ꯑꯁꯤ YIQ ꯀꯂꯔꯁ꯭ꯄꯦꯁꯀꯥ ꯃꯔꯤ ꯂꯩꯅꯗꯕꯥ ꯃꯔꯝꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫ #꯳꯰꯱꯶꯸ ꯌꯦꯡꯕꯤꯌꯨ꯫

    • $yiq-contrasted-thresholdꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯛꯂꯦ $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

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯄ꯭ꯔꯤꯟꯇ ꯁ꯭ꯇꯦꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ $enable-print-stylesꯚꯦꯔꯤꯑꯦꯕꯜ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫ ꯄ꯭ꯔꯤꯟꯇ ꯗꯤꯁꯞꯂꯦ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯀꯁꯨ ꯑꯀꯣꯌꯕꯗꯥ ꯂꯩꯔꯤ꯫ #꯲꯸꯳꯳꯹ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ color(), theme-color(), ꯑꯃꯁꯨꯡ gray()ꯐꯉ꯭ꯀꯁꯅꯁꯤꯡ ꯊꯥꯗꯣꯀꯈꯤ꯫ #꯲꯹꯰꯸꯳ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫theme-color-level()ꯐꯉ꯭ꯀꯁꯟ ꯑꯁꯤ ꯃꯆꯨ color-level()ꯈꯛꯇꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯅꯍꯥꯛꯅꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯃꯆꯨ ꯑꯃꯍꯦꯛꯇꯗꯥ ꯔꯤꯅꯦꯝ ꯇꯧꯔꯦ ꯑꯃꯁꯨꯡ ꯍꯧꯖꯤꯛ ꯌꯥꯔꯦ꯫ #29083 ꯌꯦꯡꯕꯤꯌꯨ ꯌꯦꯡꯕꯤꯌꯨ: ꯃꯇꯨꯡꯗꯥ ꯊꯥꯗꯣꯀꯈꯤꯕꯥ ꯑꯗꯨ .$theme-color 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-focus, ꯑꯃꯁꯨꯡhover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(ꯃꯁꯤꯒꯥ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯨ ꯊꯥꯗꯣꯀꯈꯤ, .text-hide)
    • visibility()
    • form-control-focus()

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯁꯥꯁꯀꯤ ꯃꯁꯥꯒꯤ ꯃꯆꯨ ꯁ꯭ꯀꯦꯂꯤꯡ ꯐꯉ꯭ꯀꯁꯅꯒꯥ ꯀꯣꯂꯤꯁꯟ ꯇꯧꯗꯅꯕꯥ scale-color()ꯐꯉ꯭ꯀꯁꯟ ꯑꯁꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫shift-color()

  • box-shadowꯃꯤꯛꯁꯤꯅꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯚꯦꯜꯌꯨꯁꯤꯡ ꯑꯌꯥꯕꯥ ꯄꯤꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯡ ꯌꯥꯝꯂꯕꯥ ꯑꯥꯔꯒꯨꯃꯦꯟꯇꯁꯤꯡꯗꯒꯤ nullꯗ꯭ꯔꯣꯞ ꯇꯧꯔꯦ꯫ #꯳꯰꯳꯹꯴ ꯌꯦꯡꯕꯤꯌꯨ .none

  • ꯃꯤꯛꯁꯤꯟ ꯑꯁꯤ border-radius()ꯍꯧꯖꯤꯛꯇꯤ ꯗꯤꯐꯣꯜꯇ ꯚꯦꯜꯌꯨ ꯑꯃꯥ ꯂꯩꯔꯦ꯫

ꯃꯆꯨꯒꯤ ꯁꯤꯁ꯭ꯇꯦꯝ꯫

  • ꯑꯅꯧꯕꯥ ꯃꯆꯨꯒꯤ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯊꯕꯛ ꯇꯧꯈꯤꯕꯥ color-level()ꯑꯃꯁꯨꯡ $theme-color-intervalꯂꯧꯊꯣꯀꯈꯤꯕꯥ ꯃꯆꯨꯒꯤ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯗꯨ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯀꯣꯗꯕꯦꯖꯗꯥ ꯂꯩꯔꯤꯕꯥ ꯄꯨꯝꯅꯃꯛ lighten()ꯑꯃꯁꯨꯡ ꯐꯉ꯭ꯀꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯑꯃꯁꯨꯡ . ꯍꯥꯌꯔꯤꯕꯥ ꯐꯉ꯭ꯀꯁꯅꯁꯤꯡ ꯑꯁꯤꯅꯥ ꯃꯆꯨ ꯑꯗꯨ ꯑꯀꯛꯅꯕꯥ ꯆꯥꯡ ꯑꯃꯗꯥ ꯍꯣꯡꯗꯣꯛ ꯍꯣꯡꯖꯤꯟ ꯇꯧꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯑꯉꯧꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯕ꯭ꯂꯦꯛ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯤꯛꯁ ꯇꯧꯒꯅꯤ꯫ ꯃꯁꯤꯒꯤ ꯑꯔꯨꯝꯕꯥ ꯄꯦꯔꯥꯃꯤꯇꯔ ꯑꯁꯤ ꯄꯣꯖꯤꯇꯤꯕ ꯑꯣꯏꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯅꯦꯒꯦꯇꯤꯕ ꯑꯣꯏꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯃꯆꯨ ꯑꯃꯥ ꯇꯤꯟ ꯅꯠꯠꯔꯒꯥ ꯁꯦꯠ ꯇꯧꯒꯅꯤ꯫ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯒꯤꯗꯃꯛ #30622 ꯌꯦꯡꯕꯤꯌꯨ꯫darken()tint-color()shade-color()shift-color()

  • ꯃꯆꯨ ꯈꯨꯗꯤꯡꯃꯛꯀꯤ ꯑꯅꯧꯕꯥ ꯇꯤꯟ ꯑꯃꯁꯨꯡ ꯁꯦꯠꯄꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ, ꯕꯦꯖ ꯃꯆꯨ ꯈꯨꯗꯤꯡꯃꯛꯀꯤ ꯑꯣꯏꯅꯥ ꯇꯣꯉꯥꯅꯕꯥ ꯃꯆꯨ ꯑꯅꯤ ꯄꯤꯗꯨꯅꯥ, ꯑꯅꯧꯕꯥ ꯁꯥꯁ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯑꯣꯏꯅꯥ꯫

  • ꯃꯆꯨꯒꯤ ꯀꯟꯠꯔꯁ꯭ꯠ ꯐꯒꯠꯍꯅꯕꯥ꯫ ꯳:꯱ꯗꯒꯤ ꯴.꯵:꯱ꯗꯥ ꯕꯝꯄ ꯇꯧꯔꯕꯥ ꯃꯆꯨꯒꯤ ꯀꯟꯠꯔꯁ꯭ꯠ ꯔꯦꯁꯤꯑꯣ ꯑꯃꯁꯨꯡ ꯋꯥ.ꯁꯤ.ꯑꯦ.ꯖꯤ.꯲.꯱ ꯑꯦ.ꯑꯦ. ꯑꯗꯨꯒꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯃꯆꯨꯒꯤ ꯀꯟꯠꯔꯁ꯭ꯠ ꯃꯆꯨ $gray-900ꯑꯁꯤꯗꯒꯤ $black.

  • ꯑꯩꯈꯣꯌꯒꯤ ꯃꯆꯨꯒꯤ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯁꯤꯕꯨ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯃꯆꯨꯁꯤꯡ ꯃꯇꯤꯛ ꯆꯥꯅꯥ ꯃꯤꯛꯁ ꯇꯧꯅꯕꯥ ꯑꯅꯧꯕꯥ ꯀꯁ꯭ꯇꯝ tint-color()ꯑꯃꯁꯨꯡ ꯐꯉ꯭ꯀꯁꯅꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫shade-color()

ꯒ꯭ꯔꯤꯗ ꯑꯄꯗꯦꯠꯁꯤꯡ꯫

  • ꯑꯅꯧꯕꯥ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ! ꯑꯃꯁꯨꯡ ꯃꯊꯛꯇꯥ ꯑꯅꯧꯕꯥ xxlꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫ 1400pxꯑꯇꯣꯞꯄꯥ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯦ꯫

  • ꯑꯍꯣꯡꯕꯥ ꯄꯨꯔꯀꯄꯥ ꯒꯇꯔꯁꯤꯡ꯫ 1.5remꯒꯇꯔꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯔꯦꯃꯁꯤꯡꯗꯥ ꯁꯦꯠ ꯇꯧꯔꯦ, ꯑꯃꯁꯨꯡ v4 ( , ꯅꯠꯔꯒꯥ ꯆꯥꯎꯔꯥꯛꯅꯥ 24px, down from 30px) ꯗꯒꯤ ꯍꯦꯟꯅꯥ ꯅꯦꯝꯂꯦ꯫ ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯃꯒꯤ ꯒꯇꯔꯁꯤꯡ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯁ꯭ꯄꯦꯁꯤꯡ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯍꯜꯂꯤ꯫

    • ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ/ꯚꯔꯇꯤꯀꯦꯜ ꯒꯇꯔꯁꯤꯡ, ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯒꯇꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯚꯔꯇꯤꯀꯦꯜ ꯒꯇꯔꯁꯤꯡ ꯀꯟꯠꯔꯣꯜ ꯇꯧꯅꯕꯥ ꯑꯅꯧꯕꯥ ꯒꯇꯔ ꯀ꯭ꯂꯥꯁ ( .g-*, .gx-*, ꯑꯃꯁꯨꯡ ) ꯍꯥꯄꯆꯤꯜꯂꯦ꯫.gy-*
    • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯑꯅꯧꯕꯥ ꯒꯇꯔ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯕꯥ .no-guttersꯃꯑꯣꯡꯗꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫.g-0

  • ꯀꯣꯂꯃꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯗ꯭ꯔꯦ , ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯂꯃꯆꯠ ꯑꯗꯨ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯄꯨꯔꯛꯅꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯈꯔꯗꯥ position: relativeꯍꯥꯄꯆꯤꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯌꯥꯏ꯫.position-relative

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.order-*ꯑꯌꯥꯝꯕꯥ ꯃꯇꯃꯗꯥ ꯁꯤꯖꯤꯟꯅꯗꯅꯥ ꯆꯠꯈꯤꯕꯥ ꯀ꯭ꯂꯥꯁ ꯀꯌꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯛ ꯑꯥꯎꯠ ꯑꯣꯐ ꯗꯤ ꯕꯣꯛꯁ .order-1ꯈꯛꯇꯃꯛ ꯄꯤꯔꯤ꯫.order-5

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.mediaꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯐꯖꯅꯥ ꯔꯤꯞꯂꯤꯀꯦꯠ ꯇꯧꯕꯥ ꯌꯥꯕꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯁꯤ ꯊꯥꯗꯣꯀꯈꯤ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ #28265 ꯑꯃꯁꯨꯡ ꯐ꯭ꯂꯦꯛꯁ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯄꯦꯖ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ bootstrap-grid.cssꯍꯧꯖꯤꯛꯇꯤ box-sizing: border-boxꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥ ꯕꯣꯛꯁ-ꯁꯥꯏꯖꯤꯡ ꯔꯤꯁꯦꯠ ꯇꯧꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀꯣꯂꯝ ꯑꯗꯨ ꯈꯛꯇꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫ ꯃꯁꯤꯒꯤ ꯃꯑꯣꯡ ꯑꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯒ꯭ꯔꯤꯗ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯁꯤ ꯑꯀꯥꯌꯕꯥ ꯌꯥꯑꯣꯗꯅꯥ ꯃꯐꯝ ꯀꯌꯥꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯒꯅꯤ꯫

  • $enable-grid-classesꯀꯟꯇꯦꯅꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ ꯖꯦꯅꯔꯦꯁꯟ ꯑꯁꯤ ꯍꯧꯖꯤꯛ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯗ꯭ꯔꯦ꯫ #꯲꯹꯱꯴꯶ ꯌꯦꯡꯕꯤꯌꯨ꯫

  • make-colꯑꯀꯛꯅꯕꯥ ꯁꯥꯏꯖ ꯑꯃꯠꯇꯥ ꯌꯥꯑꯣꯗꯅꯥ ꯃꯥꯟꯅꯕꯥ ꯀꯣꯂꯃꯁꯤꯡꯗꯥ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯃꯤꯛꯁꯤꯟ ꯑꯗꯨ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯦ .

ꯀꯟꯇꯦꯟꯇ, ꯔꯤꯕꯨꯠ ꯑꯁꯤꯅꯆꯤꯡꯕꯥ꯫

  • RFS ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯏꯅꯦꯕꯜ ꯇꯧꯔꯦ꯫ ꯃꯤꯛꯁꯤꯟ ꯁꯤꯖꯤꯟꯅꯔꯤꯕꯥfont-size()ꯃꯈꯣꯌꯒꯤfont-sizeꯇꯨ ꯁ꯭ꯀꯦꯜ ꯑꯗꯨ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯑꯦꯗꯖꯁ꯭ꯠ ꯇꯧꯒꯅꯤ꯫ ꯃꯁꯤꯒꯤ ꯐꯤꯆꯔ ꯑꯁꯤ ꯃꯃꯥꯡꯗꯥ v4ꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯣꯄꯁꯟ-ꯏꯟ ꯇꯧꯔꯝꯃꯤ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫$display-*ꯑꯩꯈꯣꯌꯒꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯒꯤ ꯃꯍꯨꯠ ꯁꯤꯟꯅꯕꯥ ꯑꯃꯁꯨꯡ $display-font-sizesꯁꯥꯁ ꯃꯦꯞ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯗꯤꯁꯞꯂꯦ ꯇꯥꯏꯄꯣꯒ꯭ꯔꯥꯐꯤ ꯑꯣꯚꯔꯍꯣꯜ ꯇꯧꯈꯤ꯫ $display-*-weightꯃꯁꯤꯗꯁꯨ ꯅꯠꯇꯅꯥ ꯁꯤꯉ꯭ꯒꯜ ꯑꯃꯒꯤꯗꯃꯛ ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯂꯧꯊꯣꯀꯈꯤ $display-font-weightꯑꯃꯁꯨꯡ ꯑꯦꯗꯖꯁ꯭ꯠ ꯇꯧꯔꯕꯥ font-sizeꯑꯦꯁ.

  • .display-*ꯑꯅꯧꯕꯥ ꯍꯦꯗꯤꯡ ꯁꯥꯏꯖ ꯑꯅꯤ ꯍꯥꯄꯆꯤꯜꯂꯦ , .display-5ꯑꯃꯁꯨꯡ .display-6.

  • ꯂꯤꯉ꯭ꯀꯁꯤꯡ ꯑꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯑꯟꯗꯔꯂꯥꯏꯟ ꯇꯧꯏ (ꯍꯣꯚꯥꯔ ꯈꯛꯇꯗꯥ ꯅꯠꯇꯦ), ꯃꯈꯣꯌ ꯑꯁꯤ ꯑꯀꯛꯅꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯤ ꯁꯔꯨꯛ ꯑꯃꯥ ꯑꯣꯏꯗ꯭ꯔꯕꯗꯤ꯫

  • ꯃꯈꯣꯌꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯔꯤꯐ꯭ꯔꯦꯁ ꯇꯧꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯁ꯭ꯇꯥꯏꯂꯤꯡꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯀꯟꯠꯔꯣꯜ ꯇꯧꯅꯕꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯒꯠꯅꯕꯥ ꯇꯦꯕꯂꯁꯤꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯗꯤꯖꯥꯏꯟ ꯇꯧꯈ꯭ꯔꯦ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯅꯦꯁ꯭ꯇꯦꯗ ꯇꯦꯕꯂꯁꯤꯡꯅꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯗ꯭ꯔꯦ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ .thead-lightꯑꯃꯁꯨꯡ ꯇꯦꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛꯀꯤꯗꯃꯛꯇꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯕꯥ ꯚꯦꯔꯤꯑꯦꯟꯇ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ .thead-darkꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯊꯥꯗꯣꯀꯏ ( , , , , ꯑꯃꯁꯨꯡ )..table-*theadtbodytfoottrthtd

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫table-row-variant()ꯃꯤꯛꯁꯤꯟ ꯑꯁꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯏ ꯑꯃꯁꯨꯡ table-variant()ꯄꯦꯔꯥꯃꯤꯇꯔ ꯲ ꯈꯛꯇꯃꯛ ꯌꯥꯔꯦ: $color(ꯃꯆꯨꯒꯤ ꯃꯃꯤꯡ) ꯑꯃꯁꯨꯡ $value(ꯃꯆꯨꯒꯤ ꯀꯣꯗ)꯫ ꯉꯃꯈꯩꯒꯤ ꯃꯆꯨ ꯑꯃꯁꯨꯡ ꯑꯦꯀꯁꯦꯟꯇ ꯃꯆꯨꯁꯤꯡ ꯑꯁꯤ ꯇꯦꯕꯜ ꯐꯦꯛꯇꯔ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯔꯒꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯂꯦꯄꯊꯣꯀꯏ꯫

  • ꯇꯦꯕꯜ ꯁꯦꯜ ꯄꯦꯗꯤꯡ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯑꯁꯤ -yꯑꯃꯁꯨꯡ -x.

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.pre-scrollableꯀ꯭ꯂꯥꯁ ꯊꯥꯗꯣꯀꯈꯤ꯫ #꯲꯹꯱꯳꯵ ꯌꯦꯡꯕꯤꯌꯨ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ .text-*ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯅꯥ ꯂꯤꯉ꯭ꯀꯁꯤꯡꯗꯥ ꯍꯣꯚꯔ ꯑꯃꯁꯨꯡ ꯐꯣꯀꯁ ꯔꯥꯖ꯭ꯌꯁꯤꯡ ꯍꯥꯄꯆꯤꯟꯗ꯭ꯔꯦ꯫ .link-*ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯍꯦꯜꯄꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ꯫ #꯲꯹꯲꯶꯷ ꯌꯦꯡꯕꯤꯌꯨ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.text-justifyꯀ꯭ꯂꯥꯁ ꯊꯥꯗꯣꯀꯈꯤ꯫ #꯲꯹꯷꯹꯳ ꯌꯦꯡꯕꯤꯌꯨ꯫

  • ꯗꯤꯐꯣꯜꯇ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ padding-leftꯑꯣꯟ <ul>ꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯕ꯭ꯔꯥꯎꯖꯔ <ol>ꯗꯤꯐꯣꯜꯇꯇꯒꯤ .40px2rem

  • ꯍꯥꯄꯆꯤꯜꯂꯦ , ꯃꯁꯤ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯅꯥ $enable-smooth-scrollꯆꯠꯅꯩ — ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯃꯣꯁꯟ ꯍꯟꯊꯍꯟꯅꯕꯥ ꯍꯥꯌꯔꯀꯄꯥ ꯌꯨꯖꯔꯁꯤꯡ ꯅꯠꯇꯅꯥ꯫ #꯳꯱꯸꯷꯷ ꯌꯦꯡꯕꯤꯌꯨ꯫scroll-behavior: smoothprefers-reduced-motion

ꯑꯥꯔ.ꯇꯤ.ꯑꯦꯜ

  • ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯗꯥꯏꯔꯦꯛꯁꯟ ꯁ꯭ꯄꯦꯁꯤꯐꯤꯛ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ, ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯄꯨꯝꯅꯃꯛ ꯑꯁꯤ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯂꯦꯑꯥꯎꯇꯁꯤꯡꯗꯥ ꯐꯪꯂꯤꯕꯥ ꯑꯁꯤꯒꯨꯝꯕꯥ ꯂꯣꯖꯤꯀꯦꯜ ꯄ꯭ꯔꯣꯄꯔꯇꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ-ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ , startꯑꯃꯁꯨꯡ ꯑꯃꯁꯨꯡ .endleftright

ꯐꯣꯔꯃꯁꯤꯡ꯫

  • ꯑꯅꯧꯕꯥ ꯐ꯭ꯂꯣꯇꯤꯡ ꯐꯣꯔꯃꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ! ꯑꯩꯈꯣꯌꯅꯥ ꯐ꯭ꯂꯣꯇꯤꯡ ꯂꯦꯕꯦꯂꯁꯤꯡꯒꯤ ꯈꯨꯗꯝ ꯑꯁꯤ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯐꯣꯔꯝ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯗꯥ ꯄ꯭ꯔꯃꯣꯠ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯑꯅꯧꯕꯥ ꯐ꯭ꯂꯣꯇꯤꯡ ꯂꯦꯕꯦꯂꯁꯤꯡꯒꯤ ꯄꯦꯖ ꯑꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ ꯀꯟꯁꯣꯂꯤꯗꯦꯇꯦꯗ ꯅꯦꯇꯤꯕ ꯑꯃꯁꯨꯡ ꯀꯁ꯭ꯇꯝ ꯐꯣꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ꯫ v4ꯗꯥ ꯅꯦꯇꯤꯕ ꯑꯃꯁꯨꯡ ꯀꯁ꯭ꯇꯝ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯂꯩꯔꯝꯕꯥ ꯆꯦꯀꯕꯣꯛꯁꯁꯤꯡ, ꯔꯦꯗꯤꯑꯣꯁꯤꯡ, ꯁꯦꯂꯦꯛꯇꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯑꯇꯣꯞꯄꯥ ꯏꯅꯄꯨꯠꯁꯤꯡ ꯀꯟꯁꯣꯂꯤꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯐꯣꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯆꯥꯎꯔꯥꯛꯅꯥ ꯄꯨꯝꯅꯃꯛ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯀꯁ꯭ꯇꯝ ꯑꯣꯏꯔꯦ, ꯑꯌꯥꯝꯕꯅꯥ ꯀꯁ꯭ꯇꯝ HTMLꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯦ꯫

    • .custom-checkꯑꯁꯤ ꯍꯧꯖꯤꯛ .form-check.
    • .custom-check.custom-switchꯑꯁꯤ ꯍꯧꯖꯤꯛ .form-check.form-switch.
    • .custom-selectꯑꯁꯤ ꯍꯧꯖꯤꯛ .form-select.
    • .custom-fileꯑꯃꯁꯨꯡ .form-fileꯃꯊꯛꯇꯥ ꯀꯁ꯭ꯇꯝ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯅꯈ꯭ꯔꯦ .form-control.
    • .custom-rangeꯑꯁꯤ ꯍꯧꯖꯤꯛ .form-range.
    • ꯊꯥꯗꯣꯀꯈꯤꯕꯥ ꯅꯦꯇꯤꯕ .form-control-fileꯑꯃꯁꯨꯡ .form-control-range.

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯊꯥꯗꯣꯀꯈꯤ .input-group-appendꯑꯃꯁꯨꯡ .input-group-prepend. ꯍꯧꯖꯤꯛꯇꯤ ꯅꯍꯥꯛꯅꯥ ꯕꯇꯅꯁꯤꯡ ꯈꯛꯇꯃꯛ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯌꯥꯔꯦ ꯑꯃꯁꯨꯡ .input-group-textꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡꯒꯤ ꯗꯥꯏꯔꯦꯛꯇ ꯑꯉꯥꯡꯁꯤꯡ ꯑꯣꯏꯅꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯌꯥꯔꯦ꯫

  • ꯚꯦꯂꯤꯗꯦꯁꯟ ꯐꯤꯗꯕꯦꯛ ꯕꯥꯒ ꯂꯩꯕꯥ ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯇꯥ ꯃꯇꯝ ꯁꯥꯡꯅꯥ ꯂꯩꯔꯛꯂꯕꯥ ꯃꯤꯁꯤꯡ ꯕꯣꯔꯗꯔ ꯔꯦꯗꯤꯌꯁ ꯑꯁꯤ ꯚꯦꯂꯤꯗꯦꯁꯅꯒꯥ.has-validation ꯂꯣꯌꯅꯅꯥ ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯑꯔꯣꯏꯕꯗꯥ ꯐꯤꯛꯁ ꯇꯧꯏ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯃꯒꯤꯗꯃꯛ ꯐꯣꯔꯝ-ꯁ꯭ꯄꯦꯁꯤꯐꯤꯛ ꯂꯦꯑꯥꯎꯠ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯊꯥꯗꯣꯀꯈꯤ꯫ .form-group, .form-row, ꯅꯠꯔꯒꯥ .form-inline.

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯐꯣꯔꯝ ꯂꯦꯕꯦꯂꯁꯤꯡ ꯍꯧꯖꯤꯛ .form-label.

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ .form-textno longer sets display, HTML ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯍꯣꯡꯗꯣꯀꯄꯥ ꯈꯛꯇꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯄꯥꯝꯂꯤꯕꯃꯈꯩ ꯏꯅꯂꯥꯏꯟ ꯅꯠꯠꯔꯒꯥ ꯕ꯭ꯂꯣꯛ ꯍꯦꯜꯄ ꯇꯦꯛꯁꯠ ꯁꯦꯝꯕꯥ ꯌꯥꯍꯜꯂꯤ꯫

  • ꯚꯦꯂꯤꯗꯦꯁꯟ ꯑꯥꯏꯀꯅꯁꯤꯡ ꯑꯁꯤ <select>ꯍꯧꯖꯤꯛꯇꯤ multiple.

  • scss/forms/ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯞ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯌꯥꯑꯣꯅꯥ , ꯃꯈꯥꯗꯥ ꯂꯩꯕꯥ ꯁꯣꯔꯁ ꯁꯥꯁ ꯐꯥꯏꯂꯁꯤꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯗꯣꯀꯈ꯭ꯔꯦ꯫

ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡ꯫

  • ꯑꯩꯈꯣꯌꯒꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯗꯥ paddingꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ ꯑꯦꯂꯔꯇꯁꯤꯡ, ꯕ꯭ꯔꯦꯗꯛꯔꯥꯝ, ꯀꯥꯔꯗ, ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ, ꯂꯤꯁ꯭ꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡ, ꯃꯣꯗꯦꯂꯁꯤꯡ, ꯄꯣꯄꯣꯚꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯇꯨꯂꯇꯤꯄꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯄꯨꯅꯕꯥ ꯚꯦꯜꯌꯨꯁꯤꯡ꯫ #꯳꯰꯵꯶꯴ ꯌꯦꯡꯕꯤꯌꯨ .$spacer

ꯑꯦꯀꯣꯔꯗꯟ ꯑꯣꯏꯕꯥ꯫

ꯑꯦꯂꯔꯇꯁꯤꯡ ꯄꯤꯔꯤ꯫

  • ꯑꯦꯂꯔꯇꯁꯤꯡꯗꯥ ꯍꯧꯖꯤꯛ ꯑꯥꯏꯀꯅꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯈꯨꯗꯃꯁꯤꯡ ꯂꯩꯔꯦ .

  • <hr>ꯃꯈꯣꯌꯅꯥ ꯍꯥꯟꯅꯅꯥ ꯁꯤꯖꯤꯟꯅꯔꯀꯄꯗꯒꯤ ꯑꯦꯂꯔꯠ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ sꯒꯤꯗꯃꯛ ꯀꯁ꯭ꯇꯝ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ currentColor.

ꯕꯦꯖꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

  • ꯕ꯭ꯔ��ꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯃꯆꯨꯒꯤ ꯀ꯭ꯂꯥꯁ ꯄꯨꯝꯅꯃꯛ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ .badge-*(ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, .bg-primaryꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯁꯤꯖꯤꯟꯅꯧ .badge-primary).

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ .badge-pill—ꯃꯗꯨꯒꯤ .rounded-pillꯃꯍꯨꯠꯇꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯁꯤꯖꯤꯟꯅꯧ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫<a>ꯑꯃꯁꯨꯡ <button>ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯍꯣꯚꯔ ꯑꯃꯁꯨꯡ ꯐꯣꯀꯁ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫

  • .25em/ ꯗꯒꯤ / .5emꯐꯥꯑꯣꯕꯒꯤ .35emꯕꯦꯖꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯗꯤꯐꯣꯜꯇ ꯄꯦꯗꯤꯡ ꯍꯦꯅꯒꯠꯍꯜꯂꯦ .65em.

  • padding, , background-colorꯑꯃꯁꯨꯡ .border-radius

  • --bs-breadcrumb-dividerCSS ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯅꯥ ꯐꯖꯅꯥ ꯀꯁ꯭ꯇꯃꯔꯥꯏꯖꯦꯁꯟ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯑꯅꯧꯕꯥ CSS ꯀꯁ꯭ꯇꯝ ꯄ꯭ꯔꯣꯄꯔꯇꯤ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

ꯕꯇꯅꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ ꯇꯣꯒꯜ ꯕꯇꯅꯁꯤꯡ , ꯆꯦꯀꯕꯣꯛꯁ ꯅꯠꯠꯔꯒꯥ ꯔꯦꯗꯤꯑꯣꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ, ꯍꯧꯖꯤꯛ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯃꯊꯧ ꯇꯥꯗ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯑꯅꯧꯕꯥ ꯃꯥꯔꯀꯑꯥꯞ ꯂꯩꯔꯦ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯔꯦꯄꯤꯡꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯗ꯭ꯔꯦ, , ꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ.btn-check,<input>ꯑꯃꯁꯨꯡ. #꯳꯰꯶꯵꯰ ꯌꯦꯡꯕꯤꯌꯨ . ꯃꯁꯤꯒꯤꯗꯃꯛꯇꯥ ꯗꯣꯀꯁꯤꯡ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯕꯇꯅꯁꯤꯡꯒꯤ ꯄꯦꯖꯗꯒꯤ ꯑꯅꯧꯕꯥ ꯐꯣꯔꯃꯁꯤꯡ ꯁꯦꯛꯁꯅꯗꯥ ꯆꯠꯈ꯭ꯔꯦ꯫.btn<label>

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ .btn-blockꯊꯥꯗꯣꯀꯈꯤ꯫ .btn-block, ꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ .btn, ꯅꯍꯥꯛꯀꯤ ꯕꯇꯅꯁꯤꯡ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ .d-gridꯑꯃꯁꯨꯡ .gap-*ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯁ꯭ꯄꯦꯁ ꯇꯧꯅꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯑꯃꯥ ꯔꯦꯞ ꯇꯧ꯫ ꯃꯈꯣꯌꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯀꯟꯠꯔꯣꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯗꯥ ꯍꯣꯡꯗꯣꯀꯎ꯫ ꯈꯨꯗꯝ ꯈꯔꯒꯤꯗꯃꯛ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯁꯤꯡ ꯑꯗꯨ ꯄꯥꯕꯤꯌꯨ꯫

  • ꯑꯍꯦꯅꯕꯥ ꯄꯦꯔꯥꯃꯤꯇꯔꯁꯤꯡ ꯁꯄꯣꯔꯠ ꯇꯧꯅꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ button-variant()ꯑꯃꯁꯨꯡ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯄꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫button-outline-variant()

  • ꯍꯣꯚꯔ ꯑꯃꯁꯨꯡ ꯑꯦꯛꯇꯤꯕ ꯁ꯭ꯇꯦꯇꯁꯤꯡꯗꯥ ꯀꯟꯠꯔꯁ꯭ꯠ ꯍꯦꯅꯒꯠꯍꯅꯕꯥ ꯉꯝꯅꯕꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯥ ꯕꯇꯅꯁꯤꯡ꯫

  • ꯗꯤꯁꯑꯦꯕꯜ ꯑꯣꯏꯔꯕꯥ ꯕꯇꯅꯁꯤꯡꯗꯥ ꯍꯧꯖꯤꯛ pointer-events: none;.

ꯀꯥꯔꯗ ꯑꯃꯥ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.card-deckꯑꯩꯈꯣꯌꯒꯤ ꯒ꯭ꯔꯤꯗꯀꯤ ꯃꯇꯦꯡꯅꯥ ꯊꯨꯒꯥꯏꯈꯤ꯫ ꯅꯍꯥꯛꯀꯤ ꯀꯥꯔꯗꯁꯤꯡ ꯑꯗꯨ ꯀꯣꯂꯝ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯗꯥ ꯔꯦꯞ ꯇꯧ ꯑꯃꯁꯨꯡ .row-cols-*ꯀꯥꯔꯗ ꯗꯦꯀꯁꯤꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯒꯠꯅꯕꯥ ꯃꯃꯥ-ꯃꯄꯥꯒꯤ ꯀꯟꯇꯦꯅꯔ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ (ꯑꯗꯨꯕꯨ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯦꯂꯥꯏꯅꯃꯦꯟꯇꯀꯤ ꯃꯊꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯀꯟꯠꯔꯣꯜ ꯂꯩꯕꯥ)꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯃꯦꯁꯅꯔꯤꯒꯤ .card-columnsꯃꯇꯦꯡꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫ #꯲꯸꯹꯲꯲ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.cardꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ ꯑꯦꯀꯣꯔꯗꯟ ꯑꯁꯤ ꯑꯅꯧꯕꯥ ꯑꯦꯀꯣꯔꯗꯟ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯒꯥ ꯃꯍꯨꯠ ꯁꯤꯅꯈ꯭ꯔꯦ .

ꯕꯇꯟ ꯑꯗꯨ ꯊꯤꯡꯖꯤꯜꯂꯨ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.closeꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯖꯦꯅꯦꯔꯦꯛ ꯑꯣꯏꯕꯥ ꯃꯤꯡ .btn-closeꯑꯃꯒꯤꯗꯃꯛ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ꯫

  • ꯀ꯭ꯂꯣꯖ ꯕꯇꯅꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ HTMLꯗꯥ background-imageaꯒꯤ ꯃꯍꯨꯠꯇꯥ (ꯑꯦꯝꯕꯦꯗꯦꯗ SVG) ꯁꯤꯖꯤꯟꯅꯔꯦ &times;, ꯃꯁꯤꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯃꯥꯔꯀꯑꯥꯞ ꯑꯗꯨ ꯊꯨꯒꯥꯏꯕꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯅꯥ ꯍꯦꯟꯅꯥ ꯂꯥꯌꯕꯥ ꯀꯁ꯭ꯇꯃꯔꯥꯏꯖꯦꯁꯟ ꯇꯧꯕꯥ ꯌꯥꯍꯜꯂꯤ꯫

  • ꯑꯟꯙ꯭ꯔ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗꯁꯤꯡꯒꯤ ꯃꯥꯌꯣꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯀꯟꯠꯔꯁ꯭ꯠ ꯗꯤꯁꯃꯤꯁ ꯑꯥꯏꯀꯅꯁꯤꯡ ꯏꯅꯦꯕꯜ ꯇꯧꯅꯕꯥ .btn-close-whiteꯁꯤꯖꯤꯟꯅꯔꯤꯕꯥ ꯑꯅꯧꯕꯥ ꯚꯦꯔꯤꯑꯦꯟꯇ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫filter: invert(1)

ꯋꯥꯟꯡꯕ

  • ꯑꯦꯀꯣꯔꯗꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯁ꯭ꯛꯔꯣꯜ ꯑꯦꯉ꯭ꯀꯔ ꯇꯧꯕꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫

  • .dropdown-menu-darkꯑꯣꯟ-ꯗꯤꯃꯥꯟꯗ ꯗꯥꯔꯛ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯑꯅꯧꯕꯥ ꯚꯦꯔꯤꯑꯦꯟꯇ ꯑꯃꯁꯨꯡ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

  • ꯒꯤꯗꯃꯛ ꯑꯅꯧꯕꯥ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯍꯥꯄꯆꯤꯜꯂꯦ $dropdown-padding-x.

  • ꯑꯍꯣꯡꯕꯥ ꯀꯟꯠꯔꯁ꯭ꯇꯀꯤꯗꯃꯛ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯗꯤꯚꯥꯏꯗꯔ ꯑꯗꯨ ꯑꯃꯝꯕꯗꯥ ꯊꯨꯒꯥꯏꯈꯤ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯒꯤꯗꯃꯛ ꯏꯚꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯍꯧꯖꯤꯛꯇꯤ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯇꯣꯒꯜ ꯕꯇꯟ ꯑꯗꯨꯗꯥ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯃꯃꯥ-ꯃꯄꯥꯒꯤ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯕꯕꯜ ꯇꯧꯔꯦ꯫

  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯁꯤꯡꯗꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯒꯤ data-bs-popper="static"ꯄꯣꯖꯤꯁꯟ ꯑꯁꯤ ꯁ꯭ꯇꯦꯇꯤꯛ ꯑꯣꯏꯕꯥ data-bs-popper="none"ꯃꯇꯃꯗꯥ ꯑꯃꯁꯨꯡ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯑꯁꯤ ꯅꯦꯚꯕꯥꯔꯗꯥ ꯂꯩꯕꯥ ꯃꯇꯃꯗꯥ ꯁꯦꯠ ꯇꯧꯕꯥ ꯑꯦꯠꯔꯤꯕ꯭ꯌꯨꯠ ꯑꯃꯥ ꯂꯩꯔꯦ꯫ ꯃꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯤ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯅꯥ ꯄꯣꯄꯔꯒꯤ ꯄꯣꯖꯤꯁꯅꯗꯥ ꯑꯀꯥꯌꯕꯥ ꯄꯤꯗꯅꯥ ꯀꯁ꯭ꯇꯝ ꯄꯣꯖꯤꯁꯟ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯏ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯅꯦꯇꯤꯕ ꯄꯣꯄꯔ ꯀꯅꯐꯤꯒꯔꯦꯁꯅꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯄ꯭ꯂꯒꯏꯅꯒꯤꯗꯃꯛ flipꯑꯣꯄꯁꯟ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯍꯧꯖꯤꯛꯇꯤ ꯅꯍꯥꯛꯅꯥ ꯐ꯭ꯂꯤꯞ ꯃꯣꯗꯤꯐꯥꯏꯌꯔꯗꯥ fallbackPlacementsꯑꯣꯄꯁꯅꯒꯤꯗꯃꯛ ꯏꯝꯄꯣꯔꯠ ꯑꯦꯔꯦ ꯑꯃꯥ ꯄꯥꯁ ꯇꯧꯗꯨꯅꯥ ꯐ꯭ꯂꯤꯞ ꯕꯤꯍꯦꯕꯤꯌꯔ ꯑꯗꯨ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯕꯥ ꯌꯥꯔꯦ꯫

  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯣꯇꯣ ꯀ꯭ꯂꯣꯖ ꯕꯤꯍꯦꯕꯤꯌꯔautoClose ꯍꯦꯟꯗꯜ ꯇꯧꯅꯕꯥ ꯑꯅꯧꯕꯥ ꯑꯣꯄꯁꯟ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀ꯭ꯂꯤꯛ ꯇꯧꯕꯥ ꯌꯥꯔꯦ . ꯅꯍꯥꯛꯅꯥ ꯑꯣꯄꯁꯟ ꯑꯁꯤ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯅꯠꯠꯔꯒꯥ ꯃꯄꯥꯟꯗꯥ ꯀ꯭ꯂꯤꯛ ꯇꯧꯗꯨꯅꯥ ꯃꯁꯤꯕꯨ ꯏꯟꯇꯔꯦꯛꯇꯤꯕ ꯑꯣꯏꯍꯟꯅꯕꯥ ꯌꯥꯕꯥ ꯌꯥꯏ꯫

  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛ .dropdown-itemꯑꯦꯁ.ꯗꯥ ꯔꯦꯞ ꯇꯧꯔꯕꯥ <li>ꯑꯦꯁ.

ꯖꯝꯕꯣꯠꯔꯣꯟ꯫

ꯂꯤꯁ꯭ꯠ ꯒ꯭ꯔꯨꯞ꯫

  • , , , ꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁꯇꯥ ꯑꯅꯧꯕꯥ nullꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫font-sizefont-weightcolor:hover color.nav-link
  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯅꯦꯚꯕꯥꯔꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛ ꯃꯅꯨꯡꯗꯥ ꯀꯟꯇꯦꯅꯔ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯏ (ꯁ꯭ꯄꯦꯁꯤꯡꯒꯤ ꯃꯊꯧ ꯇꯥꯕꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯊꯧ ꯇꯥꯕꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯁꯤꯡ ꯌꯥꯝꯅꯥ ꯂꯥꯏꯊꯣꯀꯍꯟꯅꯕꯥ)꯫

ꯑꯣꯐꯀꯦꯅꯚꯥꯁ ꯇꯧꯕꯥ꯫

ꯄꯦꯖꯤꯅꯦꯁꯟ ꯇꯧꯕꯥ꯫

  • ꯄꯦꯖꯤꯅꯦꯁꯟ ꯂꯤꯉ꯭ꯀꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ margin-leftꯑꯃꯒꯥ ꯑꯃꯒꯥ ꯇꯣꯈꯥꯌꯅꯥ ꯂꯩꯕꯥ ꯃꯇꯃꯗꯥ ꯀꯣꯟꯅꯥ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ ꯗꯥꯏꯅꯥꯃꯤꯛ ꯑꯣꯏꯅꯥ ꯒꯣꯜꯗ ꯇꯧꯕꯥ ꯀꯁ꯭ꯇꯃꯔꯁꯤꯡ ꯂꯩꯔꯦ꯫

  • transitionꯄꯦꯖꯤꯅꯦꯁꯟ ꯂꯤꯉ꯭ꯀꯁꯤꯡꯗꯥ s ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

ꯄꯣꯄꯣꯚꯔꯁꯤꯡ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯑꯩꯈꯣꯌꯒꯤ ꯗꯤꯐꯣꯜꯇ ꯄꯣꯄꯣꯚꯔ ꯇꯦꯃꯞꯂꯦꯠꯇꯥ .arrowꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫.popover-arrow

  • ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤꯕꯥ whiteListꯑꯣꯄꯁꯟ ꯑꯗꯨ allowList.

ꯁ꯭ꯄꯤꯅꯥꯔꯁꯤꯡ꯫

  • ꯁ꯭ꯄꯤꯅꯔꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛ prefers-reduced-motion: reduceꯑꯦꯅꯤꯃꯦꯁꯅꯁꯤꯡ ꯇꯞꯅꯥ ꯇꯞꯅꯥ ꯏꯀꯥꯌꯈꯨꯝꯅꯕꯥ ꯎꯠꯂꯤ꯫ #꯳꯱꯸꯸꯲ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯁ꯭ꯄꯤꯅꯥꯔ ꯚꯔꯇꯤꯀꯦꯜ ꯑꯦꯂꯥꯏꯟꯃꯦꯟꯇ ꯐꯒꯠꯍꯅꯕꯥ꯫

ꯇꯣꯁ꯭ꯇꯁꯤꯡ꯫

  • ꯇꯣꯁ꯭ꯇꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯄꯣꯖꯤꯁꯟ ꯄꯤꯕꯒꯤ ꯃꯇꯦꯡꯅꯥ ꯑꯦꯗꯥ ꯄꯣꯖꯤꯁꯟ ꯇꯧꯕꯥ ꯌꯥꯔꯦ ..toast-container

  • ꯗꯤꯐꯣꯜꯇ ꯇꯣꯁ꯭ꯇꯀꯤ ꯃꯇꯝ ꯁꯦꯀꯦꯟꯗ ꯵ꯗꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫

  • overflow: hiddenꯇꯣꯁ꯭ꯇꯁꯤꯡꯗꯒꯤ ꯂꯧꯊꯣꯀꯈꯤ ꯑꯃꯁꯨꯡ ꯐꯉ꯭ꯀꯁꯅꯁꯤꯡꯒꯥ border-radiusꯂꯣꯌꯅꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯑꯦꯁꯁꯤꯡꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯅꯈꯤ꯫calc()

ꯇꯨꯂꯇꯤꯄꯁꯤꯡ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.arrowꯑꯩꯈꯣꯌꯒꯤ .tooltip-arrowꯗꯤꯐꯣꯜꯇ ꯇꯨꯂꯇꯤꯞ ꯇꯦꯃꯞꯂꯦꯠꯇꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯄꯣꯄꯔ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯄ꯭ꯂꯦꯁꯃꯦꯟꯇ ꯇꯧꯅꯕꯒꯤꯗꯃꯛꯇꯥ ꯗꯤꯐꯣꯜꯇ ꯚꯦꯜꯌꯨ ꯑꯗꯨ fallbackPlacementsꯍꯣꯡꯗꯣꯀꯏ꯫['top', 'right', 'bottom', 'left']

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤꯕꯥ whiteListꯑꯣꯄꯁꯟ ꯑꯗꯨ allowList.

ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫RTL ꯁꯄꯣꯔꯠ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯗꯥꯏꯔꯦꯛꯇꯣꯔꯦꯜ ꯅꯦꯃꯁꯤꯡꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯂꯣꯖꯤꯀꯦꯜ ꯄ꯭ꯔꯣꯄꯔꯇꯤ ꯅꯦꯃꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀꯌꯥꯒꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ:

    • ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .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ꯑꯅꯧꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ .

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.text-monospaceꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .font-monospace.

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫.text-hideꯃꯁꯤ ꯃꯈꯥ ꯇꯥꯅꯥ ꯁꯤꯖꯤꯟꯅꯔꯣꯏꯗꯕꯥ ꯇꯦꯛꯁꯠ ꯂꯣꯠꯁꯤꯟꯅꯕꯥ ꯑꯔꯤꯕꯥ ꯃꯦꯊꯗ ꯑꯃꯥ ꯑꯣꯏꯕꯅꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫

  • .fs-*ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ font-size(RFS ꯏꯅꯦꯕꯜ ꯇꯧꯔꯕꯥ)꯫ ꯍꯥꯌꯔꯤꯕꯁꯤꯡ ꯑꯁꯤꯅꯥ HTMLꯒꯤ ꯗꯤꯐꯣꯜꯇ ꯍꯦꯗꯤꯡꯁꯤꯡ (꯱-꯶, ꯑꯆꯧꯕꯥꯗꯒꯤ ꯑꯄꯤꯀꯄꯥ ꯐꯥꯑꯣꯕꯥ)ꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯁ꯭ꯀꯦꯜ ꯁꯤꯖꯤꯟꯅꯩ, ꯑꯃꯁꯨꯡ ꯁꯥꯁ ꯃꯦꯄꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯕꯥ ꯌꯥꯏ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯕ꯭ꯔꯦꯚꯤꯇꯤ ꯑꯃꯁꯨꯡ ꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯁꯤꯒꯤ .font-weight-*ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ꯫.fw-*

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯕ꯭ꯔꯦꯚꯤꯇꯤ ꯑꯃꯁꯨꯡ ꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯁꯤꯒꯤ .font-style-*ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ꯫.fst-*

  • ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯒ꯭ꯔꯤꯗ ꯑꯃꯁꯨꯡ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯂꯦꯑꯥꯎꯇꯁꯤꯡꯒꯤꯗꯃꯛ .d-gridꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯅꯧꯕꯥ gapꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ( ) ꯌꯦꯡꯁꯤꯟꯅꯕꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫.gap

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯂꯧꯊꯣꯀꯈꯤ .rounded-smꯑꯃꯁꯨꯡ rounded-lg, ꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ ꯑꯅꯧꯕꯥ ꯁ꯭ꯀꯦꯜ ꯑꯃꯥ ꯍꯧꯗꯣꯀꯈꯤ .rounded-0, .rounded-3. #꯳꯱꯶꯸꯷ ꯌꯦꯡꯕꯤꯌꯨ .

  • line-heightꯑꯅꯧꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ : .lh-1, .lh-sm, .lh-baseꯑꯃꯁꯨꯡ .lh-lg. ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯌꯦꯡꯕꯤꯌꯨ .

  • ꯑꯇꯣꯞꯄꯥ ꯗꯤꯁꯞꯂꯦ .d-noneꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯗꯒꯤ ꯍꯦꯟꯅꯥ ꯑꯔꯨꯝꯕꯥ ꯄꯤꯅꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯇꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯑꯁꯤ ꯂꯧꯊꯣꯀꯈꯤ꯫

  • ꯀꯟꯇꯦꯅꯔꯁꯤꯡꯗꯁꯨ ꯊꯕꯛ ꯇꯧꯅꯕꯥ ꯍꯦꯜꯄꯔ ꯑꯗꯨ ꯁꯥꯡꯗꯣꯀꯈꯤ .visually-hidden-focusable, ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ :focus-within.

ꯃꯇꯦꯡ ꯄꯥꯡꯕꯁꯤꯡ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯦꯝꯕꯦꯗ ꯍꯦꯜꯄꯔꯁꯤꯡ ꯑꯁꯤ ꯑꯅꯧꯕꯥ ꯀ꯭ꯂꯥꯁꯀꯤ ꯃꯃꯤꯡꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯍꯣꯡꯕꯥ ꯂꯃꯆꯠ-ꯁꯥꯖꯠꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯔꯦꯁꯤꯑꯣ ꯍꯦꯜꯄꯔꯁꯤꯡꯗꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ , ꯃꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯇꯦꯡ ꯑꯣꯏꯕꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.

    • byꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ xꯑꯦꯁ꯭ꯄꯦꯛꯇ ꯔꯦꯁꯤꯑꯣꯗꯥ ꯍꯣꯡꯗꯣꯛꯅꯕꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, .ratio-16by9ꯍꯧꯖꯤꯛ .ratio-16x9.
    • ꯑꯩꯈꯣꯌꯅꯥ .embed-responsive-itemꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯒ꯭ꯔꯨꯞ ꯁꯦꯂꯦꯛꯇꯔ ꯑꯁꯤ ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ .ratio > *ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯑꯍꯦꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯠꯇꯥ ꯃꯊꯧ ꯇꯥꯗꯦ, ꯑꯃꯁꯨꯡ ꯔꯦꯁꯤꯑꯣ ꯍꯦꯜꯄꯔ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ HTML ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯍꯦꯛꯇꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯊꯕꯛ ꯇꯧꯔꯦ꯫
    • ꯁꯥꯁ ꯃꯦꯞ ꯑꯁꯤ $embed-responsive-aspect-ratiosꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯤ ꯚꯦꯜꯌꯨꯁꯤꯡ ꯑꯁꯤ ꯀ꯭ꯂꯥꯁꯀꯤ ꯃꯃꯤꯡ ꯑꯃꯁꯨꯡ ꯆꯥꯗꯥ ꯑꯁꯤ ꯄꯦꯔꯥ $aspect-ratiosꯑꯣꯏꯅꯥ ꯌꯥꯑꯣꯍꯟꯅꯕꯥ ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯦ꯫key: value
    • ꯍꯧꯖꯤꯛꯇꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯁꯦꯃꯒꯠꯂꯦ ꯑꯃꯁꯨꯡ ꯁꯥꯁ ꯃꯦꯄꯇꯥ ꯚꯦꯜꯌꯨ ꯈꯨꯗꯤꯡꯃꯛꯀꯤ ꯑꯣꯏꯅꯥ ꯌꯥꯑꯣꯔꯦ꯫ ꯀꯁ꯭ꯇꯝ ꯑꯦꯁ꯭ꯄꯦꯛꯇ ꯔꯦꯁꯤꯑꯣ ꯑꯃꯠꯇꯥ ꯁꯦꯝꯅꯕꯥ --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 ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯊꯥꯗꯣꯀꯈꯤ ꯑꯃꯁꯨꯡ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯗꯨ ꯆꯥꯡ ꯅꯥꯏꯅꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯇꯥ ꯂꯩꯅꯕꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯈꯤ꯫

  • ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛꯀꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯅꯦꯃꯁ꯭ꯄꯦꯁ ꯇꯧꯔꯦ ꯃꯗꯨꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤ ꯑꯁꯤ ꯊꯥꯔꯗ ꯄꯥꯔꯇꯤꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯅꯍꯥꯛꯀꯤ ꯏꯁꯥꯒꯤ ꯀꯣꯗꯇꯒꯤ ꯈꯦꯠꯅꯍꯅꯕꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯏ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ data-bs-toggleꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ data-toggle.

  • ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯍꯥꯅꯕꯥ ꯑꯥꯔꯒꯨꯃꯦꯟꯇ ꯑꯣꯏꯅꯥ CSS ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯥ ꯌꯥꯕꯥ ꯌꯥꯔꯦ꯫ ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯑꯅꯧꯕꯥ ꯏꯟꯁꯇꯦꯟꯁ ꯑꯃꯥ ꯁꯦꯝꯅꯕꯥ ꯅꯍꯥꯛꯅꯥ DOM ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯅꯠꯠꯔꯒꯥ ꯆꯠꯅꯕꯥ ꯌꯥꯕꯥ CSS ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯍꯦꯛꯇꯕꯨ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ:

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

  • popperConfigꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯗꯤꯐꯣꯜꯇ ꯄꯣꯄꯔ ꯀꯅꯐꯤꯒ ꯑꯗꯨ ꯑꯥꯔꯒꯨꯃꯦꯟꯇ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯌꯥꯕꯥ ꯐꯉ꯭ꯀꯁꯟ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯗꯤꯐꯣꯜꯇ ꯀꯅꯐꯤꯒꯔꯦꯁꯟ ꯑꯁꯤ ꯅꯍꯥꯛꯀꯤ ꯃꯑꯣꯡꯗꯥ ꯃꯔꯖ ꯇꯧꯕꯥ ꯌꯥꯒꯅꯤ꯫ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ, ꯄꯣꯄꯣꯚꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯇꯨꯂꯇꯤꯄꯁꯤꯡꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫

  • ꯄꯣꯄꯔ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤ ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯄ꯭ꯂꯦꯁꯃꯦꯟꯇꯀꯤꯗꯃꯛ ꯗꯤꯐꯣꯜꯇ ꯚꯦꯜꯌꯨ ꯑꯗꯨ fallbackPlacementsꯍꯣꯡꯗꯣꯀꯏ꯫ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ, ꯄꯣꯄꯣꯚꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯇꯨꯂꯇꯤꯄꯁꯤꯡꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫['top', 'right', 'bottom', 'left']

  • _getInstance()→ getInstance()ꯒꯨꯝꯕꯥ ꯄꯕ꯭ꯂꯤꯛ ꯁ꯭ꯇꯦꯇꯤꯛ ꯃꯦꯊꯗꯁꯤꯡꯗꯒꯤ ꯑꯟꯗꯔꯁ꯭ꯀꯣꯔ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫