Source

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

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

ꯂꯦꯡꯗꯕꯥ ꯑꯍꯣꯡꯕꯁꯤꯡ꯫

ꯕꯦꯇꯥ ꯳ꯗꯒꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯁ꯭ꯇꯦꯕꯜ v4.0 ꯔꯤꯂꯤꯖꯗꯥ ꯆꯪꯁꯤꯜꯂꯀꯄꯥ ꯃꯇꯃꯗꯥ, ꯕ꯭ꯔꯦꯀꯤꯡ ꯑꯣꯏꯕꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯦ, ꯑꯗꯨꯕꯨ ꯊꯣꯏꯗꯣꯀꯄꯥ ꯑꯍꯣꯡꯕꯥ ꯈꯔꯥ ꯂꯩ꯫

ꯄ꯭ꯔꯤꯟꯇꯤꯡ ꯇꯧꯕꯥ꯫

  • ꯊꯨꯒꯥꯏꯔꯕꯥ ꯄ꯭ꯔꯤꯟꯇ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯐꯤꯛꯁ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯃꯃꯥꯡꯗꯥ .d-print-*ꯀ꯭ꯂꯥꯁ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯕꯅꯥ ꯑꯇꯣꯞꯄꯥ .d-*ꯀ꯭ꯂꯥꯁ ꯑꯃꯍꯦꯛꯇꯕꯨ ꯃꯈꯥ ꯇꯥꯅꯥ ꯑꯣꯚꯔꯔꯨꯜ ꯇꯧꯒꯅꯤ꯫ ꯍꯧꯖꯤꯛ, ꯃꯈꯣꯌꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯑꯇꯣꯞꯄꯥ ꯗꯤꯁꯞꯂꯦ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯩ ꯑꯃꯁꯨꯡ ꯃꯤꯗꯤꯌꯥ ꯑꯗꯨꯗꯥ ꯈꯛꯇꯃꯛ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ ( @media print).

  • ꯑꯇꯣꯞꯄꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯑꯣꯏꯅꯥ ꯐꯪꯂꯤꯕꯥ ꯄ꯭ꯔꯤꯟꯇ ꯗꯤꯁꯞꯂꯦ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯄꯥꯀꯊꯣꯛ ꯆꯥꯎꯊꯣꯀꯍꯜꯂꯦ꯫ ꯕꯦꯇꯥ ꯳ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯤ ꯃꯊꯛꯇꯥ ꯂꯩꯕꯥ ꯈꯛꯇꯗꯥ block, inline-block, inline, ꯑꯃꯁꯨꯡ none. ꯁ꯭ꯇꯦꯕꯜ v4 ꯍꯥꯄꯆꯤꯜꯂꯦ flex, inline-flex, table, table-row, ꯑꯃꯁꯨꯡ table-cell.

  • @page size. _

ꯕꯦꯇꯥ ꯳ ꯍꯣꯡꯏ꯫

ꯕꯦꯇꯥ ꯲ꯅꯥ ꯕꯦꯇꯥ ꯐꯦꯖꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯕ꯭ꯔꯦꯀꯤꯡꯒꯤ ꯑꯍꯣꯡꯕꯁꯤꯡꯒꯤ ꯑꯆꯧꯕꯥ ꯁꯔꯨꯛ ꯑꯗꯨ ꯎꯕꯥ ꯃꯇꯃꯗꯥ, ꯑꯗꯨꯕꯨ ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯀꯁꯨ ꯕꯦꯇꯥ ꯳ ꯔꯤꯂꯤꯖꯗꯥ ꯊꯦꯡꯅꯒꯗꯕꯥ ꯈꯔꯥ ꯂꯩꯔꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯕꯦꯇꯥ 2 ꯅꯠꯠꯔꯒꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯑꯔꯤꯕꯥ ꯚꯔꯁꯟ ꯑꯃꯍꯦꯛꯇꯗꯒꯤ ꯕꯦꯇꯥ 3ꯗꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯗꯤ ꯑꯍꯣꯡꯕꯁꯤꯡ ꯑꯁꯤ ꯆꯠꯅꯒꯅꯤ꯫

ꯑꯇꯩ ꯑꯇꯩ

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

ꯐꯣꯔꯃꯁꯤꯡ꯫

  • ꯀꯁ꯭ꯇꯝ ꯑꯃꯁꯨꯡ ꯗꯤꯐꯣꯜꯇ ꯆꯦꯀꯕꯣꯛꯁ ꯑꯃꯁꯨꯡ ꯔꯦꯗꯤꯑꯣ ꯑꯅꯤꯃꯛ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫ ꯍꯧꯖꯤꯛ, ꯑꯅꯤꯃꯛꯇꯥ ꯃꯦꯆꯤꯡ HTML ꯁ꯭ꯠꯔꯀꯆꯔ ( <div>ꯁꯤꯕꯂꯤꯡ <input>ꯑꯃꯁꯨꯡ <label>) ꯑꯃꯁꯨꯡ ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯂꯦꯑꯥꯎꯠ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ (ꯁ꯭ꯇꯦꯛ ꯇꯧꯔꯕꯥ ꯗꯤꯐꯣꯜꯇ, ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯀ꯭ꯂꯥꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯏꯅꯂꯥꯏꯟ) ꯂꯩꯔꯦ꯫ ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯗꯥ ꯏꯅꯄꯨꯠꯀꯤ ꯐꯤꯚꯃꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯔꯒꯥ ꯂꯦꯕꯦꯜ ꯑꯗꯨ ꯁ꯭ꯇꯥꯏꯜ ꯇꯧꯕꯥ ꯌꯥꯍꯜꯂꯤ, disabledꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯒꯤꯗꯃꯛ ꯁꯄꯣꯔꯠ ꯑꯗꯨ ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯤ (ꯃꯃꯥꯡꯗꯥ ꯃꯃꯥ-ꯃꯄꯥꯒꯤ ꯀ꯭ꯂꯥꯁ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯈꯤ) ꯑꯃꯁꯨꯡ ꯑꯩꯈꯣꯌꯒꯤ ꯐꯣꯔꯝ ꯚꯦꯂꯤꯗꯦꯁꯟ ꯑꯗꯨ ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯏ꯫

    ꯃꯁꯤꯒꯤ ꯁꯔꯨꯛ ꯑꯃꯥ ꯑꯣꯏꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ background-imageꯀꯁ꯭ꯇꯝ ꯐꯣꯔꯝ ꯆꯦꯀꯕꯣꯛꯁ ꯑꯃꯁꯨꯡ ꯔꯦꯗꯤꯑꯣꯁꯤꯡꯗꯥ ꯃꯜꯇꯤꯄꯜ ꯑꯦꯁ ꯃꯦꯅꯦꯖ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ. ꯃꯃꯥꯡꯗꯥ, ꯍꯧꯖꯤꯛ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯕꯥ .custom-control-indicatorꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯃꯆꯨ, ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ, ꯑꯃꯁꯨꯡ SVG ꯑꯥꯏꯀꯟ ꯂꯩꯔꯝꯃꯤ꯫ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ꯑꯁꯤ ꯀꯁ꯭ꯇꯃꯁ ꯇꯧꯕꯥ ꯍꯥꯌꯕꯁꯤ ꯑꯗꯣꯝꯅꯥ ꯑꯃꯈꯛꯇꯃꯛ ꯍꯣꯡꯗꯣꯀꯄꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯃꯇꯝ ꯈꯨꯗꯤꯡꯗꯥ ꯃꯗꯨ ꯄꯨꯝꯅꯃꯛ ꯃꯍꯨꯠ ꯁꯤꯅꯕꯥ ꯍꯥꯌꯕꯅꯤ꯫ ꯍꯧꯖꯤꯛ, ꯑꯩꯈꯣꯌꯅꯥ .custom-control-label::beforeꯐꯤꯜ ꯑꯃꯁꯨꯡ ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯀꯤꯗꯃꯛ ꯂꯩꯔꯦ ꯑꯃꯁꯨꯡ .custom-control-label::afterꯑꯥꯏꯀꯟ ꯑꯗꯨ ꯍꯦꯟꯗꯜ ꯇꯧꯏ꯫

    ꯀꯁ꯭ꯇꯝ ꯆꯦꯛ ꯑꯃꯥ ꯏꯅꯂꯥꯏꯟ ꯇꯧꯅꯕꯥ, ꯍꯥꯄꯆꯤꯜꯂꯨ .custom-control-inline.

  • ꯏꯅꯄꯨꯠꯇꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ ꯕꯇꯟ ꯒ꯭ꯔꯨꯄꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯥ ꯁꯦꯂꯦꯛꯇꯔ꯫ ꯁ꯭ꯇꯥꯏꯜ ꯑꯃꯁꯨꯡ ꯕꯤꯍꯦꯕꯤꯌꯔꯒꯤ ꯃꯍꯨꯠꯇꯥ [data-toggle="buttons"] { }, ꯑꯩꯈꯣꯌꯅꯥ dataꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯁꯤ ꯖꯦ.ꯑꯦꯁ.ꯀꯤ ꯂꯃꯆꯠ-ꯁꯥꯖꯠꯁꯤꯡꯒꯤꯗꯃꯛ ꯈꯛꯇꯃꯛ ꯁꯤꯖꯤꯟꯅꯩ ꯑꯃꯁꯨꯡ ꯁ꯭ꯇꯥꯏꯂꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯑꯅꯧꯕꯥ .btn-group-toggleꯀ꯭ꯂꯥꯁ ꯑꯃꯗꯥ ꯊꯥꯖꯕꯥ ꯊꯝꯂꯤ꯫

  • .col-form-legendꯈꯔꯥ ꯐꯒꯠꯂꯕꯥ ꯑꯃꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯗꯨꯅꯥ ꯂꯧꯊꯣꯀꯈꯤ .col-form-label. ꯃꯁꯤꯒꯤ ꯃꯑꯣꯡ ꯑꯁꯤꯅꯥ .col-form-label-smꯑꯃꯁꯨꯡ ꯏꯂꯤꯃꯦꯟꯇꯁꯤꯡꯗꯥ ꯌꯥꯝꯅꯥ ꯂꯥꯏꯅꯥ .col-form-label-lgꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ꯫<legend>

  • ꯀꯁ꯭ꯇꯝ ꯐꯥꯏꯜ ꯏꯅꯄꯨꯠꯁꯤꯡꯅꯥ ꯃꯈꯣꯌꯒꯤ $custom-file-textꯁꯥꯁ ꯚꯦꯔꯤꯑꯦꯕꯂꯗꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯃꯥ ꯐꯪꯈꯤ꯫ ꯃꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯅꯦꯁ꯭ꯇꯦꯗ ꯁꯥꯁ ꯃꯦꯞ ꯑꯃꯥ ꯑꯣꯏꯔꯔꯣꯏ ꯑꯃꯁꯨꯡ ꯍꯧꯖꯤꯛꯇꯤ ꯁ꯭ꯠꯔꯤꯡ ꯑꯃꯈꯛꯇꯃꯛ ꯄꯥꯋꯔ ꯄꯤꯔꯤ- Browseꯕꯇꯟ ꯑꯗꯨ ꯃꯔꯃꯗꯤ ꯃꯗꯨ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯁꯇꯒꯤ ꯁꯦꯃꯒꯠꯄꯥ ꯑꯃꯠꯇꯥ ꯉꯥꯏꯔꯕꯥ ꯄ꯭ꯁꯨꯗꯣ-ꯏꯂꯤꯃꯦꯟꯇꯅꯤ꯫ ꯋꯥꯔꯣꯜ ꯑꯁꯤ Choose fileꯍꯧꯖꯤꯛ .custom-file-label.

ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡ꯫

  • ꯏꯅꯄꯨꯠ ꯒ꯭ꯔꯨꯞ ꯑꯦꯗꯣꯅꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯏꯅꯄꯨꯠ ꯑꯃꯒꯥ ꯆꯥꯡꯗꯝꯅꯕꯗꯥ ꯃꯈꯣꯌꯒꯤ ꯄ꯭ꯂꯦꯁꯃꯦꯟꯇꯀꯤꯗꯃꯛ ꯑꯀꯛꯅꯕꯥ ꯑꯣꯏꯔꯦ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯊꯥꯗꯣꯛꯂꯦ .input-group-addonꯑꯃꯁꯨꯡ .input-group-btnꯑꯅꯧꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯅꯤꯒꯤꯗꯃꯛ, .input-group-prependꯑꯃꯁꯨꯡ .input-group-append. ꯑꯗꯣꯝꯅꯥ ꯍꯧꯖꯤꯛ ꯑꯦꯄꯦꯟꯗ ꯑꯃꯥ ꯅꯠꯔꯒꯥ ꯄ꯭ꯔꯤꯄꯦꯟꯗ ꯑꯃꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ ꯁꯤꯖꯤꯟꯅꯒꯗꯕꯅꯤ, ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯑꯌꯥꯝꯕꯥ ꯁꯔꯨꯛ ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯒꯅꯤ꯫ ꯑꯦꯄꯦꯟꯗ ꯅꯠꯠꯔꯒꯥ ꯄ꯭ꯔꯤꯄꯦꯟꯗ ꯑꯃꯒꯤ ꯃꯅꯨꯡꯗꯥ, ꯅꯍꯥꯛꯀꯤ ꯕꯇꯅꯁꯤꯡ ꯑꯗꯨ ꯑꯇꯣꯞꯄꯥ ꯃꯐꯝ ꯑꯃꯗꯥ ꯂꯩꯒꯗꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯊꯝꯃꯨ, ꯑꯗꯨꯕꯨ ꯇꯦꯛꯁꯠ ꯑꯗꯨ .input-group-text.

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

  • ꯁꯥꯏꯖꯤꯡ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯃꯃꯥ-ꯃꯄꯥ ꯑꯗꯨꯗꯥ ꯑꯣꯏꯒꯗꯕꯅꯤ .input-groupꯑꯃꯁꯨꯡ ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯐꯣꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯗꯥ ꯑꯣꯏꯒꯗꯕꯅꯤ꯫

