in English

ꯔꯤꯕꯨꯠ ꯇꯧꯕꯥ꯫

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

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

ꯊꯧꯑꯣꯡ

ꯔꯤꯕꯨꯠ ꯑꯁꯤ ꯅꯣꯔꯃꯦꯂꯥꯏꯖ ꯇꯧꯕꯗꯥ ꯁꯦꯃꯒꯠꯂꯤ, ꯑꯦꯂꯤꯃꯦꯟꯇ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡ ꯈꯛꯇꯃꯛ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ HTML ꯑꯦꯂꯤꯃꯦꯟꯇ ꯀꯌꯥꯗꯥ ꯈꯔꯥ ꯑꯣꯄꯤꯅꯤꯌꯟ ꯑꯣꯏꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯄꯤꯔꯤ꯫ ꯑꯍꯦꯅꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯑꯁꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯈꯛꯇꯃꯛ ꯇꯧꯏ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ <table>ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯕꯦꯖ ꯂꯥꯏꯟ ꯑꯃꯒꯤꯗꯃꯛ ꯁ꯭ꯇꯥꯏꯜ ꯈꯔꯗꯤ ꯔꯤꯕꯨꯠ ꯇꯧꯏ ꯑꯃꯁꯨꯡ ꯃꯇꯨꯡꯗꯥ .table, .table-bordered, ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥ ꯄꯤꯔꯤ꯫

ꯔꯤꯕꯣꯠ ꯇꯧꯕꯗꯥ ꯀꯔꯤ ꯑꯣꯚꯔꯔꯥꯏꯗ ꯇꯧꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯈꯅꯕꯒꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯒꯥꯏꯗꯂꯥꯏꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯔꯃꯁꯤꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤ:

ꯁ꯭ꯀꯦꯂꯦꯕꯜ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯁ꯭ꯄꯦꯁꯤꯡꯒꯤꯗꯃꯛ remsꯒꯤ ꯃꯍꯨꯠꯇꯥ s ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ ꯚꯦꯜꯌꯨ ꯈꯔꯗꯤ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯣ .em
ꯊꯤꯡꯖꯤꯜꯂꯨ margin-top. ꯚꯔꯇꯤꯀꯦꯜ ꯃꯥꯔꯖꯤꯅꯁꯤꯡ ꯑꯁꯤ ꯁꯣꯀꯍꯜꯂꯀꯄꯥ ꯌꯥꯏ, ꯃꯗꯨꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯔꯒꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯐꯂꯁꯤꯡ ꯄꯤꯕꯥ ꯌꯥꯏ꯫ ꯑꯗꯨꯕꯨ ꯍꯦꯟꯅꯥ ꯃꯔꯨꯑꯣꯏꯕꯗꯤ, ꯃꯥꯏꯀꯩ ꯑꯃꯈꯛꯇꯃꯛ marginꯑꯁꯤ ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯃꯦꯟꯇꯦꯜ ꯃꯣꯗꯦꯜ ꯑꯃꯅꯤ꯫
ꯗꯤꯚꯥꯏꯁ ꯁꯥꯏꯖꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯐꯖꯅꯥ ꯁ꯭ꯀꯦꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ, ꯕ꯭ꯂꯣꯛ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯅꯥ sꯒꯤꯗꯃꯛ rems marginꯁꯤꯖꯤꯟꯅꯒꯗꯕꯅꯤ꯫
font-ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯄ꯭ꯔꯣꯄꯔꯇꯤꯁꯤꯡꯒꯤ ꯗꯤꯛꯂꯥꯔꯦꯁꯅꯁꯤꯡ ꯑꯗꯨ ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯦꯝꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯊꯝꯃꯨ , inheritꯌꯥꯔꯤꯕꯃꯈꯩ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ꯫

ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ꯫

v5.2.0ꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫

