Source

ꯂꯧꯊꯕ

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

ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ. ꯑꯃꯁꯨꯡ ꯖꯦ.ꯑꯦꯁ

ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯇꯥ ꯐꯖꯅꯥ ꯊꯝꯅꯕꯥ Bootstrap v4.1.3ꯒꯤꯗꯃꯛ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯁꯦꯝ ꯁꯥꯕꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯀꯣꯗ ꯗꯥꯎꯅꯂꯣꯗ ꯇꯧꯕꯤꯌꯨ , ꯃꯁꯤꯗꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤꯡꯁꯤ ꯌꯥꯑꯣꯔꯤ:

  • ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯑꯃꯁꯨꯡ ꯃꯤꯅꯤꯐꯥꯏ ꯇꯧꯔꯕꯥ CSS ꯕꯟꯗꯂꯁꯤꯡ ( CSS ꯐꯥꯏꯂꯁꯤꯡ ꯆꯥꯡꯗꯝꯅꯕꯥ ꯌꯦꯡꯕꯤꯌꯨ )
  • ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯃꯤꯅꯤꯐꯥꯏ ꯇꯧꯕꯥ꯫

ꯃꯁꯤꯗꯥ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯦꯁꯟ, ꯁꯣꯔꯁ ꯐꯥꯏꯂꯁꯤꯡ, ꯅꯠꯠꯔꯒꯥ ꯑꯣꯄꯁꯅꯦꯜ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯑꯃꯠꯇꯥ (jQuery ꯑꯃꯁꯨꯡ Popper.js) ꯌꯥꯑꯣꯗꯦ꯫

ꯂꯧꯊꯕ

ꯁꯣꯔꯁ ꯐꯥꯏꯂꯁꯤꯡ꯫

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

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

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

ꯁꯣꯔꯁ ꯗꯥꯎꯅꯂꯣꯗ ꯇꯧꯕꯥ꯫

ꯖꯦ.ꯑꯦꯁ.ꯗꯦꯂꯤꯚꯔ ꯇꯧꯕꯥ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ CSS ꯑꯃꯁꯨꯡ JSꯒꯤ ꯀꯦꯁ ꯇꯧꯔꯕꯥ ꯚꯔꯁꯟ ꯑꯗꯨ ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯇꯥ ꯌꯧꯍꯟꯅꯕꯥ jsDelivrꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯗꯥꯎꯅꯂꯣꯗ ꯇꯧꯕꯥ ꯑꯗꯨ ꯊꯥꯗꯣꯀꯎ꯫

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ, ꯃꯁꯤꯒꯤ ꯃꯃꯥꯡꯗꯥ jQuery ꯑꯃꯁꯨꯡ Popper.jsꯒꯤ CDN ꯚꯔꯁꯅꯁꯤꯡ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯀꯥꯑꯣꯔꯣꯏꯗꯕꯅꯤ꯫

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>

ꯄꯦꯀꯦꯖ ꯃꯦꯅꯦꯖꯔꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

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

ꯑꯦꯟ.ꯄꯤ.ꯑꯦꯝ

npm ꯄꯦꯀꯦꯖꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯅꯍꯥꯛꯀꯤ Node.js ꯄꯥꯋꯔ ꯇꯧꯕꯥ ꯑꯦꯄꯁꯤꯡꯗꯥ Bootstrap ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯤꯌꯨ :

npm install bootstrap