ꯕꯦꯇꯥ ꯲ ꯍꯣꯡꯏ꯫

ꯕꯦꯇꯥꯗꯥ ꯂꯩꯔꯤꯉꯩꯗꯥ, ꯑꯩꯈꯣꯌꯅꯥ ꯕ꯭ꯔꯦꯀꯤꯡ ꯑꯣꯏꯕꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯃꯠꯇꯥ ꯂꯩꯍꯟꯗꯅꯕꯥ ꯄꯥꯟꯗꯝ ꯊꯝꯂꯤ꯫ ꯑꯗꯨꯕꯨ ꯃꯇꯝ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯊꯧꯔꯥꯡ ꯇꯧꯈꯤꯕꯥ ꯑꯗꯨꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯋꯥꯐꯃꯁꯤꯡ ꯑꯗꯨ ꯆꯠꯊꯗꯦ꯫ ꯃꯈꯥꯗꯥ ꯕꯦꯇꯥ ꯱ꯗꯒꯤ ꯕꯦꯇꯥ ꯲ꯗꯥ ꯆꯪꯂꯀꯄꯥ ꯃꯇꯃꯗꯥ ꯋꯥꯈꯂꯗꯥ ꯊꯃꯒꯗꯕꯥ ꯕ꯭ꯔꯦꯀꯤꯡ ꯑꯍꯣꯡꯕꯁꯤꯡ ꯄꯤꯔꯤ꯫