v5.1.1ꯒꯥ ꯂꯣꯌꯅꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ @importꯑꯩꯈꯣꯌꯒꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯕꯟꯗꯜ ꯄꯨꯝꯅꯃꯛꯇꯥ ( bootstrap.css, bootstrap-reboot.css, ꯑꯃꯁꯨꯡ bootstrap-grid.css) ꯌꯥꯑꯣꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯃꯊꯧ ꯇꯥꯕꯥ ꯑꯦꯁ _root.scss. ꯃꯁꯤꯅꯥ ꯕꯟꯗꯜ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯂꯦꯚꯦꯜ CSS ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯤ :root, ꯃꯈꯣꯌꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯀꯌꯥ ꯌꯥꯝꯅꯥ ꯕꯟꯗꯜ ꯑꯗꯨꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯌꯦꯡꯗꯅꯥ꯫ ꯑꯔꯣꯏꯕꯗꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯵ꯅꯥ ꯃꯇꯃꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯍꯦꯟꯅꯥ CSS ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯀꯄꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯎꯒꯅꯤ , ꯃꯁꯤꯅꯥ ꯃꯇꯝ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯁꯥꯁ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯒꯤ ꯃꯊꯧ ꯇꯥꯗꯅꯥ ꯍꯦꯟꯅꯥ ꯔꯤꯑꯦꯜ-ꯇꯥꯏꯝ ꯀꯁ꯭ꯇꯃꯔꯥꯏꯖꯦꯁꯟ ꯄꯤꯒꯅꯤ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯑꯦꯞꯔꯣꯆ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯣꯔꯁ ꯁꯥꯁ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯂꯧꯗꯨꯅꯥ ꯃꯈꯣꯌꯕꯨ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ. ꯃꯗꯨꯒꯤ ꯃꯑꯣꯡ ꯑꯗꯨꯗꯥ, ꯅꯍꯥꯛꯅꯥ CSS ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯗ꯭ꯔꯕꯁꯨ, ꯅꯍꯥꯛꯅꯥ ꯍꯧꯖꯤꯀꯁꯨ ꯁꯥꯁꯀꯤ ꯄꯥꯋꯔ ꯄꯨꯝꯅꯃꯛ ꯂꯩꯔꯤ꯫ ꯃꯁꯤ ꯍꯧꯖꯤꯀꯁꯨ ꯆꯠꯊꯔꯤ ꯑꯃꯁꯨꯡ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯏꯃꯞꯂꯤꯃꯦꯟꯇ ꯇꯧꯕꯗꯥ ꯃꯇꯝ ꯆꯪꯒꯅꯤ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯀꯃꯟ ꯑꯣꯏꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ :rootCSS ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯑꯁꯤ ꯈꯟꯅꯕꯤꯌꯨ:<body>

  @if $font-size-root != null {
    --#{$prefix}root-font-size: #{$font-size-root};
  }
  --#{$prefix}body-font-family: #{$font-family-base};
  @include rfs($font-size-base, --#{$prefix}body-font-size);
  --#{$prefix}body-font-weight: #{$font-weight-base};
  --#{$prefix}body-line-height: #{$line-height-base};
  --#{$prefix}body-color: #{$body-color};
  @if $body-text-align != null {
    --#{$prefix}body-text-align: #{$body-text-align};
  }
  --#{$prefix}body-bg: #{$body-bg};

ꯆꯠꯅꯕꯤꯗꯥ, ꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ ꯑꯗꯨ ꯔꯤꯕꯣꯠꯇꯥ ꯃꯈꯥꯒꯤ ꯑꯁꯤꯒꯨꯝꯅꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ:

body {
  margin: 0; // 1
  font-family: var(--#{$prefix}body-font-family);
  @include font-size(var(--#{$prefix}body-font-size));
  font-weight: var(--#{$prefix}body-font-weight);
  line-height: var(--#{$prefix}body-line-height);
  color: var(--#{$prefix}body-color);
  text-align: var(--#{$prefix}body-text-align);
  background-color: var(--#{$prefix}body-bg); // 2
  -webkit-text-size-adjust: 100%; // 3
  -webkit-tap-highlight-color: rgba($black, 0); // 4
}

ꯃꯁꯤꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯄꯥꯝꯂꯤꯕꯃꯈꯩ ꯔꯤꯑꯦꯜ-ꯇꯥꯏꯝ ꯀꯁ꯭ꯇꯃꯔꯥꯏꯖꯦꯁꯟ ꯇꯧꯕꯥ ꯌꯥꯍꯜꯂꯤ:

<body style="--bs-body-color: #333;">
  <!-- ... -->
</body>

ꯄꯦꯖ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏ꯫

<html>ꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯑꯁꯤ <body>ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯄꯦꯖ-ꯋꯥꯏꯗ ꯗꯤꯐꯣꯜꯇꯁꯤꯡ ꯄꯤꯅꯕꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯏ꯫ ꯍꯦꯟꯅꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ:

ꯗꯤ box-sizingꯑꯁꯤ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯏꯂꯤꯃꯦꯟꯇ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ ꯁꯦꯠ ꯇꯧꯏ—ꯃꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ *::beforeꯑꯃꯁꯨꯡ *::after, ꯇꯨ border-box. ꯃꯁꯤꯅꯥ ꯄꯦꯗꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯕꯣꯔꯗꯔꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯀꯤ ꯂꯥꯎꯊꯣꯛꯂꯕꯥ ꯄꯥꯛ-ꯆꯥꯎꯕꯥ ꯑꯗꯨ ꯀꯩꯗꯧꯉꯩꯗꯥ ꯍꯦꯅꯒꯠꯍꯟꯗꯅꯕꯥ ꯁꯣꯌꯗꯅꯥ ꯊꯝꯂꯤ꯫
- font-size, ꯗꯥ ꯕꯦꯖ ꯑꯃꯠꯇꯥ ꯂꯥꯎꯊꯣꯛꯇꯦ <html>, ꯑꯗꯨꯕꯨ 16pxꯂꯧꯁꯤꯜꯂꯤ (ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ)꯫ ꯑꯁꯤ ꯌꯨꯖꯔꯒꯤ ꯄꯁꯟꯗꯁꯤꯡ ꯏꯀꯥꯌꯈꯨꯝꯅꯕꯥ ꯎꯠꯇꯨꯅꯥ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯈꯨꯗꯣꯡꯆꯥꯕꯥ ꯌꯥꯕꯥ ꯑꯦꯞꯔꯣꯆ ꯑꯃꯥ ꯁꯣꯌꯗꯅꯥ ꯐꯪꯍꯟꯗꯨꯅꯥ ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯐꯖꯅꯥ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ ꯇꯥꯏꯞ-ꯁ꯭ꯀꯦꯂꯤꯡꯒꯤꯗꯃꯛ font-size: 1remꯑꯣꯟ ꯗꯤ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫ ꯃꯁꯤꯒꯤ ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ ꯑꯁꯤ ꯚꯦꯔꯤꯑꯦꯕꯜ <body>ꯑꯗꯨ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯗꯨꯅꯥ ꯑꯣꯚꯔꯔꯥꯏꯗ ꯇꯧꯕꯥ ꯌꯥꯏ꯫$font-size-root
ꯑꯁꯤꯅꯥ <body>ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥ font-family, font-weight, line-height, ꯑꯃꯁꯨꯡ color. ꯃꯁꯤ ꯐꯣꯟꯇ ꯏꯅꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯁꯁꯤꯡ ꯊꯤꯡꯅꯕꯥ ꯐꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯈꯔꯅꯥ ꯃꯇꯨꯡꯗꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯏ꯫
ꯁꯦꯐꯇꯤꯒꯤꯗꯃꯛ, <body>ꯗꯤꯛꯂꯥꯔꯦꯗ ꯑꯃꯥ ꯂꯩꯔꯤ background-color, ꯗꯤꯐꯣꯜꯇ ꯇꯧꯗꯨꯅꯥ #fff.

ꯅꯦꯇꯤꯕ ꯐꯣꯟꯇ ꯁ꯭ꯇꯦꯛ ꯇꯧꯕꯥ꯫

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

$font-family-sans-serif:
  // Cross-platform generic font family (default user interface font)
  system-ui,
  // Safari for macOS and iOS (San Francisco)
  -apple-system,
  // Windows
  "Segoe UI",
  // Android
  Roboto,
  // older macOS and iOS
  "Helvetica Neue"
  // Linux
  "Noto Sans",
  "Liberation Sans",
  // Basic web fallback
  Arial,
  // Sans serif fallback
  sans-serif,
  // Emoji fonts
  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;

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

ꯃꯁꯤ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯑꯃꯁꯨꯡ ꯑꯣꯇꯣꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯏ font-familyꯍꯥꯌꯅꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫ <body>ꯒ꯭ꯂꯣꯕꯦꯜ ꯍꯣꯡꯗꯣꯛꯅꯕꯥ , ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ font-familyꯑꯄꯗꯦꯠ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯥ꯫$font-family-base

ꯍꯦꯗꯤꯡ ꯑꯃꯁꯨꯡ ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐꯁꯤꯡ꯫

ꯍꯦꯗꯤꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ—ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, <h1>—ꯑꯗꯨꯒꯥ <p>ꯃꯈꯣꯌꯒꯤ margin-topꯂꯧꯊꯣꯛꯅꯕꯥ ꯔꯤꯁꯦꯠ ꯇꯧꯏ꯫ ꯍꯦꯗꯤꯡꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ ꯑꯃꯁꯨꯡ ꯐꯖꯅꯥ ꯁ꯭ꯄꯦꯁꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ margin-bottom: .5remꯄꯦꯔꯥꯒ꯭ꯔꯥꯐꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫margin-bottom: 1rem

ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫	ꯈꯨꯗꯝ
`<h1></h1>`	ꯑꯩꯆ.꯱. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
`<h2></h2>`	h꯲. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
`<h3></h3>`	ꯑꯩꯆ꯳. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
`<h4></h4>`	ꯑꯩꯆ꯴. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
`<h5></h5>`	h꯵. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
`<h6></h6>`	ꯑꯩꯆ꯶. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫

ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯔꯨꯂꯁꯤꯡ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ <hr>ꯂꯥꯏꯊꯣꯀꯍꯜꯂꯦ꯫ ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯅꯥ, <hr>s ꯑꯁꯤ via ꯁ꯭ꯇꯥꯏꯜ ꯇꯧꯏ border-top, ꯗꯤꯐꯣꯜꯇ ꯑꯃꯥ ꯂꯩ , ꯑꯃꯁꯨꯡ ꯃꯈꯣꯌꯒꯤ via ꯑꯗꯨ opacity: .25ꯑꯣꯇꯣꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯏ , ꯃꯃꯥ-ꯃꯄꯥꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯀꯗꯥꯏꯗꯥ ꯁꯦꯠ ꯇꯧꯕꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯌꯥꯎꯏ꯫ ꯃꯈꯣꯌ ꯑꯁꯤ ꯇꯦꯛꯁꯠ, ꯕꯣꯔꯗꯔ, ꯑꯃꯁꯨꯡ ꯑꯣꯄꯦꯁꯤꯇꯤ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯕꯥ ꯌꯥꯏ꯫border-colorcolorcolor

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<hr>

<div class="text-success">
  <hr>
</div>

<hr class="border border-danger border-2 opacity-50">
<hr class="border border-primary border-3 opacity-75">

ꯂꯤꯁ꯭ꯇꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

ꯂꯤꯁ꯭ꯠ ꯄꯨꯝꯅꯃꯛ— <ul>, <ol>, ꯑꯃꯁꯨꯡ <dl>—ꯃꯈꯣꯌꯒꯤ margin-topꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯑꯦ margin-bottom: 1rem. ꯅꯦꯁ꯭ꯇꯦꯗ ꯂꯤꯁ꯭ꯇꯁꯤꯡꯗꯥ margin-bottom. ꯑꯩꯈꯣꯌꯅꯥ padding-leftꯑꯣꯟ <ul>ꯑꯃꯁꯨꯡ <ol>ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯁꯨ ꯔꯤꯁꯦꯠ ꯇꯧꯈ꯭ꯔꯦ꯫

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

ꯃꯈꯥꯗꯥ ꯑꯣꯔꯗꯔ ꯇꯧꯔꯕꯥ ꯂꯤꯁ꯭ꯠ ꯑꯃꯥ ꯄꯤꯔꯤ꯫
ꯂꯤꯁ꯭ꯠ ꯑꯥꯏꯇꯦꯝ ꯈꯔꯒꯥ ꯂꯣꯌꯅꯅꯥ꯫
ꯃꯁꯤꯒꯤ ꯑꯄꯨꯅꯕꯥ ꯃꯤꯠꯌꯦꯡ ꯑꯁꯤ ꯑꯃꯒꯥ ꯑꯃꯒꯥ ꯃꯥꯟꯅꯩ꯫
ꯃꯃꯥꯡꯒꯤ ꯑꯅꯑꯣꯔꯗꯔ ꯇꯧꯔꯕꯥ ꯂꯤꯁ꯭ꯠ ꯑꯗꯨꯒꯨꯝꯅꯥ꯫

ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ, ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯍꯥꯏꯔꯔꯀꯤ, ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯁ꯭ꯄꯦꯁꯤꯡꯒꯤꯗꯃꯛ, ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯇꯁꯤꯡꯗꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯥ marginꯑꯦꯁ. <dd>s ꯔꯤꯁꯦꯠ margin-leftꯇꯧꯕꯥ 0ꯑꯃꯁꯨꯡ ꯍꯥꯄꯆꯤꯅꯕꯥ margin-bottom: .5rem. <dt>ꯑꯦꯁ ꯑꯁꯤ ꯕꯣꯜꯗ ꯇꯧꯏ .

ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯇꯁꯤꯡ꯫: ꯋꯥꯍꯟꯊꯣꯛ ꯄꯤꯅꯕꯒꯤꯗꯃꯛ ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯠ ꯑꯃꯥ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫
ꯋꯥꯍꯩ: ꯋꯥꯍꯩ ꯑꯁꯤꯒꯤꯗꯃꯛꯇꯥ ꯋꯥꯍꯟꯊꯣꯛ ꯄꯤꯕꯥ꯫; ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯋꯥꯍꯩ ꯑꯁꯤꯒꯤ ꯑꯅꯤꯁꯨꯕꯥ ꯋꯥꯍꯟꯊꯣꯛ ꯑꯃꯥ꯫
ꯑꯇꯣꯞꯄꯥ ꯋꯥꯍꯟꯊꯣꯛ ꯑꯃꯅꯤ꯫: ꯑꯇꯣꯞꯄꯥ ꯋꯥꯍꯩ ꯑꯁꯤꯒꯤ ꯋꯥꯍꯟꯊꯣꯛ꯫

ꯏꯅꯂꯥꯏꯟ ꯀꯣꯗ꯫

ꯀꯣꯗꯀꯤ ꯏꯅꯂꯥꯏꯟ ꯁ꯭ꯅꯤꯄꯦꯠꯁꯤꯡ ꯑꯁꯤ <code>. HTML ꯑꯦꯉ꯭ꯒꯜ ꯕ꯭ꯔꯦꯀꯦꯠꯁꯤꯡꯗꯒꯤ ꯁꯣꯌꯗꯅꯥ ꯑꯦꯁ꯭ꯀꯦꯞ ꯇꯧꯕꯤꯌꯨ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, <section>ꯏꯅꯂꯥꯏꯟ ꯑꯣꯏꯅꯥ ꯔꯦꯞ ꯇꯧꯒꯗꯕꯅꯤ꯫

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

For example, <code>&lt;section&gt;</code> should be wrapped as inline.

ꯀꯣꯗ ꯕ꯭ꯂꯣꯛ ꯇꯧꯕꯥ꯫

<pre>ꯀꯣꯗꯀꯤ ꯃꯁꯤꯡ ꯌꯥꯝꯂꯕꯥ ꯂꯥꯏꯅꯁꯤꯡꯒꯤꯗꯃꯛ s ꯁꯤꯖꯤꯟꯅꯧ꯫ ꯑꯃꯨꯛ ꯍꯟꯅꯥ, ꯃꯑꯣꯡ ꯆꯨꯝꯅꯥ ꯔꯦꯟꯗꯔ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯀꯣꯗꯇꯥ ꯂꯩꯕꯥ ꯑꯦꯉ꯭ꯒꯜ ꯕ꯭ꯔꯦꯀꯦꯠ ꯑꯃꯍꯦꯛꯇꯕꯨ ꯁꯣꯌꯗꯅꯥ ꯑꯦꯁ꯭ꯀꯦꯞ ꯇꯧꯕꯤꯌꯨ꯫ <pre>ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ ꯃꯁꯤꯒꯤ ꯂꯧꯊꯣꯛꯅꯕꯥ margin-topꯑꯃꯁꯨꯡ remꯃꯁꯤꯒꯤ margin-bottom.

<p>Sample text here...</p>
<p>And another line of sample text here...</p>

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<pre><code>&lt;p&gt;Sample text here...&lt;/p&gt;
&lt;p&gt;And another line of sample text here...&lt;/p&gt;
</code></pre>

ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ꯫

ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ <var>ꯇꯥꯛꯅꯕꯒꯤꯗꯃꯛ ꯇꯦꯒ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯧ꯫

y = m x + ꯕꯤ ꯑꯁꯤꯅꯤ꯫

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<var>y</var> = <var>m</var><var>x</var> + <var>b</var>

ꯌꯨꯖꯔ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

<kbd>ꯃꯍꯧꯁꯥꯅꯥ ꯀꯤꯕꯣꯔꯗꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯦꯟꯇꯔ ꯇꯧꯕꯥ ꯏꯅꯄꯨꯠ ꯑꯗꯨ ꯇꯥꯛꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯗꯥꯏꯔꯦꯛꯇꯣꯔꯤꯁꯤꯡ ꯍꯣꯡꯗꯣꯛꯅꯕꯥ, cdꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯗꯥꯏꯔꯦꯛꯇꯣꯔꯤꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ ꯇꯥꯏꯞ ꯇꯧ꯫
ꯁꯦꯇꯤꯡꯁꯤꯡ ꯑꯦꯗꯤꯠ ꯇꯧꯅꯕꯥ, ꯀ꯭ꯂꯤꯛ ꯇꯧꯔꯣ꯫ ctrl + ,

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br>
To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>

ꯁꯦꯝꯄꯜ ꯑꯥꯎꯇꯄꯨꯠ꯫

ꯄ꯭ꯔꯣꯒ꯭ꯔꯥꯝ ꯑꯃꯗꯒꯤ ꯁꯦꯝꯄꯜ ꯑꯥꯎꯇꯄꯨꯠ ꯑꯗꯨ <samp>ꯇꯥꯛꯅꯕꯒꯤꯗꯃꯛ ꯇꯦꯒ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯧ꯫

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

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<samp>This text is meant to be treated as sample output from a computer program.</samp>

ꯇꯦꯕꯂꯁꯤꯡ꯫

ꯇꯦꯕꯂꯁꯤꯡ ꯑꯁꯤ ꯁ꯭ꯇꯥꯏꯜ <caption>ꯑꯦꯁ, ꯀꯣꯂꯥꯞꯁ ꯕꯣꯔꯗꯔꯁꯤꯡꯗꯥ ꯈꯔꯥ ꯑꯦꯗꯖꯁ꯭ꯠ ꯇꯧꯏ, ꯑꯃꯁꯨꯡ text-alignꯄꯨꯝꯅꯃꯛꯇꯥ ꯂꯦꯞꯄꯥ ꯂꯩꯇꯅꯥ ꯁꯣꯏꯗꯅꯥ ꯊꯝꯂꯤ꯫ ꯉꯃꯈꯩꯁꯤꯡ, ꯄꯦꯗꯤꯡ, ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥꯒꯤ ꯑꯍꯦꯅꯕꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯁꯤ ꯀ꯭ꯂꯥꯁ .tableꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯂꯥꯀꯏ .

ꯃꯁꯤ ꯈꯨꯗꯝ ꯑꯣꯏꯕꯥ ꯇꯦꯕꯜ ꯑꯃꯅꯤ, ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯂꯩꯔꯤꯕꯥ ꯋꯥꯐꯃꯁꯤꯡ ꯑꯁꯤ ꯐꯣꯡꯗꯣꯛꯅꯕꯥ ꯃꯁꯤꯒꯤ ꯀꯦꯄꯁꯅꯅꯤ꯫
ꯇꯦꯕꯜ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫	ꯇꯦꯕꯜ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫	ꯇꯦꯕꯜ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫	ꯇꯦꯕꯜ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫
ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫
ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫
ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫	ꯇꯦꯕꯜ ꯁꯦꯜ꯫

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<table>
  <caption>
    This is an example table, and this is its caption to describe the contents.
  </caption>
  <thead>
    <tr>
      <th>Table heading</th>
      <th>Table heading</th>
      <th>Table heading</th>
      <th>Table heading</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
    <tr>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
    <tr>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
      <td>Table cell</td>
    </tr>
  </tbody>
</table>

ꯐꯣꯔꯃꯁꯤꯡ꯫

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

<fieldset>s ꯑꯁꯤ ꯉꯃꯈꯩ, ꯄꯦꯗꯤꯡ, ꯅꯠꯠꯔꯒꯥ ꯃꯥꯔꯖꯤꯟ ꯂꯩꯇꯦ ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯃꯈꯣꯌ ꯑꯁꯤ ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯏꯅꯄꯨꯠ ꯅꯠꯠꯔꯒꯥ ꯏꯅꯄꯨꯠ ꯀꯥꯡꯂꯨꯄꯁꯤꯡꯒꯤ ꯔꯦꯄꯔ ꯑꯣꯏꯅꯥ ꯐꯖꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ꯫
<legend>s, ꯐꯤꯜꯗꯁꯦꯇꯒꯨꯝꯅꯥ, ꯃꯈꯜ ꯀꯌꯥꯒꯤ ꯍꯦꯗꯤꯡ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯎꯠꯅꯕꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯁꯦꯃꯗꯣꯀꯈ꯭ꯔꯦ꯫
<label>s ꯑꯁꯤ ꯑꯦꯞꯂꯥꯏ display: inline-blockꯇꯧꯕꯥ ꯌꯥꯅꯕꯥ ꯁꯦꯠ ꯇꯧꯏ꯫margin
<input>s, <select>s, <textarea>s, ꯑꯃꯁꯨꯡ <button>s ꯑꯁꯤ ꯑꯌꯥꯝꯕꯅꯥ ꯅꯣꯔꯃꯦꯂꯥꯏꯖꯅꯥ ꯑꯦꯗ꯭ꯔꯦꯁ ꯇꯧꯏ, ꯑꯗꯨꯕꯨ ꯔꯤꯕꯣꯠꯅꯥ ꯃꯈꯣꯌꯒꯤ marginꯑꯃꯁꯨꯡ ꯁꯦꯠ ꯇꯧꯏ line-height: inherit, ꯁꯨ꯫
<textarea>s ꯑꯁꯤ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯔꯤꯁꯥꯏꯖ ꯇꯧꯕꯅꯥ ꯑꯌꯥꯝꯕꯅꯥ ꯄꯦꯖ ꯂꯦꯑꯥꯎꯠ “ꯕ꯭ꯔꯦꯛ” ꯇꯧꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯚꯔꯇꯤꯀꯦꯜ ꯑꯣꯏꯅꯥ ꯔꯤꯁꯥꯏꯖ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯈꯛꯇꯃꯛ ꯑꯣꯏꯅꯥ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯏ꯫
<button>ꯑꯦꯁ ꯑꯃꯁꯨꯡ <input>ꯕꯇꯟ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯅꯥ cursor: pointerꯃꯇꯝ :not(:disabled).

ꯑꯍꯣꯡꯕꯁꯤꯡ ꯑꯁꯤ, ꯑꯃꯁꯨꯡ ꯃꯁꯤꯗꯒꯤ ꯍꯦꯅꯕꯥ, ꯃꯈꯥꯗꯥ ꯎꯠꯂꯤ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯂꯤꯖꯦꯟꯗꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯏꯃꯦꯏꯜ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯇꯦꯂꯤꯐꯣꯟ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ url

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯅꯝꯕꯔ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯊꯤꯕꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯔꯦꯟꯖ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯐꯥꯏꯜ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯈꯅꯕꯤꯌꯨ꯫

ꯆꯦꯀꯕꯣꯛꯁ ꯑꯁꯤ ꯆꯦꯛ ꯇꯧꯔꯣ꯫

ꯑꯣꯄꯁꯟ ꯑꯃꯅꯥ ꯃꯁꯤ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯅꯤ꯫ ꯑꯣꯄꯁꯟ ꯑꯅꯤ ꯑꯁꯤ ꯑꯇꯣꯞꯄꯥ ꯋꯥꯐꯝ ꯑꯃꯅꯤ ꯃꯗꯨꯗꯤ ꯃꯁꯤꯒꯤ ꯐꯦꯟꯁꯤ ꯐꯣꯔꯝ ꯀꯟꯠꯔꯣꯂꯁꯤꯡ ꯑꯁꯤꯒꯤ ꯔꯦꯄꯤꯡ ꯑꯁꯤ ꯎꯠꯅꯕꯥꯁꯨ ꯁꯨꯄꯔ ꯂꯣꯡꯅꯤ꯫ ꯑꯣꯄꯁꯟ ꯑꯍꯨꯝ ꯑꯁꯤ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯦ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯇꯦꯛꯁꯇꯑꯦꯔꯤꯌꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯇꯥꯡ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯃꯇꯝ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯄꯥꯁꯋꯥꯔꯗ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯗꯦꯇꯇꯥꯏꯝ-ꯂꯣꯀꯦꯜ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯅꯨꯃꯤꯠ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯊꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯃꯆꯨ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯑꯥꯎꯇꯄꯨꯠ꯫ ꯱꯰꯰ ꯑꯣꯏꯈꯤ꯫

ꯇꯥꯡ & ꯃꯆꯨꯒꯤ ꯏꯅꯄꯨꯠ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

ꯋꯥꯈꯂꯗꯥ ꯊꯝꯃꯨ ꯗꯦꯠ ꯏꯅꯄꯨꯠꯁꯤꯡ ꯑꯁꯤ ꯕ꯭ꯔꯥꯎꯖꯔ ꯄꯨꯝꯅꯃꯛꯅꯥ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯗꯦ , ꯃꯗꯨꯗꯤ ꯁꯥꯐꯥꯔꯤꯅꯤ꯫

ꯕꯇꯅꯁꯤꯡꯗꯥ ꯄꯣꯏꯟꯇꯔꯁꯤꯡ꯫

ꯔꯤꯕꯣꯠ role="button"ꯇꯧꯕꯗꯥ ꯗꯤꯐꯣꯜꯇ ꯀꯔꯁꯔ ꯑꯗꯨ pointer. ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯑꯁꯤ ꯏꯟꯇꯔꯦꯛꯇꯤꯕ ꯑꯣꯏ ꯍꯥꯌꯕꯥ ꯇꯥꯀꯄꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯗꯥ ꯑꯦꯠꯔꯤꯕ꯭ꯌꯨꯠ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯃꯁꯤꯒꯤ ꯊꯧꯗꯥꯡ ꯑꯁꯤ <button>ꯏꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯃꯊꯧ ꯇꯥꯗꯦ, ꯃꯈꯣꯌꯅꯥ ꯃꯁꯥꯒꯤ ꯑꯣꯏꯕꯥ cursorꯑꯍꯣꯡꯕꯥ ꯑꯃꯥ ꯐꯪꯏ꯫

ꯅꯟ-ꯕꯇꯟ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯕꯇꯟ꯫

html ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯔꯤ꯫

<span role="button" tabindex="0">Non-button element button</span>

ꯃꯤꯁꯛ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ꯫

ꯂꯩꯐꯝ

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ <address>ꯕ꯭ꯔꯥꯎꯖꯔꯒꯤ ꯗꯤꯐꯣꯜꯇ font-styleꯑꯗꯨ . ꯑꯁꯤꯁꯨ ꯍꯧꯖꯤꯛ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯔꯦ, ꯑꯃꯁꯨꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫ s ꯑꯁꯤ ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯀꯄꯥ ꯏꯄꯥ-ꯏꯄꯨꯒꯤ (ꯅꯠꯠꯔꯒꯥ ꯊꯕꯛꯀꯤ ꯃꯄꯨꯡ ꯑꯣꯏꯕꯥ ꯕꯣꯗꯤ ꯑꯃꯒꯤ) ꯀꯟꯇꯦꯛꯇ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ ꯄꯤꯅꯕꯒꯤꯗꯃꯛꯇꯅꯤ꯫ ꯂꯣꯌꯅꯅꯥ ꯂꯥꯏꯅꯁꯤꯡ ꯂꯣꯏꯁꯤꯟꯗꯨꯅꯥ ꯐꯣꯔꯃꯦꯇꯤꯡ ꯉꯥꯛꯇꯨꯅꯥ ꯊꯝꯃꯨ .italicnormalline-heightmargin-bottom: 1rem<address><br>

ꯇ꯭ꯕꯤꯇꯔ, ꯏꯅꯛ
꯱꯳꯵꯵ ꯃꯥꯔꯀꯦꯠ ꯁꯦꯟꯇꯔ, ꯁꯨꯏꯠ ꯹꯰꯰
ꯁꯥꯟ ꯐ꯭ꯔꯥꯟꯁꯤꯁ꯭ꯀꯣ, ꯁꯤ.ꯑꯦ.꯹꯴꯱꯰꯳
ꯄꯤ: (꯱꯲꯳) ꯴꯵꯶-꯷꯸꯹꯰꯫

ꯃꯄꯨꯡ ꯐꯥꯕꯥ ꯃꯤꯡ
[email protected]

ꯕ꯭ꯂꯣꯀꯀꯣꯠ ꯇꯧꯕꯥ꯫

ꯕ꯭ꯂꯣꯀꯀꯣꯠꯁꯤꯡꯗꯥ ꯗꯤꯐꯣꯜꯇ marginꯑꯁꯤ 1em 40px, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯗꯨ 0 0 1remꯑꯇꯣꯞꯄꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯥ ꯍꯦꯟꯅꯥ ꯆꯨꯅꯕꯥ ꯋꯥꯐꯝ ꯑꯃꯒꯤꯗꯃꯛ ꯔꯤꯁꯦꯠ ꯇꯧꯏ꯫

ꯃꯃꯤꯡ ꯂꯩꯔꯕꯥ ꯀꯣꯠ ꯑꯃꯥ, ꯕ꯭ꯂꯣꯀꯀꯣꯠ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯗꯥ ꯌꯥꯑꯣꯕꯥ꯫

ꯁꯣꯔꯁ ꯇꯥꯏꯇꯂꯗꯥ ꯃꯃꯤꯡ ꯂꯩꯔꯕꯥ ꯀꯅꯥꯒꯨꯝꯕꯥ ꯑꯃꯅꯥ꯫

ꯏꯅꯂꯥꯏꯟ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤꯅꯥ <abbr>ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐ ꯇꯦꯛꯁꯀꯤ ꯃꯔꯛꯇꯥ ꯃꯁꯛ ꯊꯣꯀꯄꯥ ꯑꯣꯏꯍꯟꯅꯕꯥ ꯕꯦꯁꯤꯛ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯐꯪꯏ꯫

HTML ꯑꯦꯕꯕ꯭ꯔꯤꯕꯤꯌꯔ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ꯫

ꯁꯝꯂꯞꯄ ꯋꯥꯔꯣꯜ

cursorꯁꯣꯃꯥꯔꯤꯗꯥ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ text, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯗꯨ ꯔꯤꯁꯦꯠ pointerꯇꯧꯗꯨꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯀ꯭ꯂꯤꯛ ꯇꯧꯗꯨꯅꯥ ꯏꯟꯇꯔꯦꯛꯇ ꯇꯧꯕꯥ ꯌꯥꯏ ꯍꯥꯌꯕꯥ ꯐꯣꯡꯗꯣꯛꯅꯕꯥ꯫

ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯜ ꯈꯔꯥ꯫

ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ꯫

ꯃꯁꯤꯗꯒꯤꯁꯨ ꯍꯦꯟꯅꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡ꯫

ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯍꯦꯟꯅꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤ꯫

HTML5 `[hidden]`ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯂꯩ꯫

HTML5ꯅꯥ ꯑꯅꯧꯕꯥ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯃꯥ[hidden] ꯍꯥꯄꯆꯤꯜꯂꯤ , ꯃꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯁ꯭ꯇꯥꯏꯜ display: noneꯇꯧꯏ꯫ PureCSS ꯗꯒꯤ ꯋꯥꯈꯜꯂꯣꯟ ꯑꯃꯥ ꯂꯧꯗꯨꯅꯥ , ꯑꯩꯈꯣꯌꯅꯥ ꯃꯁꯤꯒꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯁꯤ ꯑꯁꯣꯌꯕꯥ ꯂꯩꯇꯅꯥ ꯑꯣꯚꯔꯔꯥꯏꯗ [hidden] { display: none !important; }ꯇꯧꯗꯅꯕꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯁꯦꯃꯗꯨꯅꯥ ꯐꯒꯠꯍꯜꯂꯤ꯫display

<input type="text" hidden>

jQuery ꯏꯅꯀꯃꯄꯦꯇꯤꯕꯤꯂꯤꯇꯤ ꯂꯩꯕꯥ꯫

[hidden]$(...).hide()jQuery's ꯑꯃꯁꯨꯡ $(...).show()ꯃꯦꯊꯗꯁꯤꯡꯒꯥ ꯀꯣꯟꯅꯅꯥ ꯆꯠꯅꯕꯥ ꯌꯥꯗꯦ꯫ ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯛ ꯃꯔꯨꯑꯣꯏꯅꯥ ꯏꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤ [hidden]ꯃꯦꯅꯦꯖ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯑꯇꯣꯞꯄꯥ ꯇꯦꯛꯅꯤꯀꯁꯤꯡꯒꯤ ꯃꯊꯛꯇꯥ ꯑꯦꯟꯗꯣꯔꯁ ꯇꯧꯗꯦ꯫display

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

ꯔꯤꯕꯨꯠ ꯇꯧꯕꯥ꯫

ꯊꯧꯑꯣꯡ

ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ꯫

ꯄꯦꯖ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏ꯫

ꯅꯦꯇꯤꯕ ꯐꯣꯟꯇ ꯁ꯭ꯇꯦꯛ ꯇꯧꯕꯥ꯫

ꯍꯦꯗꯤꯡ ꯑꯃꯁꯨꯡ ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐꯁꯤꯡ꯫

ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯔꯨꯂꯁꯤꯡ꯫

ꯂꯤꯁ꯭ꯇꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

ꯏꯅꯂꯥꯏꯟ ꯀꯣꯗ꯫

ꯀꯣꯗ ꯕ꯭ꯂꯣꯛ ꯇꯧꯕꯥ꯫

ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ꯫

ꯌꯨꯖꯔ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯁꯦꯝꯄꯜ ꯑꯥꯎꯇꯄꯨꯠ꯫

ꯇꯦꯕꯂꯁꯤꯡ꯫

ꯐꯣꯔꯃꯁꯤꯡ꯫

ꯇꯥꯡ & ꯃꯆꯨꯒꯤ ꯏꯅꯄꯨꯠ ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

ꯕꯇꯅꯁꯤꯡꯗꯥ ꯄꯣꯏꯟꯇꯔꯁꯤꯡ꯫

ꯃꯤꯁꯛ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ꯫

ꯂꯩꯐꯝ

ꯕ꯭ꯂꯣꯀꯀꯣꯠ ꯇꯧꯕꯥ꯫

ꯏꯅꯂꯥꯏꯟ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ꯫

ꯁꯝꯂꯞꯄ ꯋꯥꯔꯣꯜ

HTML5 [hidden]ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯂꯩ꯫

jQuery ꯏꯅꯀꯃꯄꯦꯇꯤꯕꯤꯂꯤꯇꯤ ꯂꯩꯕꯥ꯫

HTML5 `[hidden]`ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯂꯩ꯫