require('bootstrap')ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ jQuery ꯄ꯭ꯂꯒꯏꯟ ꯄꯨꯝꯅꯃꯛ jQuery ꯑꯣꯕꯖꯦꯛꯇꯇꯥ ꯂꯣꯗ ꯇꯧꯒꯅꯤ꯫ ꯃꯣꯗ꯭ꯌꯨꯜ bootstrapꯃꯁꯥꯃꯛꯅꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯑꯃꯠꯇꯥ ꯑꯦꯛꯁꯄꯣꯔꯠ ꯇꯧꯗꯦ꯫ /js/*.jsꯄꯦꯀꯦꯖ ꯑꯗꯨꯒꯤ ꯃꯊꯛꯀꯤ ꯊꯥꯛꯀꯤ ꯗꯥꯏꯔꯦꯛꯇꯣꯔꯤꯒꯤ ꯃꯈꯥꯗꯥ ꯂꯩꯕꯥ ꯐꯥꯏꯂꯁꯤꯡ ꯂꯣꯗ ꯇꯧꯗꯨꯅꯥ ꯅꯍꯥꯛꯅꯥ Bootstrapꯒꯤ jQuery ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯗꯨ ꯃꯤꯑꯣꯏ ꯑꯃꯃꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯂꯣꯗ ꯇꯧꯕꯥ ꯌꯥꯏ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ'ꯁꯤꯡꯗꯥ package.jsonꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯀꯤꯁꯤꯡ ꯑꯁꯤꯒꯤ ꯃꯈꯥꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯃꯦꯇꯥꯗꯦꯇꯥ ꯈꯔꯥ ꯌꯥꯎꯏ:

  • sass- ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯁꯥꯁ ꯁꯣꯔꯁ ꯐꯥꯏꯂꯒꯤ ꯄꯥꯊ꯫
  • style- ꯗꯤꯐꯣꯜꯇ ꯁꯦꯇꯤꯡꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯄ꯭ꯔꯤꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯅꯟ-ꯃꯤꯅꯤꯐꯥꯏꯗ CSSꯒꯤ ꯄꯥꯊ (ꯀꯁ꯭ꯇꯃꯥꯏꯖꯦꯁꯟ ꯂꯩꯇꯦ)

ꯔꯨꯕꯤꯖꯦꯃꯁ ꯍꯥꯌꯅꯥ ꯈꯉꯅꯕꯥ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯂꯥꯏꯟ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯕꯟꯗꯂꯔ ( ꯔꯤꯀꯃꯦꯟꯗ ꯇꯧꯔꯕꯥ ) ꯑꯃꯁꯨꯡ ꯔꯨꯕꯤꯖꯦꯃꯁ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯔꯨꯕꯤ ꯑꯦꯄꯁꯤꯡꯗꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯤꯌꯨ Gemfile:

gem 'bootstrap', '~> 4.1.3'

ꯅꯠꯔꯒꯥ, ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯕꯟꯗꯂꯔ ꯁꯤꯖꯤꯟꯅꯗ꯭ꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ ꯀꯃꯥꯟꯗ ꯑꯁꯤ ꯆꯠꯇꯨꯅꯥ ꯒꯦꯝ ꯑꯁꯤ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯌꯥꯏ:

gem install bootstrap -v 4.1.3

ꯃꯈꯥ ꯇꯥꯕꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯒꯤꯗꯃꯛ ꯒꯦꯝ ꯑꯁꯤꯒꯤ README ꯌꯦꯡꯕꯤꯌꯨ꯫

ꯀꯝꯄꯣꯖꯤꯁꯟ ꯇꯧꯕꯥ꯫

ꯀꯝꯄꯣꯖꯔ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯥꯁ ꯑꯃꯁꯨꯡ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯁꯨ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯃꯦꯅꯦꯖ ꯇꯧꯕꯥ ꯌꯥꯏ :

composer require twbs/bootstrap:4.1.3

ꯅꯨꯒꯦꯠ꯫

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ .NET ꯗꯥ ꯗꯤꯚꯦꯂꯞ ꯇꯧꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ NuGet ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ Bootstrap ꯒꯤ CSS ꯅꯠꯠꯔꯒꯥ Sass ꯑꯃꯁꯨꯡ JavaScript ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯃꯦꯅꯦꯖ ꯇꯧꯕꯁꯨ ꯌꯥꯏ :

Install-Package bootstrap
Install-Package bootstrap.sass