ꯕ꯭ꯔꯦꯀꯤꯡ ꯇꯧꯕꯥ꯫

  • ꯂꯧꯊꯣꯀꯈꯤꯕꯥ $badge-colorꯚꯦꯔꯤꯑꯦꯕꯜ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯤ ꯁꯤꯖꯤꯟꯅꯐꯝ ꯑꯁꯤ .badge. colorꯑꯩꯈꯣꯌꯅꯥ , ꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ ꯑꯃꯥ ꯂꯧꯅꯕꯥ ꯃꯆꯨꯒꯤ ꯀꯟꯠꯔꯁ꯭ꯠ ꯐꯉ꯭ꯀꯁꯟ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯩ background-color, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯑꯁꯤ ꯃꯊꯧ ꯇꯥꯗꯦ꯫
  • CSS ꯅꯦꯇꯤꯕ ꯐꯤꯜꯇꯔꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯅꯐ꯭ꯂꯤꯛꯇ ꯊꯨꯒꯥꯏꯗꯅꯕꯥ grayscale()ꯐꯉ꯭ꯀꯁꯟ ꯇꯨ ꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ��gray()grayscale
  • ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .table-inverse, .thead-inverse, ꯑꯃꯁꯨꯡ .thead-defaultꯇꯨ .*-darkꯑꯃꯁꯨꯡ .*-light, ꯑꯇꯣꯞꯄꯥ ꯃꯐꯃꯁꯤꯡꯗꯥ ꯁꯤꯖꯤꯟꯅꯔꯤꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯃꯆꯨꯒꯤ ꯁ꯭ꯀꯤꯃꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯕꯥ꯫
  • ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯇꯦꯕꯂꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯒ꯭ꯔꯤꯗ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯈꯨꯗꯤꯡꯃꯛꯀꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯦꯃꯒꯠꯂꯦ꯫ ꯃꯁꯤ ꯕꯦꯇꯥ ꯱ꯗꯒꯤ ꯕ꯭ꯔꯦꯛ ꯇꯧꯏ ꯃꯔꯃꯗꯤ .table-responsiveꯅꯍꯥꯛꯅꯥ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯂꯥꯛꯂꯤꯕꯥ ꯑꯁꯤ ꯍꯦꯟꯅꯥ .table-responsive-md. ꯍꯧꯖꯤꯛꯇꯤ ꯅꯍꯥꯛꯅꯥ .table-responsiveꯅꯠꯠꯔꯒꯥ .table-responsive-{sm,md,lg,xl}ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯒꯅꯤ꯫
  • ꯄꯦꯀꯦꯖ ꯃꯦꯅꯦꯖꯔ ꯑꯁꯤ ꯑꯂꯇꯔꯅꯦꯇꯤꯕꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯌꯥꯔꯟ ꯅꯠꯠꯔꯒꯥ npm) ꯁꯤꯖꯤꯟꯅꯗꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯕꯣꯋꯔ ꯁꯄꯣꯔꯠ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯒꯤꯗꯃꯛꯇꯥ bower/bower#2298 ꯌꯦꯡꯕꯤꯌꯨ꯫
  • ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ ꯍꯧꯖꯤꯀꯁꯨ jQuery 1.9.1 ꯅꯠꯠꯔꯒꯥ ꯃꯁꯤꯗꯒꯤ ꯍꯦꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯏ, ꯑꯗꯨꯕꯨ v3.xꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔꯁꯤꯡ ꯑꯁꯤ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯔꯤꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔꯁꯤꯡꯅꯤ ꯄ꯭ꯂꯥꯁ v3.xꯗꯥ ꯁꯦꯛꯌꯨꯔꯤꯇꯤ ꯐꯤꯛꯁ ꯈꯔꯥ ꯂꯩꯕꯅꯥ ꯅꯍꯥꯀꯄꯨ ꯚꯔꯁꯟ 3.x ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯄꯥꯎꯇꯥꯛ ꯄꯤꯔꯤ꯫
  • .form-control-labelꯁꯤꯖꯤꯟꯅꯗꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤ ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ, ꯃꯁꯤ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯐꯣꯔꯝ ꯂꯦꯑꯥꯎꯇꯁꯤꯡꯗꯥ ꯃꯁꯤꯒꯥ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯏꯅꯄꯨꯠꯀꯥ ꯂꯣꯌꯅꯅꯥ .col-form-labelꯚꯔꯇꯤꯀꯦꯜ ꯑꯣꯏꯅꯥ ꯁꯦꯟꯇꯔ ꯇꯧꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨꯒꯤ ꯗꯨꯞꯂꯤꯀꯦꯠ ꯑꯣꯏꯈꯤ꯫<label>
  • color-yiqꯄ꯭ꯔꯣꯄꯔꯇꯤ ꯌꯥꯑꯣꯕꯥ ꯃꯤꯛꯁꯤꯟ ꯑꯃꯗꯒꯤ ꯚꯦꯜꯌꯨ ꯑꯃꯥ ꯔꯤꯇꯔꯟ ꯇꯧꯕꯥ ꯐꯉ꯭ꯀꯁꯟ ꯑꯃꯗꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ color, ꯃꯁꯤꯅꯥ ꯅꯍꯥꯀꯄꯨ CSS ꯄ꯭ꯔꯣꯄꯔꯇꯤ ꯑꯃꯍꯦꯛꯇꯒꯤꯗꯃꯛ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯍꯜꯂꯤ. ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ , ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ color-yiq(#000), ꯅꯍꯥꯛꯅꯥ ꯏꯒꯅꯤ color: color-yiq(#000);.

ꯃꯔꯨꯑꯣꯏꯕꯥ ꯋꯥꯐꯃꯁꯤꯡ꯫

  • ꯃꯣꯗꯦꯂꯁꯤꯡꯗꯥ ꯑꯅꯧꯕꯥ pointer-eventsꯁꯤꯖꯤꯟꯅꯕꯥ ꯍꯧꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯃꯄꯥꯅꯒꯤ ꯑꯁꯤꯅꯥ ꯀꯁ꯭ꯇꯝ ꯀ꯭ꯂꯤꯛ ꯍꯦꯟꯗꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ( ꯀ꯭ꯂꯤꯛ ꯑꯃꯍꯦꯛꯇꯒꯤꯗꯃꯛ ꯁꯨꯞꯅꯇꯒꯤ ꯇꯥꯕꯥ ꯌꯥꯍꯅꯕꯥ ) .modal-dialogꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯏꯚꯦꯟꯇꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯄꯥꯁ ꯇꯧꯏ , ꯑꯃꯁꯨꯡ ꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯇꯁꯦꯡꯕꯥ ꯑꯗꯨꯒꯤꯗꯃꯛ ꯀꯥꯎꯟꯇꯔꯑꯦꯛꯇ ꯇꯧꯏ .pointer-events: none.modal-backdrop.modal-contentpointer-events: auto

ꯁꯝꯂꯞꯄ ꯋꯥꯔꯣꯜ

v3 ꯗꯒꯤ v4 ꯗꯥ ꯆꯪꯂꯀꯄꯥ ꯃꯇꯃꯗꯥ ꯅꯍꯥꯛꯅꯥ ꯈꯪꯖꯤꯅꯕꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯑꯆꯧꯕꯥ ꯇꯤꯀꯦꯠ ꯑꯥꯏꯇꯦꯃꯁꯤꯡ ꯑꯁꯤ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤ꯫

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

  • ꯑꯥꯏ.ꯏ.꯸, ꯑꯥꯏ.ꯏ.꯹, ꯑꯃꯁꯨꯡ ꯑꯥꯏ.ꯑꯣ.ꯑꯦꯁ.꯶ ꯁꯄꯣꯔꯠ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫ v4 ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ IE10+ ꯑꯃꯁꯨꯡ iOS 7+ ꯈꯛꯇꯅꯤ꯫ ꯃꯈꯣꯌꯁꯤꯡ ꯑꯗꯨꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯑꯃꯒꯤ ꯃꯊꯧ ꯇꯥꯕꯥ ꯁꯥꯏꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, v3 ꯁꯤꯖꯤꯟꯅꯧ꯫
  • ꯑꯦꯟꯗ꯭ꯔꯣꯏꯗ v5.0 ꯂꯣꯂꯤꯄꯄꯀꯤ ꯕ꯭ꯔꯥꯎꯖꯔ ꯑꯃꯁꯨꯡ ꯋꯦꯕꯚꯤꯎꯒꯤꯗꯃꯛ ꯑꯣꯐꯤꯁꯤꯑꯦꯜ ꯁꯄꯣꯔꯠ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫ ꯑꯦꯟꯗ꯭ꯔꯣꯏꯗ ꯕ꯭ꯔꯥꯎꯖꯔ ꯑꯃꯁꯨꯡ ꯋꯦꯕꯚꯤꯎꯒꯤ ꯍꯥꯟꯅꯒꯤ ꯚꯔꯖꯅꯁꯤꯡ ꯑꯁꯤ ꯑꯅꯑꯣꯐꯤꯁꯤꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯈꯛꯇꯗꯥ ꯂꯩꯔꯤ꯫

ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥ ꯑꯍꯣꯡꯕꯁꯤꯡ꯫

  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯑꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯏꯅꯦꯕꯜ ꯇꯧꯏ꯫ ꯃꯍꯧꯁꯥꯅꯥ ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯐ꯭ꯂꯣꯠꯁꯤꯡꯗꯒꯤ ꯂꯥꯞꯅꯥ ꯂꯩꯕꯥ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯆꯠꯄꯥ ꯍꯥꯌꯕꯅꯤ꯫
  • ꯑꯩꯈꯣꯌꯒꯤ ꯁꯣꯔꯁ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯐꯥꯏꯂꯁꯤꯡꯒꯤꯗꯃꯛ ꯂꯦꯁꯇꯒꯤ ꯁꯥꯁꯇꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • pxꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯌꯨꯅꯤꯠ ꯑꯣꯏꯅꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ rem, ꯗꯤꯚꯥꯏꯁ ꯚꯤꯎꯄꯣꯔꯇꯁꯤꯡꯗꯥ ꯇꯥꯏꯞ ꯁꯥꯏꯖꯅꯥ ꯑꯀꯥꯌꯕꯥ ꯄꯤꯗꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯒ꯭ꯔꯤꯗ ꯕꯤꯍꯦꯕꯤꯌꯔꯒꯤꯗꯃꯛꯇꯥ ꯄꯤꯛꯁꯦꯂꯁꯤꯡ ꯍꯧꯖꯤꯀꯁꯨ ꯁꯤꯖꯤꯟꯅꯔꯤ꯫
  • ꯃꯥꯂꯦꯃꯒꯤ ꯐꯣꯟꯇ-ꯁꯥꯏꯖ 14pxꯑꯁꯤꯗꯒꯤ 16pxꯍꯦꯅꯒꯠꯂꯀꯈꯤ꯫
  • ꯃꯉꯥꯁꯨꯕꯥ ꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ ꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔꯁꯤꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯗꯣꯀꯈꯤ (ꯑꯆꯧꯕꯥ ꯗꯤꯚꯥꯏꯁꯁꯤꯡꯗꯥ 576pxꯑꯃꯁꯨꯡ ꯃꯈꯥꯗꯥ ꯑꯦꯗ꯭ꯔꯦꯁ ꯇꯧꯕꯥ) ꯑꯃꯁꯨꯡ -xsꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯗꯨꯗꯒꯤ ꯏꯅꯐꯤꯛꯁ ꯑꯗꯨ ꯂꯧꯊꯣꯀꯈꯤ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ: .col-6.col-sm-4.col-md-3.
  • SCSS ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯀꯅꯐꯤꯒꯔ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯇꯣꯉꯥꯅꯕꯥ ꯑꯣꯄꯁꯅꯦꯜ ꯊꯤꯝ ꯑꯗꯨ ꯃꯍꯨꯠ ꯁꯤꯅꯈ꯭ꯔꯦ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, $enable-gradients: true).
  • ꯒ꯭ꯔꯨꯟꯇꯀꯤ ꯃꯍꯨꯠꯇꯥ npm ꯁ꯭ꯛꯔꯤꯞꯇꯁꯤꯡꯒꯤ ꯁꯤꯔꯤꯖ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯣꯚꯔꯍꯣꯜ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯁ꯭ꯛꯔꯤꯞꯇ ꯄꯨꯝꯅꯃꯛꯀꯤꯗꯃꯛ ꯌꯦꯡꯕꯤꯌꯨ package.json, ꯅꯠꯔꯒꯥ ꯂꯣꯀꯦꯜ ꯗꯤꯕꯦꯂꯄꯃꯦꯟꯇꯀꯤ ꯃꯊꯧ ꯇꯥꯕꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯔꯤꯗꯃꯤ꯫
  • ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯅꯟ-ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯑꯁꯤ ꯃꯈꯥ ꯇꯥꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯗ꯭ꯔꯦ꯫
  • ꯍꯦꯟꯅꯥ ꯄꯥꯛ-ꯆꯥꯎꯕꯥ ꯁꯦꯇꯑꯞ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯦꯁꯟ ꯑꯃꯁꯨꯡ ꯀꯁ꯭ꯇꯃꯁ ꯑꯣꯏꯕꯥ ꯕꯤꯜꯗꯁꯤꯡꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯗꯨꯅꯥ ꯑꯣꯅꯂꯥꯏꯟ ꯀꯁ꯭ꯇꯃꯔꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫
  • ꯀꯃꯟ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯄ꯭ꯔꯣꯄꯔꯇꯤ-ꯚꯦꯜꯌꯨ ꯄꯦꯌꯔꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯥꯔꯖꯤꯟ/ꯄꯦꯗꯤꯡ ꯁ꯭ꯄꯦꯁꯤꯡ ꯁꯣꯔꯇꯀꯥꯠꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯅꯧꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁ ꯗꯖꯟ ꯀꯌꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ꯫

  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯇꯥ ꯆꯠꯈꯤ꯫
    • ꯒ꯭ꯔꯤꯗ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯄ꯭ꯔꯤꯗꯤꯐꯥꯏꯗ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯗꯥ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯤꯗꯃꯛ ꯁꯄꯣꯔꯠ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫
    • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯤ ꯁꯔꯨꯛ ꯑꯃꯥ ꯑꯣꯏꯅꯥ, ꯚꯔꯇꯤꯀꯦꯜ ꯑꯃꯁꯨꯡ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯑꯦꯂꯥꯏꯟꯃꯦꯟꯇ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ ꯁꯄꯣꯔꯠ ꯌꯥꯑꯣꯈꯤ꯫
  • ꯒ꯭ꯔꯤꯗ ꯀ꯭ꯂꯥꯁꯀꯤ ꯃꯃꯤꯡꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯅꯧꯕꯥ ꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔ ꯑꯃꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫
    • ꯍꯦꯟꯅꯥ ꯒ꯭ꯔꯦꯅꯨꯂꯔ ꯀꯟꯠꯔꯣꯂꯒꯤꯗꯃꯛ ꯃꯈꯥꯗꯥ ꯑꯅꯧꯕꯥ smꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫ 768pxꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯛ xs, sm, md, lg, ꯑꯃꯁꯨꯡ xl. ꯃꯁꯤꯅꯥ ꯇꯥꯀꯄꯗꯤ ꯇꯌꯥꯔ ꯈꯨꯗꯤꯡꯃꯛ ꯂꯦꯚꯦꯜ ꯑꯃꯗꯥ ꯕꯝꯄ ꯇꯧꯔꯦ ꯍꯥꯌꯕꯁꯨ ꯇꯥꯀꯏ (ꯃꯔꯝ ꯑꯗꯨꯅꯥ .col-md-6v3ꯗꯥ ꯍꯧꯖꯤꯛ .col-lg-6v4ꯗꯥ ꯂꯩꯔꯦ)꯫
    • xsmin-width: 0ꯒ꯭ꯔꯤꯗ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯏꯅꯐꯤꯛꯁ ꯑꯁꯤꯅꯥ ꯃꯈꯣꯌꯅꯥ ꯁꯦꯠ ꯇꯧꯔꯕꯥ ꯄꯤꯛꯁꯦꯜ ꯚꯦꯜꯌꯨ ꯑꯃꯗꯥ ꯅꯠꯇꯅꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯍꯧꯔꯦ ꯍꯥꯌꯕꯥ ꯍꯦꯟꯅꯥ ꯑꯆꯨꯝꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯔꯤꯞꯔꯖꯦꯟꯇ ꯇꯧꯕꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯅꯕꯥ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ .col-xs-6, ꯃꯁꯤ ꯍꯧꯖꯤꯛ .col-6. ꯑꯇꯣꯞꯄꯥ ꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔ ꯄꯨꯝꯅꯃꯛ ꯏꯅꯐꯤꯛꯁ ꯃꯊꯧ ꯇꯥꯏ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, sm).
  • ꯒ꯭ꯔꯤꯗ ꯁꯥꯏꯖꯁꯤꯡ, ꯃꯤꯛꯁꯤꯅꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯑꯄꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫
    • ꯒ꯭ꯔꯤꯗ ꯒꯇꯔꯁꯤꯡꯗꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯁꯥꯁ ꯃꯦꯞ ꯑꯃꯥ ꯂꯩꯔꯦ ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ ꯑꯀꯛꯅꯕꯥ ꯒꯇꯔꯒꯤ ꯄꯥꯛ ꯆꯥꯎꯕꯥꯁꯤꯡ ꯂꯦꯄꯊꯣꯀꯄꯥ ꯌꯥꯒꯅꯤ꯫
    • make-col-readyꯄ꯭ꯔꯦꯞ ꯃꯤꯛꯁꯤꯟ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯒ꯭ꯔꯤꯗ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯄꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯀꯣꯂꯝ ꯁꯥꯏꯖ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯑꯃꯁꯨꯡ make-colꯁꯦꯠ ꯇꯧꯅꯕꯥ ꯑꯃꯥ꯫flexmax-width
    • 12ꯑꯅꯧꯕꯥ ꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔꯒꯤ ꯑꯦꯀꯥꯎꯟꯇ ꯇꯧꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯀꯂꯃꯁꯤꯡ ꯑꯁꯤ ꯃꯈꯣꯌꯒꯤ ꯃꯦꯛꯁ ꯋꯥꯏꯗꯇꯥ ꯆꯞ ꯃꯥꯟꯅꯅꯥ ꯈꯥꯌꯗꯣꯀꯄꯥ ꯉꯝꯅꯕꯥ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯀꯟꯇꯦꯅꯔꯒꯤ ꯄꯥꯛ ꯆꯥꯎꯕꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫
    • ꯒ꯭ꯔꯤꯗ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯀꯟꯇꯦꯅꯔꯒꯤ ꯄꯥꯛ ꯆꯥꯎꯕꯥ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯇꯣꯉꯥꯅꯕꯥ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯈꯔꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯁꯥꯁ ꯃꯦꯞ ( $grid-breakpointsꯑꯃꯁꯨꯡ )ꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯍꯦꯟꯗꯜ ꯇꯧꯔꯦ꯫ $container-max-widthsꯃꯁꯤꯅꯥ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯜꯂꯤ @screen-*ꯑꯃꯁꯨꯡ ꯅꯍꯥꯀꯄꯨ ꯒ꯭ꯔꯤꯗ ꯇꯌꯥꯔꯁꯤꯡ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯀꯁ꯭ꯇꯃꯁ ꯇꯧꯕꯥ ꯌꯥꯍꯜꯂꯤ꯫
    • ꯃꯤꯗꯤꯌꯥꯒꯤ ꯋꯥꯍꯪꯁꯤꯡꯁꯨ ꯍꯣꯡꯂꯦ꯫ ꯃꯇꯝ ꯈꯨꯗꯤꯡꯗꯥ ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯚꯦꯜꯌꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤ ꯗꯤꯛꯂꯥꯔꯦꯁꯅꯁꯤꯡ ꯍꯟꯖꯤꯟ ꯍꯟꯖꯤꯟ ꯇꯧꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯍꯧꯖꯤꯛ ꯑꯩꯈꯣꯌꯅꯥ @include media-breakpoint-up/down/only. ꯍꯧꯖꯤꯛꯇꯤ ꯏꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯏꯕꯥ @media (min-width: @screen-sm-min) { ... }ꯌꯥꯔꯦ @include media-breakpoint-up(sm) { ... }.

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

  • ꯑꯅꯧꯕꯥ ꯄꯨꯝꯅꯃꯛ ꯌꯥꯑꯣꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯥ , ꯀꯥꯔꯗꯁꯤꯡ .
  • ꯒ꯭ꯂꯥꯏꯐꯤꯀꯅꯁꯤꯡꯒꯤ ꯑꯥꯏꯀꯟ ꯐꯣꯟꯇ ꯑꯗꯨ ꯊꯥꯗꯣꯀꯈꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯥꯏꯀꯅꯁꯤꯡ ꯃꯊꯧ ꯇꯥꯔꯕꯗꯤ, ꯑꯣꯄꯁꯟ ꯈꯔꯗꯤ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤꯡꯁꯤꯅꯤ:
  • ꯑꯦꯐꯤꯛꯁ jQuery ꯄ꯭ꯂꯒꯏꯟ ꯑꯗꯨ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
    • position: stickyꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯇꯀꯁꯤꯜꯂꯤ꯫ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯀꯛꯅꯕꯥ ꯄꯣꯂꯤꯐꯤꯜ ꯔꯤꯀꯃꯦꯟꯗꯦꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ HTML5 ꯆꯥꯅꯕꯤꯗꯨꯅꯥ ꯑꯦꯟꯠꯔꯤ ꯑꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ . ꯁꯖꯦꯁꯟ ꯑꯃꯗꯤ @supportsꯃꯁꯤꯕꯨ ꯏꯃꯞꯂꯤꯃꯦꯟꯇ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯔꯨꯜ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯕꯅꯤ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, @supports (position: sticky) { ... })/
    • ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯍꯦꯅꯕꯥ, ꯅꯟ- positionꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯅꯕꯥ ꯑꯦꯐꯤꯛꯁ ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ, ꯄꯣꯂꯤꯐꯤꯂꯁꯤꯡꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯌꯨꯖꯔ ꯀꯦꯁ ꯑꯗꯨ ꯁꯄꯣꯔꯠ ꯇꯧꯗꯕꯥ ꯌꯥꯏ꯫ ꯑꯁꯤꯒꯨꯝꯕꯥ ꯁꯤꯖꯤꯟꯅꯐꯃꯁꯤꯡꯒꯤ ꯑꯣꯄꯁꯟ ꯑꯃꯗꯤ ꯊꯥꯔꯗ ꯄꯥꯔꯇꯤ ꯁ꯭ꯛꯔꯣꯂꯄꯣꯁ-ꯁ꯭ꯇꯥꯏꯂꯔ ꯂꯥꯏꯕ꯭ꯔꯦꯔꯤ ꯑꯁꯤꯅꯤ꯫
  • ꯇꯉꯥꯏ ꯐꯗꯅꯥ ꯈꯔꯥ ꯀꯁ꯭ꯇꯃꯁ ꯑꯣꯏꯕꯥ ꯕꯇꯅꯁꯤꯡ ꯑꯣꯏꯕꯅꯥ ꯄꯦꯖꯔ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯁꯤ ꯊꯥꯗꯣꯀꯈꯤ꯫
  • ꯑꯣꯚꯔ-ꯁ꯭ꯄꯦꯁꯤꯐꯤꯛ ꯑꯣꯏꯕꯥ ꯑꯉꯥꯡꯁꯤꯡꯒꯤ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯍꯦꯟꯅꯥ ꯑꯟ-ꯅꯦꯁ꯭ꯇꯦꯗ ꯀ꯭ꯂꯥꯁ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯆꯥꯎꯔꯥꯛꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯔꯤꯐꯦꯛꯇ ꯇꯧꯈꯤ꯫

ꯀꯝꯄꯣꯅꯦꯟꯇꯀꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ꯫

ꯂꯤꯁ꯭ꯠ ꯑꯁꯤꯅꯥ v3.xx ꯑꯃꯁꯨꯡ v4.0.0ꯒꯤ ꯃꯔꯛꯇꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯑꯍꯣꯡꯕꯁꯤꯡ ꯑꯗꯨ ꯐꯣꯡꯗꯣꯛꯂꯤ꯫

ꯔꯤꯕꯨꯠ ꯇꯧꯕꯥ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯴ꯗꯥ ꯑꯅꯧꯕꯥ ꯑꯁꯤ ꯔꯤꯕꯨꯠ , ꯑꯩꯈꯣꯌꯒꯤ ꯏꯁꯥꯒꯤ ꯈꯔꯥ ꯋꯥꯈꯜꯂꯣꯟ ꯂꯩꯕꯥ ꯔꯤꯁꯦꯠ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯅꯣꯔꯃꯦꯂꯥꯏꯖ ꯇꯧꯕꯗꯥ ꯁꯦꯃꯒꯠꯄꯥ ꯑꯅꯧꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯠ ꯑꯃꯅꯤ꯫ ꯐꯥꯏꯜ ꯑꯁꯤꯗꯥ ꯌꯥꯑꯣꯔꯤꯕꯥ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯈꯛꯇꯃꯛ ꯁꯤꯖꯤꯟꯅꯩ—ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯠꯇꯥ ꯂꯩꯇꯦ꯫ ꯃꯁꯤꯅꯥ ꯍꯦꯟꯅꯥ ꯃꯣꯗ꯭ꯌꯨꯂꯔ ꯑꯣꯏꯕꯥ ꯑꯦꯞꯔꯣꯆ ꯑꯃꯒꯤꯗꯃꯛ ꯑꯩꯈꯣꯌꯒꯤ ꯔꯤꯁꯦꯠ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡꯗꯒꯤ ꯑꯥꯏꯁꯣꯂꯦꯠ ꯇꯧꯏ꯫ ꯃꯁꯤꯗꯥ ꯌꯥꯑꯣꯔꯤꯕꯥ ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯔꯤꯁꯦꯠ ꯈꯔꯗꯤ box-sizing: border-boxꯑꯍꯣꯡꯕꯥ, ꯑꯦꯂꯤꯃꯦꯟꯇ ꯀꯌꯥꯗꯥ ꯌꯨꯅꯤꯠꯇꯒꯤ ꯆꯠꯄꯥ em, remꯂꯤꯉ꯭ꯛ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯐꯣꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯔꯤꯁꯦꯠ ꯀꯌꯥꯅꯤ꯫

ꯇꯥꯏꯄꯣꯒ꯭ꯔꯥꯐꯤ ꯇꯧꯕꯥ꯫

  • .text-ꯌꯨꯇꯤꯂꯤꯇꯤ ꯄꯨꯝꯅꯃꯛ _utilities.scssꯐꯥꯏꯂꯗꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯃꯁꯤꯒꯤ ꯃꯑꯣꯡꯁꯤꯡ .page-headerꯑꯁꯤ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯌꯥꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫
  • .dl-horizontalꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ, ꯃꯁꯤꯒꯤ ꯑꯃꯁꯨꯡ ꯑꯉꯥꯡꯁꯤꯡꯗꯥ ꯒ꯭ꯔꯤꯗ ꯀꯣꯂꯝ ꯀ꯭ꯂꯥꯁꯁꯤꯡ (ꯅꯠꯠꯔꯒꯥ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ) ꯁꯤꯖꯤꯟꯅꯧ ꯑꯃꯁꯨꯡ .rowꯁꯤꯖꯤꯟꯅꯧ꯫<dl><dt><dd>
  • <blockquote>ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯒꯤ ꯀ꯭ꯂꯥꯁ ꯑꯃꯈꯛꯇꯗꯥ ꯃꯈꯣꯌꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯂꯧꯊꯣꯀꯄꯥ , .blockquote. .blockquote-reverseꯇꯦꯛꯁꯠ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤꯗꯃꯛ ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯑꯗꯨ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • .list-inlineꯍꯧꯖꯤꯛꯇꯤ ꯃꯁꯤꯒꯤ ꯑꯉꯥꯡꯁꯤꯡꯅꯥ ꯂꯤꯁ꯭ꯠ ꯇꯧꯕꯥ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯗꯥ ꯑꯅꯧꯕꯥ .list-inline-itemꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯃꯈꯣꯌꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯃꯊꯧ ꯇꯥꯏ꯫

ꯏꯃꯦꯖꯁꯤꯡ꯫

  • .img-responsiveꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .img-fluid.
  • .img-roundedꯍꯥꯌꯅꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯃꯃꯤꯡ ꯊꯣꯅꯈꯤ꯫.rounded
  • .img-circleꯍꯥꯌꯅꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯃꯃꯤꯡ ꯊꯣꯅꯈꯤ꯫.rounded-circle

ꯇꯦꯕꯂꯁꯤꯡ꯫

  • ꯁꯦꯂꯦꯛꯇꯔꯒꯤ ꯆꯥꯎꯔꯥꯛꯅꯥ ꯏꯟꯁꯇꯦꯟꯁ ꯄꯨꯝꯅꯃꯛ >ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ, ꯃꯁꯤꯅꯥ ꯇꯥꯀꯄꯗꯤ ꯅꯦꯁ꯭ꯠ ꯇꯧꯔꯕꯥ ꯇꯦꯕꯂꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯃꯈꯣꯌꯒꯤ ꯃꯃꯥ-ꯃꯄꯥꯁꯤꯡꯗꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯒꯅꯤ꯫ ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯄꯣꯇꯦꯟꯁꯤꯌꯦꯜ ꯀꯁ꯭ꯇꯃꯔꯁꯤꯡꯅꯥ ꯌꯥꯝꯅꯥ ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯤ꯫
  • ꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯁꯤꯒꯤꯗꯃꯛꯇꯥ ꯃꯃꯤꯡ .table-condensedꯍꯣꯡꯗꯣꯀꯈꯤ꯫.table-sm
  • ꯑꯅꯧꯕꯥ .table-inverseꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫
  • ꯇꯦꯕꯜ ꯍꯦꯗ ꯃꯣꯗꯤꯐꯥꯏꯌꯔꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ: .thead-defaultꯑꯃꯁꯨꯡ .thead-inverse.
  • .table--ꯄ꯭ꯔꯤꯐꯤꯛꯁ ꯑꯃꯥ ꯂꯩꯅꯕꯥ ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫ ꯃꯔꯝ ꯑꯁꯤꯅꯥ .active, .success, .warning, .dangerꯑꯃꯁꯨꯡ .infoꯇꯨ .table-active, .table-success, .table-warning, .table-dangerꯑꯃꯁꯨꯡ .table-info.

ꯐꯣꯔꯃꯁꯤꯡ꯫

  • _reboot.scssꯂꯧꯊꯣꯀꯈꯤꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯐꯥꯏꯂꯗꯥ ꯔꯤꯁꯦꯠ ꯇꯧꯏ꯫
  • .control-labelꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .col-form-label.
  • ꯃꯊꯪꯁꯤꯠꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .input-lgꯑꯃꯁꯨꯡ .input-smꯇꯨ .form-control-lgꯑꯃꯁꯨꯡ ..form-control-sm
  • ꯂꯥꯏꯕꯛ ꯐꯕꯒꯤꯗꯃꯛ .form-group-*ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯊꯥꯗꯣꯀꯈꯤ꯫ .form-control-*ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯍꯧꯖꯤꯛ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫
  • ꯊꯨꯒꯥꯏꯈ꯭ꯔꯦ .help-blockꯑꯃꯁꯨꯡ ꯃꯁꯤꯕꯨ .form-textꯕ꯭ꯂꯣꯛ-ꯂꯦꯚꯦꯜ ꯍꯦꯜꯄ ꯇꯦꯛꯁꯀꯤꯗꯃꯛ ꯃꯍꯨꯠ ꯁꯤꯅꯈ꯭ꯔꯦ꯫ ꯏꯅꯂꯥꯏꯟ ꯍꯦꯜꯄ ꯇꯦꯛꯁꯠ ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛ, .text-muted.
  • ꯊꯥꯗꯣꯀꯈꯤ .radio-inlineꯑꯃꯁꯨꯡ .checkbox-inline.
  • ꯀꯟꯁꯣꯂꯤꯗꯦꯇꯦꯗ .checkboxꯑꯃꯁꯨꯡ .radioꯏꯟ .form-checkꯑꯃꯁꯨꯡ ꯇꯣꯉꯥꯟ ꯇꯣꯉꯥꯅꯕꯥ .form-check-*ꯀ꯭ꯂꯥꯁꯁꯤꯡ꯫
  • ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯑꯣꯏꯕꯥ ꯃꯑꯣꯡꯁꯤꯡ ꯑꯣꯚꯔꯍꯣꯜ ꯇꯧꯕꯥ:
    • ꯀ꯭ꯂꯥꯁꯀꯤ .form-horizontalꯃꯊꯧ ꯇꯥꯕꯥ ꯑꯗꯨ ꯂꯧꯊꯣꯀꯈꯤ꯫
    • .form-group.rowꯚꯤꯌꯥ ꯃꯤꯛꯁꯤꯅꯗꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯗ꯭ꯔꯦ , ꯃꯔꯝ .rowꯑꯗꯨꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯒ꯭ꯔꯤꯗ ꯂꯦꯑꯥꯎꯇꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯃꯊꯧ ꯇꯥꯏ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, <div class="form-group row">).
    • ꯑꯦꯁ.ꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯚꯔꯇꯤꯀꯦꯜ ꯁꯦꯟꯇꯔ ꯂꯦꯕꯦꯂꯁꯤꯡꯗꯥ ꯑꯅꯧꯕꯥ .col-form-labelꯀ꯭ꯂꯥꯁ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫.form-control
    • .form-rowꯒ꯭ꯔꯤꯗ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯦꯛꯇ ꯐꯣꯔꯝ ꯂꯦꯑꯥꯎꯇꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯅꯧꯕꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ (ꯑꯗꯣꯃꯒꯤ .rowꯐꯣꯔ ꯑꯦ .form-rowꯑꯃꯁꯨꯡ ꯒꯣꯗꯥ ꯁꯣꯞ ꯇꯧꯕꯤꯌꯨ)꯫
  • ꯀꯁ꯭ꯇꯝ ꯐꯣꯔꯃꯁꯤꯡ ꯁꯄꯣꯔꯠ ꯍꯥꯄꯆꯤꯜꯂꯦ (ꯆꯦꯀꯕꯣꯛꯁꯁꯤꯡ, ꯔꯦꯗꯤꯑꯣꯁꯤꯡ, ꯁꯦꯂꯦꯛꯇꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯐꯥꯏꯜ ꯏꯅꯄꯨꯠꯁꯤꯡꯒꯤꯗꯃꯛ)꯫
  • .has-error, .has-warning, ꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯁ꯭ꯌꯨꯗꯣ-ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ .has-successꯈꯨꯠꯊꯥꯡꯗꯥ HTML5 ꯐꯣꯔꯝ ꯚꯦꯂꯤꯗꯦꯁꯅꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯜꯂꯦ꯫:invalid:valid
  • .form-control-staticꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .form-control-plaintext.

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

  • .btn-defaultꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .btn-secondary.
  • v3'ꯁꯤꯡꯗꯒꯤ ꯄ꯭ꯔꯣꯄꯣꯔꯆꯨꯅꯦꯜ ꯑꯣꯏꯅꯥ ꯌꯥꯝꯅꯥ ꯄꯤꯀꯄꯥ .btn-xsꯑꯣꯏꯅꯥ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫.btn-sm
  • jQuery ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯁ꯭ꯇꯦꯇꯐꯨꯜ ꯕꯇꯟ ꯐꯤꯆꯔ ꯑꯗꯨ button.jsꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫ ꯃꯁꯤꯗꯥ $().button(string)ꯑꯃꯁꯨꯡ $().button('reset')ꯃꯦꯊꯗꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀꯁ꯭ꯇꯝ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯑꯄꯤꯀꯄꯥ ꯁꯔꯨꯛ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯄꯥꯎꯇꯥꯛ ꯄꯤꯔꯤ, ꯃꯁꯤꯅꯥ ꯑꯗꯣꯝꯅꯥ ꯄꯥꯝꯂꯤꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯇꯁꯦꯡꯅꯥ ꯂꯃꯆꯠ ꯁꯥꯖꯠ ꯆꯠꯄꯒꯤ ꯀꯥꯟꯅꯕꯥ ꯐꯪꯒꯅꯤ꯫
    • ꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯑꯇꯣꯞꯄꯥ ꯐꯤꯆꯔꯁꯤꯡ (ꯕꯇꯟ ꯆꯦꯀꯕꯣꯛꯁꯁꯤꯡ, ꯕꯇꯟ ꯔꯦꯗꯤꯑꯣꯁꯤꯡ, ꯁꯤꯉ꯭ꯒꯜ-ꯇꯣꯒꯜ ꯕꯇꯅꯁꯤꯡ) ꯑꯁꯤ v4ꯗꯥ ꯊꯃꯈ꯭ꯔꯦ ꯍꯥꯌꯕꯥ ꯈꯉꯖꯤꯅꯕꯤꯌꯨ꯫
  • IE9+ꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯔꯤꯕꯥ ꯃꯇꯨꯡ ꯏꯟꯅꯥ [disabled]ꯕꯇꯅꯁꯤꯡ ’ ꯍꯣꯡꯗꯣꯀꯎ . ꯑꯗꯨꯝ ꯑꯣꯏꯅꯃꯛ ꯍꯧꯖꯤꯀꯁꯨ ꯃꯊꯧ ꯇꯥꯏ ꯃꯔꯃꯗꯤ ꯅꯦꯇꯤꯕ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯕꯥ ꯐꯤꯜꯗꯁꯦꯠꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯀꯁꯨ ꯑꯥꯏ.ꯏ.꯱꯱ꯗꯥ ꯕꯥꯒ ꯇꯧꯔꯤ .:disabled:disabledfieldset[disabled]

ꯕꯇꯟ ꯒ꯭ꯔꯨꯞ꯫

  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫
  • ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ .btn-group-justified. <div class="btn-group d-flex" role="group"></div>ꯃꯍꯨꯠ ꯁꯤꯅꯕꯥ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯅꯍꯥꯛꯅꯥ .w-100.
  • .btn-group-xsꯀ꯭ꯂꯥꯁ ꯑꯁꯤ ꯃꯄꯨ��� ꯐꯥꯅꯥ ꯊꯥꯗꯣꯀꯈꯤꯕꯥ ꯔꯤꯃꯨꯚꯜ ꯄꯤꯗꯨꯅꯥ .btn-xs.
  • ꯕꯇꯟ ꯇꯨꯂꯕꯥꯔꯁꯤꯡꯗꯥ ꯕꯇꯟ ꯀꯥꯡꯂꯨꯄꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯂꯩꯕꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯁ꯭ꯄꯦꯁꯤꯡ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ; ꯍꯧꯖꯤꯛ ꯃꯥꯔꯖꯤꯟ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫
  • ꯑꯇꯣꯞꯄꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯗꯣꯀꯨꯃꯦꯟꯇꯁꯤꯡ ꯐꯒꯠꯍꯅꯕꯥ꯫
  • ꯀꯝꯄꯣꯅꯦꯟꯇ ꯄꯨꯝꯅꯃꯛꯀꯤ ꯑꯣꯏꯅꯥ ꯄꯦꯔꯦꯟꯇ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡꯗꯒꯤ ꯁꯤꯉ꯭ꯒꯨꯂꯥꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯗꯥ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ, ꯃꯣꯗꯤꯐꯥꯏꯌꯔꯁꯤꯡ ꯑꯁꯤꯅꯆꯤꯡꯕꯥ꯫
  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯃꯦꯅꯨꯗꯥ ꯑꯦꯇꯦꯆ ꯇꯧꯕꯥ ꯃꯊꯛꯇꯥ ꯅꯠꯠꯔꯒꯥ ꯃꯈꯥꯗꯥ ꯂꯩꯕꯥ ꯑꯦꯔꯣꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯁꯤꯞ ꯇꯧꯗꯅꯕꯥ ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯕꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ꯫
  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛ <div>s ꯅꯠꯔꯒꯥ <ul>s ꯒꯤ ꯃꯇꯦꯡꯅꯥ ꯁꯦꯝꯕꯥ ꯌꯥꯔꯦ꯫
  • <a>ꯑꯃꯁꯨꯡ <button>ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤꯗꯃꯛ ꯐꯖꯅꯥ, ꯁꯦꯃꯒꯠꯂꯕꯥ ꯁꯄꯣꯔꯠ ꯄꯤꯅꯕꯥ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯥꯔꯀꯑꯥꯞ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯒꯠꯄꯥ꯫
  • .dividerꯍꯥꯌꯅꯥ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈꯤ .dropdown-divider.
  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯑꯥꯏꯇꯦꯃꯁꯤꯡ ꯍꯧꯖꯤꯛ .dropdown-item.
  • ꯗ꯭ꯔꯣꯄꯗꯥꯎꯟ ꯇꯣꯒꯂꯁꯤꯡꯗꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ <span class="caret"></span>; ꯃꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯄꯤꯔꯦ ::afterꯑꯣꯟ .dropdown-toggle.

ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ꯫

  • ꯑꯅꯧꯕꯥ 576pxꯒ꯭ꯔꯤꯗ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ ꯍꯥꯌꯅꯥ sm, ꯃꯁꯤꯅꯥ ꯇꯥꯀꯄꯗꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯑꯄꯨꯅꯕꯥ ꯇꯌꯥꯔ ꯃꯉꯥ ( xs, sm, md, lg, ꯑꯃꯁꯨꯡ xl) ꯂꯩꯔꯦ꯫
  • ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯒ꯭ꯔꯤꯗ ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ .col-{breakpoint}-{modifier}-{size}ꯍꯦꯟꯅꯥ .{modifier}-{breakpoint}-{size}ꯂꯥꯏꯕꯥ ꯒ꯭ꯔꯤꯗ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯇꯨꯗꯒꯤ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯑꯅꯧꯕꯥ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯅꯥ ꯃꯊꯧ ꯇꯧꯕꯥ orderꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯄꯨꯁ ꯑꯃꯁꯨꯡ ꯄꯨꯜ ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯊꯥꯗꯣꯀꯈꯤ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, .col-8.push-4ꯑꯃꯁꯨꯡ ꯒꯤ ꯃꯍꯨꯠꯇꯥ .col-4.pull-8, ꯅꯍꯥꯛꯅꯥ .col-8.order-2ꯑꯃꯁꯨꯡ .col-4.order-1.
  • ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯃꯁꯨꯡ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

ꯒ꯭ꯔꯨꯄꯁꯤꯡ ꯂꯤꯁ꯭ꯠ ꯇꯧꯕꯥ꯫

  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫
  • ꯂꯤꯁ꯭ꯠ ꯒ꯭ꯔꯨꯞ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯂꯤꯉ꯭ꯛ ꯑꯃꯁꯨꯡ ꯕꯇꯟ ꯚꯔꯖꯅꯁꯤꯡꯒꯤꯗꯃꯛ a.list-group-itemꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯜꯂꯤ, ,꯫.list-group-item-action
  • .list-group-flushꯀꯥꯔꯗꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫
  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫
  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯇꯥ ꯆꯪꯂꯀꯄꯥ ꯄꯤꯔꯕꯗꯤ, ꯑꯩꯈꯣꯌꯅꯥ ꯐ꯭ꯂꯣꯠꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯗ꯭ꯔꯤꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯍꯦꯗꯇꯥ ꯂꯩꯕꯥ ꯗꯤꯁꯃꯤꯁ ꯑꯥꯏꯀꯅꯁꯤꯡꯒꯤ ꯑꯦꯂꯥꯏꯟꯃꯦꯟꯇ ꯑꯁꯤ ꯁꯣꯀꯍꯜꯂꯀꯄꯥ ꯌꯥꯏ꯫ ꯐ꯭ꯂꯣꯇꯦꯗ ꯀꯟꯇꯦꯟꯇ ꯑꯁꯤ ꯑꯍꯥꯅꯕꯥ ꯑꯣꯏꯅꯥ ꯂꯥꯀꯏ, ꯑꯗꯨꯕꯨ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯗꯨ ꯍꯧꯖꯤꯛ ꯑꯣꯏꯗ꯭ꯔꯦ꯫ ꯐꯤꯛꯁ ꯇꯧꯅꯕꯥ ꯃꯣꯗꯦꯜ ꯇꯥꯏꯇꯂꯁꯤꯡꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯂꯥꯛꯅꯕꯥ ꯅꯍꯥꯛꯀꯤ ꯗꯤꯁꯃꯤꯁ ꯑꯥꯏꯀꯅꯁꯤꯡ ꯑꯄꯗꯦꯠ ꯇꯧ꯫
  • ꯑꯣꯄꯁꯟ ( remoteꯃꯁꯤꯅꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯃꯄꯥꯅꯒꯤ ꯀꯟꯇꯦꯟꯇ ꯂꯣꯗ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯃꯣꯗꯜ ꯑꯃꯗꯥ ꯏꯅꯖꯦꯛꯇ ꯇꯧꯕꯥ ꯌꯥꯕꯥ) ꯑꯃꯁꯨꯡ ꯃꯔꯤ ꯂꯩꯅꯕꯥ loaded.bs.modalꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯂꯧꯊꯣꯀꯈꯤ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀ꯭ꯂꯥꯏꯟꯇ-ꯁꯥꯏꯗ ꯇꯦꯃꯞꯂꯦꯇꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯗꯦꯇꯥ ꯕꯥꯏꯟꯗꯤꯡ ꯐ꯭ꯔꯦꯃꯋꯥꯔꯛ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ, ꯅꯠꯠꯔꯒꯥ ꯃꯁꯥꯅꯥ jQuery.load ꯀꯧꯅꯕꯥ ꯄꯥꯎꯇꯥꯛ ꯄꯤꯔꯤ꯫
  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫
  • >ꯑꯟ-ꯅꯦꯁ꯭ꯇꯦꯗ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯍꯦꯟꯅꯥ ꯂꯥꯏꯅꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯆꯥꯎꯔꯥꯛꯅꯥ ꯁꯦꯂꯦꯛꯇꯔ ꯄꯨꯝꯅꯃꯛ ꯊꯥꯗꯣꯀꯈꯤ꯫
  • HTML-ꯁ꯭ꯄꯦꯁꯤꯐꯤꯛ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡꯒꯤ ꯃꯍꯨꯠꯇꯥ , ꯑꯩꯈꯣꯌꯅꯥ s, s, ꯑꯃꯁꯨꯡ .nav > li > asꯒꯤꯗꯃꯛ ꯇꯣꯉꯥꯅꯕꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯩ꯫ ꯃꯁꯤꯅꯥ ꯅꯍꯥꯛꯀꯤ HTML ꯑꯗꯨ ꯍꯦꯟꯅꯥ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯑꯣꯏꯍꯜꯂꯤ ꯑꯗꯨꯒꯥ ꯍꯦꯟꯅꯥ ꯑꯦꯛꯁꯇꯦꯟꯁꯤꯕꯤꯂꯤꯇꯤ ꯄꯨꯔꯀꯏ꯫.nav.nav-item.nav-link

ꯅꯦꯚꯕꯥꯔ ꯑꯁꯤ ꯑꯦꯂꯥꯏꯟꯃꯦꯟꯇ, ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯅꯦꯁ, ꯑꯃꯁꯨꯡ ꯀꯁ꯭ꯇꯃꯔꯥꯏꯖꯦꯁꯅꯒꯤꯗꯃꯛꯇꯥ ꯑꯍꯣꯡꯕꯥ ꯁꯄꯣꯔꯇꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯇꯥ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯈ꯭ꯔꯦ꯫

  • ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯅꯦꯚꯕꯥꯔ ꯕꯤꯍꯦꯕꯤꯌꯔꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯅꯍꯥꯛꯅꯥ ꯅꯦꯚꯕꯥꯔ ꯑꯗꯨ ꯀꯗꯥꯏꯗꯥ ꯀꯣꯂꯥꯞꯁ ꯇꯧꯒꯗꯒꯦ ꯍꯥꯌꯅꯥ ꯈꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯕꯥ.navbar ꯃꯐꯝ ꯑꯗꯨꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯔꯦ꯫ ꯃꯃꯥꯡꯗꯥ ꯃꯁꯤ ꯂꯦꯁ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯃꯣꯗꯤꯐꯤꯀꯦꯁꯟ ꯑꯃꯥ ꯑꯣꯏꯔꯝꯃꯤ ꯑꯃꯁꯨꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯥ ꯃꯊꯧ ꯇꯥꯈꯤ꯫ .navbar-expand-{breakpoint}
  • .navbar-defaultis now .navbar-light, ꯑꯗꯨꯕꯨ .navbar-darkꯑꯗꯨꯃꯛ ꯂꯩꯔꯤ꯫ ꯃꯁꯤꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯑꯃꯗꯤ ꯅꯕꯕꯔ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ ꯃꯊꯧ ꯇꯥꯏ꯫ ꯑꯗꯨꯝ ꯑꯣꯏꯅꯃꯛ, ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤꯅꯥ background-colorꯑꯦꯁ. ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯃꯈꯣꯌꯅꯥ ꯇꯉꯥꯏ ꯐꯗꯅꯥ color.
  • ꯅꯕꯕꯔꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯃꯈꯜ ꯑꯃꯒꯤ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯗꯤꯛꯂꯥꯔꯦꯁꯟ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯏ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ( )ꯗꯒꯤ ꯈꯜꯂꯨ ꯅꯠꯠꯔꯒꯥ ꯃꯦꯗ ꯀꯁ꯭ꯇꯃꯔꯒꯤꯗꯃꯛ.bg-* ꯃꯊꯛꯇꯥ ꯄꯅꯈ꯭ꯔꯤꯕꯥ ꯂꯥꯏꯠ/ꯏꯅꯚꯥꯔꯁ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯑꯗꯣꯃꯒꯤ ꯑꯣꯏꯕꯥ ꯁꯦꯠ ꯇꯧꯕꯤꯌꯨ .
  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯄꯤꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ, ꯅꯦꯚꯕꯥꯔꯁꯤꯡꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯐꯖꯅꯥ ꯑꯦꯂꯥꯏꯟꯃꯦꯟꯇ ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯔꯦ꯫
  • .navbar-toggleꯑꯁꯤ ꯍꯧꯖꯤꯛ ꯑꯣꯏꯔꯦ .navbar-togglerꯑꯃꯁꯨꯡ ꯇꯣꯉꯥꯟ ꯇꯣꯉꯥꯅꯕꯥ ꯃꯑꯣꯡꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯏꯅꯔꯖꯤ ꯃꯥꯔꯀꯑꯥꯞ ꯂꯩꯔꯦ (ꯑꯍꯦꯅꯕꯥ <span>ꯑꯦꯁ ꯑꯍꯨꯝ ꯂꯩꯔꯣꯏ)꯫
  • .navbar-formꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫ ꯃꯁꯤ ꯍꯧꯖꯤꯛ ꯃꯊꯧ ꯇꯥꯗ꯭ꯔꯦ; ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ, .form-inlineꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯃꯥꯔꯖꯤꯟ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯈꯛꯇꯃꯛ ꯁꯤꯖꯤꯟꯅꯧ ꯑꯃꯁꯨꯡ ꯑꯦꯞꯂꯥꯏ ꯇꯧ꯫
  • ꯅꯦꯚꯕꯥꯔꯁꯤꯡꯗꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯌꯥꯑꯣꯔꯣꯏ margin-bottomꯅꯠꯔꯒꯥ border-radiusꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯌꯥꯑꯣꯔꯣꯏ꯫ ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡꯏꯟꯅꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫
  • ꯅꯕꯕꯥꯔꯁꯤꯡ ꯌꯥꯑꯣꯕꯥ ꯈꯨꯗꯝ ꯄꯨꯝꯅꯃꯛ ꯑꯅꯧꯕꯥ ꯃꯥꯔꯀꯑꯥꯞ ꯌꯥꯑꯣꯍꯟꯅꯕꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫

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

  • ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯕꯥ꯫
  • ꯍꯧꯖꯤꯛꯇꯤ ꯑꯦꯁ.ꯒꯤ ꯇꯨꯡꯏꯅꯕꯁꯤꯡꯗꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ( .page-item, ) ꯃꯊꯧ ꯇꯥꯔꯦ꯫.page-link.pagination
  • ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯁꯤ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ .pagerꯃꯔꯃꯗꯤ ꯃꯁꯤ ꯀꯁ꯭ꯇꯃꯁ ꯑꯣꯏꯕꯥ ꯑꯥꯎꯠꯂꯥꯏꯟ ꯕꯇꯅꯁꯤꯡꯗꯒꯤ ꯈꯔꯥ ꯍꯦꯟꯅꯥ ꯋꯥꯡꯏ꯫
  • .breadcrumb-itemꯍꯧꯖꯤꯛꯇꯤ .breadcrumbꯑꯦꯁ.ꯒꯤ ꯇꯨꯡꯏꯅꯕꯁꯤꯡꯗꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯥ, , ꯃꯊꯧ ꯇꯥꯏ꯫

ꯂꯦꯕꯦꯜ ꯑꯃꯁꯨꯡ ꯕꯦꯖꯁꯤꯡ꯫

  • ꯀꯟꯁꯣꯂꯤꯗꯦꯇꯦꯗ .labelꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ .badgeꯑꯗꯨꯗꯒꯤ ꯗꯤꯁꯑꯦꯃꯕꯤꯒ꯭ꯌꯨꯑꯦꯠ ꯇꯧꯕꯥ <label>ꯑꯃꯁꯨꯡ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡ ꯂꯥꯏꯊꯣꯀꯍꯅꯕꯥ꯫
  • .badge-pillꯒꯣꯜꯗ “ꯄꯤꯜ” ꯂꯨꯀꯀꯤꯗꯃꯛ ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯑꯣꯏꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫
  • ꯕꯦꯖꯁꯤꯡ ꯑꯁꯤ ꯂꯤꯁ꯭ꯠ ꯒ꯭ꯔꯨꯄꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯇꯣꯞꯄꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡꯗꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯐ꯭ꯂꯣꯠ ꯇꯧꯕꯥ ꯍꯧꯔꯔꯣꯏ꯫ ꯃꯗꯨꯒꯤꯗꯃꯛ ꯍꯧꯖꯤꯛ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯃꯊꯧ ꯇꯥꯔꯦ꯫
  • .badge-defaultꯑꯇꯣꯞꯄꯥ ꯃꯐꯃꯁꯤꯡꯗꯥ ꯁꯤꯖꯤꯟꯅꯔꯤꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯃꯣꯗꯤꯐꯥꯏꯌꯔ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯌꯥꯅꯕꯥ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ .badge-secondaryꯍꯥꯄꯆꯤꯜꯂꯦ꯫

ꯄꯦꯅꯦꯂꯁꯤꯡ, ꯊꯝꯕꯤꯕꯥ, ꯑꯃꯁꯨꯡ ꯋꯦꯂꯁꯤꯡ꯫

ꯑꯅꯧꯕꯥ ꯀꯥꯔꯗ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯁꯤꯒꯤꯗꯃꯛ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯊꯥꯗꯣꯀꯈꯤ꯫

ꯄꯦꯅꯦꯂꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

  • .panelto .card, ꯍꯧꯖꯤꯛ ꯐ꯭ꯂꯦꯛꯁꯕꯣꯛꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯥꯔꯦ꯫
  • .panel-defaultꯂꯧꯊꯣꯀꯈꯤ ꯑꯃꯁꯨꯡ ꯃꯍꯨꯠ ꯁꯤꯅꯕꯥ ꯌꯥꯔꯣꯏ꯫
  • .panel-groupꯂꯧꯊꯣꯀꯈꯤ ꯑꯃꯁꯨꯡ ꯃꯍꯨꯠ ꯁꯤꯅꯕꯥ ꯌꯥꯔꯣꯏ꯫ .card-groupꯑꯁꯤ ꯃꯍꯨꯠ ꯁꯤꯅꯕꯥ ꯅꯠꯇꯦ, ꯃꯁꯤ ꯇꯣꯉꯥꯜꯂꯤ꯫
  • .panel-headingꯇꯨ.card-header
  • .panel-titleꯇꯨ .card-title. ꯑꯄꯥꯝꯕꯥ ꯂꯨꯛ ꯑꯗꯨꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ, ꯅꯍꯥꯛꯅꯥ ꯍꯦꯗꯤꯡ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ <h3>, .h3) ꯅꯠꯠꯔꯒꯥ ꯕꯣꯜꯗ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ <strong>, <b>, .font-weight-bold) ꯁꯤꯖꯤꯟꯅꯕꯁꯨ ꯌꯥꯏ꯫ ꯅꯣꯠ ꯇꯧꯕꯤꯌꯨ ꯃꯗꯨꯗꯤ .card-title, ꯃꯥꯟꯅꯕꯥ ꯃꯃꯤꯡ ꯊꯣꯅꯔꯕꯁꯨ, .panel-title.
  • .panel-bodyꯇꯨ.card-body
  • .panel-footerꯇꯨ.card-footer
  • .panel-primary, .panel-success, .panel-info, .panel-warning, ꯑꯃꯁꯨꯡ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯁ ꯃꯦꯄꯇꯒꯤ ꯁꯦꯃꯒꯠꯄꯥ , , ꯑꯃꯁꯨꯡ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ .panel-dangerꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ꯫.bg-.text-.border$theme-colors

ꯈꯨꯃꯥꯡ ꯆꯥꯎꯁꯤꯟꯕ

  • ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ .progress-bar-*ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ .bg-*ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯅꯥ ꯃꯍꯨꯠ ꯁꯤꯅꯈꯤ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, class="progress-bar progress-bar-danger"ꯑꯣꯏꯔꯀꯏ class="progress-bar bg-danger".
  • .activeꯑꯦꯅꯤꯃꯦꯇꯦꯗ ꯄ꯭ꯔꯣꯒ꯭ꯔꯦꯁ ꯕꯥꯔꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯃꯍꯨꯠ ꯁꯤꯜꯂꯦ .progress-bar-animated.
  • ꯗꯤꯖꯥꯏꯟ ꯑꯃꯁꯨꯡ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯂꯥꯏꯊꯣꯀꯍꯟꯅꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯑꯣꯚꯔꯍꯣꯜ ꯇꯧꯈꯤ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯑꯗꯣꯃꯒꯤꯗꯃꯛꯇꯥ ꯑꯣꯚꯔꯔꯥꯏꯗ ꯇꯧꯅꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯍꯟꯊꯔꯦ, ꯑꯅꯧꯕꯥ ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯑꯅꯧꯕꯥ ꯑꯥꯏꯀꯅꯁꯤꯡ ꯂꯩꯔꯤ꯫
  • CSS ꯄꯨꯝꯅꯃꯛ ꯑꯟ-ꯅꯦꯁ꯭ꯠ ꯇꯧꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯀꯈ꯭ꯔꯦ, ꯃꯁꯤꯅꯥ ꯀ꯭ꯂꯥꯁ ꯈꯨꯗꯤꯡꯃꯛ .carousel-.
    • ꯀꯦꯔꯣꯁꯤꯜ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤꯗꯃꯛ, .next, .prev, .left, ꯑꯃꯁꯨꯡ .rightꯍꯧꯖꯤꯛ .carousel-item-next, .carousel-item-prev, .carousel-item-left, ꯑꯃꯁꯨꯡ .carousel-item-right.
    • .itemꯑꯁꯤꯁꯨ ꯍꯧꯖꯤꯛ .carousel-item.
    • ꯃꯃꯥꯡꯒꯤ/ꯃꯊꯪꯒꯤ ꯀꯟꯠꯔꯣꯂꯁꯤꯡꯒꯤꯗꯃꯛ, .carousel-control.rightꯑꯃꯁꯨꯡ .carousel-control.leftꯍꯧꯖꯤꯛ .carousel-control-nextꯑꯃꯁꯨꯡ .carousel-control-prev, ꯍꯥꯌꯕꯗꯤ ꯃꯈꯣꯌꯅꯥ ꯑꯀꯛꯅꯕꯥ ꯕꯦꯖ ꯀ꯭ꯂꯥꯁ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯗ꯭ꯔꯦ꯫
  • ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯄꯨꯝꯅꯃꯛ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ, ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯗꯥ ꯊꯦꯡꯊꯍꯜꯂꯦ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯑꯀꯛꯅꯕꯥ ꯚꯤꯎꯄꯣꯔꯇꯁꯤꯡꯗꯥ ꯀꯦꯄꯁꯅꯁꯤꯡ ꯎꯠꯄꯥ) ꯑꯃꯁꯨꯡ ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯀꯁ꯭ꯇꯝ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫
  • ꯀꯦꯔꯣꯁꯤꯜ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯗꯥ ꯂꯩꯕꯥ ꯏꯃꯦꯖꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯏꯃꯦꯖ ꯑꯣꯚꯔꯔꯥꯏꯗꯁꯤꯡ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ, ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯗꯥ ꯊꯦꯡꯊꯍꯜꯂꯦ꯫
  • ꯑꯅꯧꯕꯥ ꯃꯥꯔꯀꯑꯥꯞ ꯑꯃꯁꯨꯡ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯌꯥꯑꯣꯍꯟꯅꯕꯥ ꯀꯦꯔꯣꯁꯦꯂꯒꯤ ꯈꯨꯗꯝ ꯑꯗꯨ ꯇ꯭ꯌꯨꯏꯛ ꯇꯧꯈꯤ꯫

ꯇꯦꯕꯂꯁꯤꯡ꯫

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

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

ꯚꯦꯟꯗꯔ ꯄ꯭ꯔꯤꯐꯤꯛꯁ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ꯫

v3.2.0ꯗꯥ ꯌꯥꯑꯣꯗꯕꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯳ꯒꯤ ꯚꯦꯟꯗꯔ ꯄ꯭ꯔꯤꯐꯤꯛꯁ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯁꯤ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯴ꯗꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ, ꯑꯩꯈꯣꯌꯅꯥ ꯑꯣꯇꯣꯞꯔꯤꯐꯤꯛꯁꯔ ꯁꯤꯖꯤꯟꯅꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯃꯈꯣꯌ ꯑꯁꯤ ꯃꯊꯧ ꯇꯥꯗ꯭ꯔꯦ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯃꯤꯛꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ : animation, animation-delay, animation-direction, animation-duration, animation-fill-mode, animation-iteration-count, animation-name, animation-timing-function, backface-visibility, box-sizing, content-columns, hyphens, opacity, perspective, perspective-origin, rotate, rotateX, rotateY, scale, scaleX, scaleY, skew, transform-origin, transition-delay, transition-duration, transition-property, transition-timing-function, transition-transform,translatetranslate3duser-select

ꯗꯣꯀꯨꯃꯦꯟꯇ ꯇꯧꯕꯥ꯫

ꯑꯩꯈꯣꯌꯒꯤ ꯗꯣꯀꯨꯃꯦꯟꯇꯁꯤꯡ ꯑꯁꯤ ꯕꯣꯔꯗ ꯄꯨꯝꯅꯃꯀꯁꯨ ꯑꯄꯒ꯭ꯔꯦꯗ ꯑꯃꯥ ꯐꯪꯈꯤ꯫ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤ ꯂꯣ ꯗꯥꯎꯟꯅꯤ:

  • ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯀꯁꯨ ꯖꯦꯀꯤꯜ ꯁꯤꯖꯤꯟꯅꯔꯤ, ꯑꯗꯨꯕꯨ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯤꯛꯁ ꯑꯁꯤꯗꯥ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯂꯩꯔꯤ:
    • bugify.rbꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯕ꯭ꯔꯥꯎꯖꯔ ꯕꯥꯒ ꯄꯦꯖꯗꯥ ꯌꯥꯑꯣꯔꯤꯕꯥ ꯑꯦꯟꯠꯔꯤꯁꯤꯡ ꯑꯗꯨ ꯏꯐꯤꯁꯤꯌꯦꯟꯇ ꯑꯣꯏꯅꯥ ꯂꯤꯁ꯭ꯠ ꯇꯧꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫
    • example.rbꯑꯁꯤ ꯗꯤꯐꯣꯜꯇ highlight.rbꯄ꯭ꯂꯒꯏꯅꯒꯤ ꯀꯁ꯭ꯇꯝ ꯐꯣꯔꯛ ꯑꯃꯅꯤ, ꯃꯁꯤꯅꯥ ꯍꯦꯟꯅꯥ ꯂꯥꯌꯕꯥ ꯈꯨꯗꯝ-ꯀꯣꯗ ꯍꯦꯟꯗꯜ ꯇꯧꯕꯥ ꯌꯥꯍꯜꯂꯤ꯫
    • callout.rbꯑꯁꯤ ꯃꯁꯤꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯀꯁ꯭ꯇꯝ ꯐꯣꯔꯛ ꯑꯃꯅꯤ, ꯑꯗꯨꯕꯨ ꯑꯩꯈꯣꯌꯒꯤ ꯑꯈꯟꯅꯕꯥ ꯗꯣꯀꯁ ꯀꯣꯂꯑꯥꯎꯇꯁꯤꯡꯒꯤꯗꯃꯛ ꯗꯤꯖꯥꯏꯟ ꯇꯧꯕꯅꯤ꯫
    • jekyll-toc ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯇꯦꯕꯜ ꯑꯣꯐ ꯀꯟꯇꯦꯟꯇꯁꯤꯡ ꯁꯦꯃꯒꯠꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫
  • ꯗꯣꯛ ꯀꯟꯇꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯍꯦꯟꯅꯥ ꯐꯖꯅꯥ ꯑꯦꯗꯤꯠ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯃꯥꯔꯀꯗꯥꯎꯟꯗꯥ (HTML ꯒꯤ ꯃꯍꯨꯠꯇꯥ) ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯏꯈ꯭ꯔꯦ꯫
  • ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯀꯟꯇꯦꯟꯇ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯂꯥꯀꯁꯤꯅꯕꯥ ꯌꯥꯕꯥ ꯍꯥꯏꯔꯔꯀꯤꯒꯤꯗꯃꯛ ꯄꯦꯖꯁꯤꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯑꯣꯔꯒꯅꯥꯏꯖ ꯇꯧꯈ꯭ꯔꯦ꯫
  • ꯑꯩꯈꯣꯌꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ, ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥꯒꯤ ꯃꯄꯨꯡ ꯐꯥꯕꯥ ꯀꯥꯟꯅꯕꯥ ꯂꯧꯅꯕꯥ ꯆꯥꯡ ꯅꯥꯏꯅꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯇꯒꯤ ꯑꯦꯁ.ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯇꯥ ꯆꯪꯁꯤꯅꯈꯤ꯫

ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ꯫

v4.0.0ꯗꯥ ꯚꯦꯔꯤꯑꯦꯕꯜ ꯄꯨꯝꯅꯃꯛ @screen-ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫ media-breakpoint-up()ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ , media-breakpoint-down(), ꯅꯠꯠꯔꯒꯥ media-breakpoint-only()ꯁꯥꯁ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ $grid-breakpointsꯁꯥꯁ ꯃꯦꯞ ꯁꯤꯖꯤꯟꯅꯧ꯫

displayꯑꯩꯈꯣꯌꯒꯤ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯤ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯑꯆꯧꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫

  • .hiddenꯑꯃꯁꯨꯡ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ���ꯁꯤ jQuery's ꯑꯃꯁꯨꯡ ꯃꯦꯊꯗꯁꯤꯡꯒꯥ .showꯃꯥꯟꯅꯗꯕꯥ ꯃꯔꯝꯅꯥ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ꯫ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ, ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨ ꯇꯣꯒꯜ ꯇꯧꯅꯕꯥ ꯍꯣꯠꯅꯧ ꯅꯠꯠꯔꯒꯥ ꯑꯃꯁꯨꯡ .$(...).hide()$(...).show()[hidden]style="display: none;"style="display: block;"
  • ꯀ꯭ꯂꯥꯁ ꯄꯨꯝꯅꯃꯛ .hidden-ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ, ꯃꯃꯤꯡ ꯍꯣꯡꯗꯣꯛꯂꯕꯥ ꯄ꯭ꯔꯤꯟꯇ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯑꯗꯨ ꯁꯦꯚ ꯇꯧꯔꯦ꯫
    • v3 ꯗꯒꯤ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ:.hidden-xs .hidden-sm .hidden-md .hidden-lg .visible-xs-block .visible-xs-inline .visible-xs-inline-block .visible-sm-block .visible-sm-inline .visible-sm-inline-block .visible-md-block .visible-md-inline .visible-md-inline-block .visible-lg-block .visible-lg-inline .visible-lg-inline-block
    • v4 ꯑꯥꯂꯐꯥꯁꯤꯡꯗꯒꯤ ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ:.hidden-xs-up .hidden-xs-down .hidden-sm-up .hidden-sm-down .hidden-md-up .hidden-md-down .hidden-lg-up .hidden-lg-down
  • ꯄ꯭ꯔꯤꯟꯇ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ .hidden-ꯅꯠꯔꯒꯥ . .visible-.d-print-
    • ꯑꯔꯤꯕꯥ ꯃꯤꯡꯁꯤꯡ: .visible-print-block, .visible-print-inline, .visible-print-inline-block,.hidden-print
    • ꯑꯅꯧꯕꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ: .d-print-block, .d-print-inline, .d-print-inline-block,.d-print-none

ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯒꯤ ꯃꯍꯨꯠꯇꯥ .visible-*, ꯅꯍꯥꯛꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯁꯨꯞꯅꯇꯒꯤ ꯁ꯭ꯛꯔꯤꯟ ꯁꯥꯏꯖ ꯑꯗꯨꯗꯥ ꯂꯣꯠꯁꯤꯟꯗꯅꯥ ꯎꯕꯥ ꯐꯪꯍꯜꯂꯤ꯫ ꯅꯍꯥꯛꯅꯥ .d-*-noneꯀ꯭ꯂꯥꯁ ꯑꯃꯒꯥ ꯀ꯭ꯂꯥꯁ ꯑꯃꯒꯥ ꯄꯨꯅꯁꯤꯟꯗꯨꯅꯥ .d-*-blockꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯁ꯭ꯛꯔꯤꯟ ꯁꯥꯏꯖꯁꯤꯡꯒꯤ ꯑꯄꯤꯕꯥ ꯏꯟꯇꯔꯚꯜ ꯑꯃꯗꯥ ꯈꯛꯇꯃꯛ ꯎꯠꯄꯥ ꯌꯥꯏ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ .d-none.d-md-block.d-xl-noneꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯃꯤꯗꯤꯌꯝ ꯑꯃꯁꯨꯡ ꯑꯆꯧꯕꯥ ꯗꯤꯚꯥꯏꯁꯁꯤꯡ ꯈꯛꯇꯗꯥ ꯎꯠꯂꯤ)꯫

v4ꯗꯥ ꯒ꯭ꯔꯤꯗ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇꯁꯤꯡꯗꯥ ꯑꯍꯣꯡꯕꯥ ꯂꯥꯀꯄꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯑꯗꯣꯝꯅꯥ ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯐꯂꯁꯤꯡ ꯐꯪꯅꯕꯥ ꯕ꯭ꯔꯦꯀꯄꯣꯏꯟꯇ ꯑꯃꯥ ꯍꯦꯟꯅꯥ ꯆꯥꯎꯕꯥ ꯆꯠꯄꯥ ꯃꯊꯧ ꯇꯥꯒꯅꯤ ꯍꯥꯌꯕꯁꯤ ꯈꯉꯖꯤꯅꯕꯤꯌꯨ꯫ ꯑꯅꯧꯕꯥ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯌꯨꯇꯤꯂꯤꯇꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯚꯤꯖꯤꯕꯤꯂꯤꯇꯤ ꯑꯁꯤ ꯚꯤꯎꯄꯣꯔꯠ ꯁꯥꯏꯖꯁꯤꯡꯒꯤ ꯀꯟꯇꯤꯒ꯭ꯌ ꯔꯦꯟꯖ ꯑꯃꯈꯛꯇꯃꯛ ꯑꯣꯏꯅꯥ ꯐꯣꯡꯗꯣꯀꯄꯥ ꯉꯃꯗꯕꯥ ꯌꯥꯝꯅꯥ ꯅꯦꯝꯕꯥ ꯀꯦꯁꯁꯤꯡ ꯌꯥꯑꯣꯍꯟꯅꯕꯥ ꯍꯣꯠꯅꯗꯦ; ꯑꯁꯤꯒꯨꯝꯕꯥ ꯀꯦꯁꯁꯤꯡ ꯑꯁꯤꯗꯥ ꯅꯍꯥꯛꯅꯥ ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀꯁ꯭ꯇꯝ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.