ꯄꯨꯋꯥꯔꯤ

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

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

dev.twitter.com ꯗꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯄꯥꯕꯤꯌꯨ ›

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

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

• ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯧꯕꯥ ꯁꯐꯔꯤ꯫
• ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯧꯕꯥ ꯒꯨꯒꯜ ꯀ꯭ꯔꯣꯝ꯫
• ꯐꯥꯏꯔꯐꯛꯁ ꯴+ ꯂꯩ꯫
• ꯏꯟꯇꯔꯅꯦꯠ ꯑꯦꯛꯁꯞꯂꯣꯔꯥꯔ ꯷+ ꯂꯩ꯫

ꯌꯥꯑꯣꯔꯤꯕꯥ ꯑꯗꯨ ꯀꯔꯤꯅꯣ꯫

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

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

ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯕꯥ ꯒ꯭ꯔꯤꯗ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯔꯨꯛ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯄꯤꯔꯤꯕꯥ ꯗꯤꯐꯣꯜꯇ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ ꯑꯁꯤ 940px ꯋꯥꯏꯗ 16-ꯀꯣꯂꯝ ꯒ꯭ꯔꯤꯗ ꯑꯃꯅꯤ꯫ ꯃꯁꯤ ꯃꯤꯌꯥꯝꯅꯥ ꯄꯥꯝꯅꯕꯥ ꯹꯶꯰ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯃꯒꯤ ꯃꯁꯛ ꯑꯃꯅꯤ, ꯑꯗꯨꯕꯨ ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯑꯃꯁꯨꯡ ꯑꯔꯣꯏꯕꯥ ꯃꯐꯃꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯃꯥꯔꯖꯤꯟ/ꯄꯦꯗꯤꯡ ꯌꯥꯑꯣꯗꯅꯥ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ ꯒ꯭ꯔꯤꯗ ꯃꯥꯔꯀꯑꯥꯞ꯫

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

<div ꯀ꯭ꯂꯥꯁ="ꯔꯣ"> ꯍꯥꯌꯅꯥ ꯈꯉꯅꯩ꯫ class = "ꯔꯣ" >꯫
  <div class = "ꯁ꯭ꯄꯦꯅ꯶ ꯀꯂꯃꯁꯤꯡ" > 
    ...
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  <div class = "ꯁ꯭ꯄꯦꯅ꯱꯰ ꯀꯂꯃꯁꯤꯡ" > 
    ...
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯐꯤꯛꯁ ꯇꯧꯔꯕꯥ ꯂꯦꯑꯥꯎꯠ꯫

ꯆꯥꯎꯔꯥꯛꯅꯥ ꯁꯥꯏꯠ ꯅꯠꯠꯔꯒꯥ ꯄꯦꯖ ꯑꯃꯍꯦꯛꯇꯒꯤ ꯑꯣꯏꯅꯥ ꯕꯦꯁꯤꯛ 940px ꯄꯥꯀꯄꯥ, ꯁꯦꯟꯇꯔ ꯇꯧꯕꯥ ꯀꯟꯇꯦꯅꯔ ꯂꯦꯑꯥꯎꯠ ꯑꯃꯥ꯫

<ꯍꯀꯆꯥꯡ>꯫
  <div ꯀ꯭ꯂꯥꯁ = "ꯀꯟꯇꯦꯅꯔ" > 
    ...
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</body>ꯒꯤ ꯃꯇꯥꯡꯗꯥ

ꯐ꯭ꯂꯨꯏꯗ ꯂꯦꯑꯥꯎꯠ ꯇꯧꯕꯥ꯫

ꯃꯤꯟ- ꯑꯃꯁꯨꯡ ꯃꯦꯛꯁ-ꯋꯥꯏꯗ ꯑꯃꯁꯨꯡ ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯁꯥꯏꯗꯕꯥꯔ ꯑꯃꯥ ꯂꯩꯕꯥ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯐ꯭ꯂꯨꯏꯗ ꯅꯠꯠꯔꯒꯥ ꯂꯤꯛꯌꯨꯏꯗ ꯄꯦꯖ ꯁ꯭ꯠꯔꯀꯆꯔ ꯑꯃꯥ꯫ ꯑꯦꯄꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯆꯧꯕꯥ꯫

<ꯍꯀꯆꯥꯡ>꯫
  <div class = "ꯀꯟꯇꯦꯅꯔ-ꯐ꯭ꯂꯨꯏꯗ" > 
    <div ꯀ꯭ꯂꯥꯁ = "ꯁꯥꯏꯗꯕꯥꯔ" > ꯫ 
      ...
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
    <div ꯀ꯭ꯂꯥꯁ = "ꯀꯟꯇꯦꯟꯇ" > 
      ...
    </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
  </div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫
</body>ꯒꯤ ꯃꯇꯥꯡꯗꯥ

ꯍꯦꯗꯤꯡꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯀꯣꯄꯤꯁꯤꯡ꯫

ꯅꯍꯥꯛꯀꯤ ꯋꯦꯕꯄꯦꯖꯁꯤꯡ ꯁ꯭ꯠꯔꯀꯆꯔ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯁ꯭ꯇꯦꯟꯗꯔꯗ ꯇꯥꯏꯄꯣꯒ꯭ꯔꯥꯐꯤꯛ ꯍꯥꯏꯔꯔꯀꯤ ꯑꯃꯥ꯫

ꯑꯩꯆ.꯱. ꯍꯦꯗꯤꯡ ꯱

h꯲. ꯍꯦꯗꯤꯡ ꯲

ꯑꯩꯆ꯳. ꯍꯦꯗꯤꯡ ꯳

ꯑꯩꯆ꯴. ꯍꯦꯗꯤꯡ ꯴

h꯵. ꯍꯦꯗꯤꯡ ꯵

ꯑꯩꯆ꯶. ꯍꯦꯗꯤꯡ ꯶

ꯈꯨꯗꯝ ꯑꯣꯏꯕꯥ ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐ꯫

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

ꯈꯨꯗꯝ ꯑꯣꯏꯕꯥ ꯍꯦꯗꯤꯡ ꯁꯕ-ꯍꯦꯗꯤꯡ ꯂꯩ...

ꯃꯤꯁꯛ ꯑꯣꯏꯕꯥ꯫ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

ꯑꯦꯝꯄꯥꯁꯤꯁ, ꯑꯦꯗ꯭ꯔꯦꯁ, & ꯑꯦꯕꯕ꯭ꯔꯤꯕꯤꯌꯔꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ꯫

<strong> <em> <address> <abbr>

ꯀꯗꯥꯏꯗꯥ ꯁꯤꯖꯤꯟꯅꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ꯫

ꯋꯥꯍꯩ ꯅꯠꯠꯔꯒꯥ ꯋꯥꯍꯩ ꯄꯔꯦꯡ ꯑꯃꯒꯤ ꯑꯀꯣꯌꯕꯗꯥ ꯂꯩꯔꯤꯕꯥ ꯀꯣꯄꯤ ꯑꯗꯨꯒꯥ ꯆꯥꯡꯗꯝꯅꯕꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯃꯤꯠꯌꯦꯡ ꯊꯝꯕꯥ ꯑꯗꯨ ꯇꯥꯛꯅꯕꯥ ꯑꯦꯝꯐꯦꯁꯤꯁ ꯇꯦꯒꯁꯤꯡ ( <strong>ꯑꯃꯁꯨꯡ <em>) ꯁꯤꯖꯤꯟꯅꯒꯗꯕꯅꯤ꯫ <strong>ꯃꯔꯨꯑꯣꯏꯕꯒꯤꯗꯃꯛ ꯑꯃꯁꯨꯡ ꯁ꯭ꯠꯔꯦꯁ ꯏꯝꯄꯦꯁ <em>ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐ ꯑꯃꯗꯥ ꯑꯀꯅꯕꯥ ꯋꯥꯐꯝ ꯊꯝꯕꯥ꯫

ꯐꯨꯁꯁꯦ ꯗꯥꯄꯤꯕꯁ , ꯇꯦꯂꯁ ꯑꯦ.ꯁꯤ . ꯃꯦꯁꯦꯅꯥꯁ ꯐꯧꯁꯤꯕꯁ ꯃꯣꯂꯤꯁ ꯏꯟꯇꯔꯗꯝ꯫ ꯅꯨꯜꯂꯥ ꯚꯤꯇꯥꯏ ꯏꯂꯤꯠ ꯂꯤꯕꯦꯔꯣ, ꯑꯦ ꯐꯥꯔꯦꯠꯔꯥ ꯑꯣꯒ꯫

ꯅꯣꯠ:<b> HTML5ꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯇꯦꯒꯁꯤꯡ ꯑꯁꯤ ꯍꯧꯖꯤꯀꯁꯨ ꯑꯐꯕꯥ ꯑꯣꯏꯔꯤ <i>, ꯑꯗꯨꯕꯨ ꯃꯈꯣꯌ ꯑꯁꯤ ꯍꯧꯖꯤꯛꯇꯤ ꯃꯍꯧꯁꯥꯒꯤ ꯑꯣꯏꯕꯥ ꯃꯑꯣꯡꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯂꯥꯀꯄꯥ ꯅꯠꯇꯦ꯫ <b>ꯍꯥꯌꯕꯁꯤ ꯑꯍꯦꯅꯕꯥ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯄꯤꯗꯅꯥ ꯋꯥꯍꯩ ꯅꯠꯠꯔꯒꯥ ꯋꯥꯍꯩ ꯄꯔꯦꯡꯁꯤꯡ ꯐꯣꯡꯗꯣꯛꯅꯕꯥ ꯍꯥꯌꯕꯅꯤ, ꯑꯗꯨꯒꯥ <i>ꯑꯌꯥꯝꯕꯅꯥ ꯈꯣꯟꯖꯦꯜ, ꯇꯦꯛꯅꯤꯀꯦꯜ ꯇꯔꯃꯁꯤꯡ ꯑꯁꯤꯅꯆꯤꯡꯕꯒꯤꯗꯃꯛꯇꯅꯤ꯫

ꯑꯦꯗ꯭ꯔꯦꯁꯁꯤꯡ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ ꯃꯁꯤꯒꯤ <address>ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯀꯄꯥ ꯏꯄꯥ-ꯏꯄꯨꯒꯤꯗꯃꯛ, ꯅꯠꯠꯔꯒꯥ ꯊꯕꯛꯀꯤ ꯍꯀꯆꯥꯡ ꯄꯨꯝꯅꯃꯛꯀꯤ ꯀꯟꯇꯦꯛꯇ ꯏꯅꯐꯣꯔꯃꯦꯁꯅꯒꯤꯗꯃꯛꯇꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤ ꯀꯔꯝꯅꯥ ꯑꯣꯏꯒꯅꯤ:

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

ꯅꯣꯠ: ꯑꯃꯗꯥ ꯂꯩꯕꯥ ꯂꯥꯏꯟ ꯈꯨꯗꯤꯡꯃꯛ ꯂꯥꯏꯟ <address>-ꯕ꯭ꯔꯦꯛ ( ) ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯂꯣꯏꯁꯤꯅꯒꯗꯕꯅꯤ ꯅꯠꯠꯔꯒꯥ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯃꯑꯣꯡ ꯆꯨꯝꯅꯥ ꯁ꯭ꯠꯔꯀꯆꯔ ꯇꯧꯅꯕꯥ <br />ꯕ꯭ꯂꯣꯛ-ꯂꯦꯚꯦꯜ ꯇꯦꯒ ꯑꯃꯗꯥ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ) ꯂꯣꯠꯁꯤꯅꯒꯗꯕꯅꯤ꯫<p>

ꯑꯦꯕꯕ꯭ꯔꯤꯕꯤꯌꯔꯁꯤꯡ꯫

ꯑꯦꯕꯕ꯭ꯔꯤꯕꯤꯌꯔ ꯑꯃꯁꯨꯡ ꯑꯦꯛꯔꯣꯅꯤꯃꯒꯤꯗꯃꯛ, <abbr>ꯇꯦꯒ ꯁꯤꯖꯤꯟꯅꯧ ( HTML5<acronym> ꯗꯥ ꯁꯤꯖꯤꯟꯅꯗ꯭ꯔꯤ )꯫ ꯇꯦꯒ ꯑꯗꯨꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯁꯣꯔꯇꯍꯦꯟꯗ ꯐꯣꯔꯝ ꯑꯗꯨ ꯊꯝꯃꯨ ꯑꯃꯁꯨꯡ ꯃꯄꯨꯡꯐꯥꯕꯥ ꯃꯃꯤꯡ ꯑꯗꯨꯒꯤꯗꯃꯛ ꯇꯥꯏꯇꯜ ꯑꯃꯥ ꯁꯦꯠ ꯇꯧ꯫

ꯕ꯭ꯂꯣꯀꯀꯣꯇꯁꯤꯡ꯫

<blockquote> <p> <small>

ꯃꯇꯧ ꯀꯔꯝꯅꯥ ꯀꯣꯠ ꯇꯧꯒꯗꯒꯦ꯫

ꯕ꯭ꯂꯣꯀꯀꯣꯠ ꯑꯃꯥ ꯌꯥꯑꯣꯍꯟꯅꯕꯥ, ꯔꯦꯞ <blockquote>ꯇꯧꯕꯥ <p>ꯑꯃꯁꯨꯡ <small>ꯇꯦꯒ ꯇꯧꯕꯥ꯫ ꯅꯍꯥꯛꯀꯤ ꯁꯣꯔꯁ ꯑꯗꯨ ꯄꯅꯅꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯧ ꯑꯃꯁꯨꯡ ꯃꯗꯨꯒꯤ ꯃꯃꯥꯡꯗꯥ <small>ꯅꯍꯥꯛꯅꯥ ꯏꯝ ꯗꯦꯁ ꯑꯃꯥ ꯐꯪꯒꯅꯤ꯫—

ꯂꯣꯔꯦꯝ ꯏꯄꯁꯝ ꯗꯣꯂꯣꯔ ꯁꯤꯠ ꯑꯦꯃꯦꯠ, ꯀꯟꯁꯦꯛꯇꯦꯇꯨꯔ ꯑꯦꯗꯤꯄꯤꯁꯤꯡ ꯏꯂꯤꯠ꯫ ꯏꯟꯇꯤꯖꯔ ꯄꯣꯁꯨꯑꯦꯔꯦ ꯑꯦꯔꯥꯠ ꯑꯦ ꯑꯦꯟꯇꯦ ꯚꯦꯅꯦꯅꯥꯇꯤꯁ ꯗꯥꯄꯤꯕꯁ ꯄꯣꯁꯨꯑꯦꯔꯦ ꯚꯦꯂꯤꯠ ꯑꯦꯂꯤꯀꯦꯠ꯫

ꯖꯨꯂꯤꯌꯁ ꯍꯤꯕꯔꯇꯅꯥ ꯗꯥ

ꯑꯅꯑꯣꯔꯗꯔ ꯇꯧꯕꯥ꯫<ul>

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

ꯑꯅꯁ꯭ꯇꯥꯏꯜ ꯇꯧꯕꯥ꯫<ul.unstyled>

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

ꯑꯣꯔꯗꯔ ꯇꯧꯈ꯭ꯔꯦ꯫<ol>

1. ꯂꯣꯔꯦꯝ ꯏꯄꯁꯨꯝ ꯗꯣꯂꯣꯔ ꯁꯤꯠ ꯑꯥꯃꯦꯠ꯫
2. ꯀꯟꯁꯦꯛꯇꯇꯨꯔ ꯑꯦꯗꯤꯄꯤꯁꯤꯡ ꯏꯂꯤꯠ꯫
3. ꯏꯟꯇꯤꯖꯔ ꯃꯣꯂꯦꯁ꯭ꯇꯤ ꯂꯣꯔꯦꯝ ꯑꯦꯠ ꯃꯥꯁꯥ꯫
4. ꯄ꯭ꯔꯦꯇꯤꯌꯝ ꯅꯤꯁꯜ ꯑꯦꯂꯤꯀꯦꯠꯇꯥ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ꯫
5. ꯅꯨꯜꯂꯥ ꯚꯣꯂꯨꯠꯄꯠ ꯑꯦꯂꯤꯛꯌꯨꯝ ꯚꯦꯂꯤꯠ꯫
6. ꯐꯧꯁꯤꯕꯁ ꯄꯣꯔꯇꯥ ꯂꯦꯀꯁ ꯐ꯭ꯔꯤꯟꯖꯤꯂꯥ ꯚꯦꯜ꯫
7. ꯑꯦꯅꯤꯌꯟ ꯁꯤꯠ ꯑꯥꯃꯦꯠ ꯑꯦꯔꯥꯠ ꯅꯟꯛ꯫
8. ꯑꯦꯒꯦꯠ ꯄꯣꯔꯇꯤꯇꯣꯔ ꯂꯣꯔꯦꯝ꯫

ꯋꯥꯔꯣꯜdl

ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯇꯁꯤꯡ꯫

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

ꯏꯎꯏꯁꯃꯣꯗ꯫

ꯚꯦꯁ꯭ꯇꯤꯕꯨꯂꯝ ꯑꯥꯏꯗꯤ ꯂꯤꯒꯨꯂꯥ ꯄꯣꯔꯇꯥ ꯐꯦꯂꯤꯁ ꯏꯎꯏꯁꯃꯣꯗ ꯁꯦꯝꯄꯔ ꯑꯦꯒꯦꯠ ꯂꯦꯁꯤꯅꯤꯌꯥ ꯑꯣꯗꯤꯑꯣ ꯁꯦꯝ ꯅꯦꯛ ꯏꯂꯤꯠ꯫

ꯗꯣꯅꯦꯛ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ ꯅꯟ ꯃꯤ ꯄꯣꯔꯇꯥ ꯒ꯭ꯔꯦꯚꯤꯗꯥ ꯑꯦꯠ ꯑꯦꯒꯦꯠ ꯃꯦꯇꯁ꯫

ꯃꯥꯂꯦꯁꯨꯌꯥꯗꯥ ꯄꯣꯔꯇꯥ꯫

ꯏꯇꯤꯌꯥꯝ ꯄꯣꯔꯇꯥ ꯁꯦꯝ ꯃꯥꯂꯦꯁꯨꯌꯥꯗꯥ ꯃꯒꯅꯥ ꯃꯣꯂꯤꯁ ꯏꯎꯏꯁꯃꯣꯗ꯫

ꯇꯦꯕꯂꯁꯤꯡ ꯁꯥꯕꯥ꯫

<table> <thead> <tbody> <tr> <th> <td> <colspan> <caption>

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

ꯃꯇꯝ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯅꯍꯥꯛꯀꯤ ꯀꯣꯂꯝ ꯍꯦꯗꯁꯤꯡ <thead>ꯑꯗꯨ ꯍꯥꯏꯔꯔꯀꯤ ꯑꯁꯤ <thead>> <tr>> ꯑꯣꯏꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯔꯦꯞ <th>ꯇꯧꯕꯤꯌꯨ꯫

ꯀꯣꯂꯝ ꯍꯦꯗꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯅꯥ, ꯅꯍꯥꯛꯀꯤ ꯇꯦꯕꯂꯒꯤ ꯍꯀꯆꯥꯡꯒꯤ ꯀꯟꯇꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯑꯦꯗꯥ ꯔꯦꯞ ꯇꯧꯒꯗꯕꯅꯤ <tbody>ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯍꯥꯏꯔꯔꯀꯤ ꯑꯁꯤ <tbody>> <tr>> <td>.

ꯈꯨꯗꯝ: ꯗꯤꯐꯣꯜꯇ ꯇꯦꯕꯜ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ꯫

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

#	ꯑꯍꯥꯟꯕ ꯃꯤꯡ	ꯑꯀꯣꯟꯕ ꯃꯤꯡ	ꯂꯣꯜ
꯱	ꯈꯔ	ꯑꯃ	ꯍꯪꯂꯤꯁ
꯲	ꯖꯣꯏ ꯍꯥꯌꯅꯥ ꯀꯧꯏ꯫	ꯁꯤꯛꯁꯄꯦꯛ ꯇꯧꯕꯥ꯫	ꯍꯪꯂꯤꯁ
꯳	ꯁ꯭ꯇꯨ	ꯗꯦꯟꯇ ꯇꯧꯕꯥ꯫	ꯀꯣꯗ ꯇꯧꯕꯥ꯫

<ꯇꯦꯕꯜ ꯀ꯭ꯂꯥꯁ="ꯀꯃꯟ-ꯇꯦꯕꯜ">꯫ class = "ꯀꯃꯟ-ꯇꯦꯕꯜ" >
  ...
</ꯇꯦꯕꯜ>ꯗꯥ ꯌꯥꯑꯣꯔꯤ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ: ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯞ ꯇꯧꯕꯥ꯫

ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯄꯤꯡ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯇꯦꯕꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯈꯔꯥ ꯐꯦꯟꯁꯤ ꯑꯣꯏꯌꯨ— .zebra-stripedꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯈꯛꯇꯃꯛ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫

#	ꯑꯍꯥꯟꯕ ꯃꯤꯡ	ꯑꯀꯣꯟꯕ ꯃꯤꯡ	ꯂꯣꯜ
꯱	ꯈꯔ	ꯑꯃ	ꯍꯪꯂꯤꯁ
꯲	ꯖꯣꯏ ꯍꯥꯌꯅꯥ ꯀꯧꯏ꯫	ꯁꯤꯛꯁꯄꯦꯛ ꯇꯧꯕꯥ꯫	ꯍꯪꯂꯤꯁ
꯳	ꯁ꯭ꯇꯨ	ꯗꯦꯟꯇ ꯇꯧꯕꯥ꯫	ꯀꯣꯗ ꯇꯧꯕꯥ꯫

ꯈꯪꯖꯤꯅꯒꯗꯕꯥ: ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯄꯤꯡ ꯑꯁꯤ IE8 ꯑꯃꯁꯨꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯔꯤꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯐꯪꯗꯕꯥ ꯄ꯭ꯔꯣꯒ꯭ꯔꯦꯁꯤꯚ ꯑꯦꯅꯍꯥꯟꯁꯃꯦꯟꯇ ꯑꯃꯅꯤ꯫

<table class="ꯀꯃꯟ-ꯇꯦꯕꯜ ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯞ ꯇꯧꯕꯥ"> class = "ꯀꯃꯟ-ꯇꯦꯕꯜ ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯞ" >
...
</ꯇꯦꯕꯜ>ꯗꯥ ꯌꯥꯑꯣꯔꯤ꯫

ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ: ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯞ w/ TableSorter.js

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

#	ꯑꯍꯥꯟꯕ ꯃꯤꯡ	ꯑꯀꯣꯟꯕ ꯃꯤꯡ	ꯂꯣꯜ
꯱	ꯑꯗꯣꯝꯒꯤ	ꯑꯃ	ꯍꯪꯂꯤꯁ
꯲	ꯖꯣꯏ ꯍꯥꯌꯅꯥ ꯀꯧꯏ꯫	ꯁꯤꯛꯁꯄꯦꯛ ꯇꯧꯕꯥ꯫	ꯍꯪꯂꯤꯁ
꯳	ꯁ꯭ꯇꯨ	ꯗꯦꯟꯇ ꯇꯧꯕꯥ꯫	ꯀꯣꯗ ꯇꯧꯕꯥ꯫

<ꯁ꯭ꯛꯔꯤꯞꯇ src="js/jquery/jquery.ꯇꯦꯕꯂꯁꯣꯔꯇꯔ.ꯃꯤꯟ.ꯖꯦꯁ"></ꯁ꯭ꯛꯔꯤꯞꯇ>꯫ src = "js/jquery/jquery.ꯇꯦꯕꯂꯁꯣꯔꯇꯔ.ꯃꯤꯟ.ꯖꯦꯁ" ></ꯁ꯭ꯛꯔꯤꯞꯇ> ꯫
<ꯁ꯭ꯛꯔꯤꯞꯇ > ꯍꯥꯌꯕꯁꯤꯅꯤ꯫ 
  $ ( ꯐꯉ꯭ꯀꯁꯟ () { . 
    $ ( "ꯇꯦꯕꯜ#ꯁꯣꯔꯠꯇꯦꯕꯂꯒꯤ ꯈꯨꯗꯝ" ). ꯇꯦꯕꯂꯁꯣꯔꯇꯔ ({ ꯁꯣꯔꯇꯂꯤꯁ꯭ꯠ : [[ 1 , 0 ]] });  
  });
</script>ꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄꯤꯈꯤ꯫
<ꯇꯦꯕꯜ ꯀ꯭ꯂꯥꯁ = "ꯀꯃꯟ-ꯇꯦꯕꯜ ꯖꯦꯕ꯭ꯔꯥ-ꯁ꯭ꯠꯔꯥꯏꯞ" > 
  ...
</ꯇꯦꯕꯜ>ꯗꯥ ꯌꯥꯑꯣꯔꯤ꯫

ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯕꯥ ꯃꯑꯣꯡꯁꯤꯡ꯫

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

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

ꯑꯦꯛꯁ-ꯂꯥꯔꯖ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯈꯟꯕ

꯱ ꯲ ꯳ ꯴ ꯵

ꯈꯟꯕ

꯱ ꯲ ꯳ ꯴ ꯵

ꯑꯦꯗꯤꯠ ꯇꯧꯕꯥ ꯌꯥꯗꯕꯥ ꯏꯅꯄꯨꯠ꯫

ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯈꯔꯥ ꯚꯦꯜꯌꯨ ꯂꯩ꯫

ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯕꯥ ꯏꯅꯄꯨꯠ꯫

ꯑꯦꯛꯁ-ꯂꯥꯔꯖ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯍꯦꯜꯄ ꯇꯦꯛꯁꯇꯀꯤ ꯑꯄꯤꯀꯄꯥ ꯁ꯭ꯅꯤꯄꯦꯠ꯫

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

ꯄ꯭ꯔꯤꯄꯦꯟꯗ ꯇꯧꯔꯕꯥ ꯇꯦꯛꯁꯠ꯫

@

ꯄ꯭ꯔꯤꯄꯦꯟꯗ ꯇꯧꯔꯕꯥ ꯆꯦꯀꯕꯣꯛꯁ꯫

ꯑꯦꯄꯦꯟꯗꯤꯛꯁ ꯇꯧꯔꯕꯥ ꯆꯦꯀꯕꯣꯛꯁ꯫

ꯐꯥꯏꯜ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

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

ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤ ꯂꯤꯁ꯭ꯠ꯫

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

ꯈꯪꯖꯤꯅꯒꯗꯕꯥ: ꯂꯦꯕꯦꯂꯁꯤꯡꯅꯥ ꯌꯥꯝꯅꯥ ꯆꯥꯎꯕꯥ ꯀ꯭ꯂꯤꯛ ꯑꯦꯔꯤꯌꯥꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯕꯥ ꯐꯣꯔꯝ ꯑꯃꯒꯤ ꯑꯣꯄꯁꯟ ꯄꯨꯝꯅꯃꯛ ꯀꯨꯄꯁꯤꯜꯂꯤ꯫

ꯇꯥꯡꯒꯤ ꯔꯦꯟꯖ꯫

ꯇꯨ ꯃꯇꯝ ꯄꯨꯝꯅꯃꯛ ꯑꯁꯤ ꯄꯦꯁꯤꯐꯤꯛ ꯁ꯭ꯇꯦꯟꯗꯔꯗ ꯇꯥꯏꯝ (GMT -08:00) ꯍꯥꯌꯅꯥ ꯎꯠꯂꯤ꯫

ꯇꯦꯛꯁꯇꯥꯏꯜ ꯑꯦꯔꯤꯌꯥ꯫

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

ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤ ꯂꯤꯁ꯭ꯠ꯫

• ꯑꯣꯄꯁꯟ ꯑꯃꯅꯥ ꯃꯁꯤ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯅꯤ—ꯃꯁꯤ ꯀꯔꯤꯒꯤꯗꯃꯛꯇꯥ ꯑꯆꯧꯕꯥ ꯑꯣꯏꯔꯤꯕꯅꯣ ꯍꯥꯌꯕꯗꯨ ꯁꯣꯏꯗꯅꯥ ꯌꯥꯑꯣꯍꯅꯕꯤꯌꯨ꯫
• ꯑꯣꯄꯁꯟ ꯑꯅꯤ ꯑꯁꯤꯁꯨ ꯆꯦꯛ ꯇꯧꯕꯥ ꯌꯥꯏ ꯑꯃꯁꯨꯡ ꯐꯣꯔꯝ ꯔꯤꯖꯜꯇꯁꯤꯡꯗꯥ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯌꯥꯏ꯫

ꯑꯍꯣꯡꯕꯁꯤꯡ ꯁꯦꯚ ꯇꯧꯕꯥ꯫  ꯀꯛꯄ

ꯁ꯭ꯇꯦꯛ ꯇꯧꯔꯕꯥ ꯐꯣꯔꯃꯁꯤꯡ꯫

ꯅꯍꯥꯛꯀꯤ ꯐꯣꯔꯃꯒꯤ HTML ꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ .form-stackedꯑꯃꯁꯨꯡ ꯃꯈꯣꯌꯒꯤ ꯐꯤꯜꯗꯁꯤꯡꯒꯤ ꯃꯊꯛꯇꯥ ꯃꯈꯣꯌꯒꯤ ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯑꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯂꯦꯕꯦꯂꯁꯤꯡ ꯂꯩꯒꯅꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯀꯤ ꯐꯣꯔꯃꯁꯤꯡ ꯑꯗꯨ ꯁꯣꯔꯠ ꯑꯣꯏꯔꯕꯗꯤ ꯅꯠꯠꯔꯒꯥ ꯅꯍꯥꯛꯅꯥ ꯍꯦꯟꯅꯥ ꯂꯨꯕꯥ ꯐꯣꯔꯃꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯏꯅꯄꯨꯠꯁꯤꯡꯒꯤ ꯀꯣꯂꯝ ꯑꯅꯤ ꯂꯩꯔꯕꯗꯤ ꯃꯁꯤꯅꯥ ꯑꯆꯧꯕꯥ ꯊꯕꯛ ꯇꯧꯏ꯫

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

ꯑꯦꯛꯁ-ꯂꯥꯔꯖ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯈꯟꯕ

꯱ ꯲ ꯳ ꯴ ꯵

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

ꯑꯦꯛꯁ-ꯂꯥꯔꯖ ꯏꯅꯄꯨꯠ ꯇꯧꯕꯥ꯫

ꯍꯦꯜꯄ ꯇꯦꯛꯁꯇꯀꯤ ꯑꯄꯤꯀꯄꯥ ꯁ꯭ꯅꯤꯄꯦꯠ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡꯒꯤ ꯂꯤꯁ꯭ꯠ꯫

• ꯑꯣꯄꯁꯟ ꯑꯃꯅꯥ ꯃꯁꯤ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯅꯤ—ꯃꯁꯤ ꯀꯔꯤꯒꯤꯗꯃꯛꯇꯥ ꯑꯆꯧꯕꯥ ꯑꯣꯏꯔꯤꯕꯅꯣ ꯍꯥꯌꯕꯗꯨ ꯁꯣꯏꯗꯅꯥ ꯌꯥꯑꯣꯍꯅꯕꯤꯌꯨ꯫
• ꯑꯣꯄꯁꯟ ꯑꯅꯤ ꯑꯁꯤꯁꯨ ꯆꯦꯛ ꯇꯧꯕꯥ ꯌꯥꯏ ꯑꯃꯁꯨꯡ ꯐꯣꯔꯝ ꯔꯤꯖꯜꯇꯁꯤꯡꯗꯥ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯌꯥꯏ꯫

ꯈꯪꯖꯤꯅꯒꯗꯕꯥ: ꯂꯦꯕꯦꯂꯁꯤꯡꯅꯥ ꯌꯥꯝꯅꯥ ꯆꯥꯎꯕꯥ ꯀ꯭ꯂꯤꯛ ꯑꯦꯔꯤꯌꯥꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯕꯥ ꯐꯣꯔꯝ ꯑꯃꯒꯤ ꯑꯣꯄꯁꯟ ꯄꯨꯝꯅꯃꯛ ꯀꯨꯄꯁꯤꯜꯂꯤ꯫

ꯑꯍꯣꯡꯕꯁꯤꯡ ꯁꯦꯚ ꯇꯧꯕꯥ꯫  ꯀꯛꯄ

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

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

ꯕꯇꯟ ꯄꯨꯝꯅꯃꯛ ꯂꯥꯏꯠ ꯒ꯭ꯔꯦ ꯁ꯭ꯇꯥꯏꯂꯗꯥ ꯗꯤꯐꯣꯜꯇ ꯇꯧꯏ, ꯑꯗꯨꯕꯨ ꯕ꯭ꯂꯨ .primaryꯀ꯭ꯂꯥꯁ ꯑꯃꯥ ꯂꯩ꯫ ꯄ꯭ꯂꯥꯁ, ꯅꯍꯥꯛꯀꯤ ꯏꯁꯥꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯔꯣꯜ ꯇꯧꯕꯥ ꯑꯁꯤ ꯐꯖꯅꯥ ꯄꯤꯖꯩ꯫

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

ꯕꯇꯟ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯑꯁꯤ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯔꯕꯥ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯑꯃꯠꯇꯥꯗꯥ .btnꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯃꯍꯧꯁꯥꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯍꯥꯌꯔꯤꯕꯁꯤꯡ ꯑꯁꯤ <a>, <button>, ꯑꯃꯁꯨꯡ ꯈꯅꯒꯠꯂꯕꯥ <input>ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯈꯛꯇꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯕꯥ ꯄꯥꯝꯂꯒꯅꯤ꯫ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤ ꯀꯔꯝꯅꯥ ꯑꯣꯏꯒꯅꯤ:

ꯑꯂꯇꯔꯅꯦꯇꯤꯕ ꯁꯥꯏꯖꯁꯤꯡ꯫

ꯐꯦꯟꯁꯤ ꯑꯆꯧꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯑꯄꯤꯀꯄꯥ ꯕꯇꯅꯁꯤꯡ? ꯃꯁꯤꯗꯥ ꯂꯩꯕꯤꯌꯨ!

ꯗꯤꯁꯑꯦꯕꯜ ꯑꯣꯏꯔꯕꯥ ꯁ꯭ꯇꯦꯠ꯫

ꯑꯦꯛꯇꯤꯕ ꯑꯣꯏꯗꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯃꯔꯝ ꯑꯃꯅꯥ ꯅꯠꯠꯔꯒꯥ ꯑꯃꯅꯥ ꯑꯦꯞ ꯑꯁꯤꯅꯥ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯕꯥ ꯕꯇꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ, ꯗꯤꯁꯑꯦꯕꯜ ꯑꯣꯏꯔꯕꯥ ꯁ꯭ꯇꯦꯠ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯧ꯫ ꯃꯗꯨ .disabledꯂꯤꯉ꯭ꯀꯁꯤꯡꯒꯤꯗꯃꯛ :disabledꯑꯃꯁꯨꯡ <button>ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤꯗꯃꯛꯇꯅꯤ꯫

ꯂꯤꯉ꯭ꯀꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

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

ꯃꯁꯤ ꯀꯔꯤꯅꯣ꯫

ꯑꯩꯈꯣꯌꯒꯤ ꯇꯣꯄꯕꯥꯔ ꯑꯁꯤ ꯋꯦꯕꯁꯥꯏꯠ ꯑꯃꯒꯤ ꯂꯣꯒꯣ ꯅꯠꯔꯒꯥ ꯃꯃꯤꯡ, ꯄ꯭ꯔꯥꯏꯃꯥꯔꯤ ꯅꯦꯚꯤꯒꯦꯁꯟ, ꯑꯃꯁꯨꯡ ꯁꯥꯔꯆ ꯐꯣꯔꯝ ꯌꯥꯑꯣꯕꯥ ꯐꯤꯛꯁ ꯕꯥꯔ ꯑꯃꯅꯤ꯫

ꯀꯁ꯭ꯇꯃꯁ ꯑꯣꯏꯕꯥ ꯌꯥꯏ꯫

ꯃꯅꯨꯡꯗꯥ ꯂꯩꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ, ꯑꯃꯁꯨꯡ ꯇꯣꯄꯕꯥꯔ ꯄꯨꯝꯅꯃꯀꯁꯨ, ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯏ꯫ ꯅꯍꯥꯛꯅꯥ ꯂꯣꯒꯣ/ꯃꯃꯤꯡ, ꯅꯦꯚ, ꯁꯥꯔꯆ, ꯑꯃꯁꯨꯡ ꯁꯦꯀꯦꯟꯗꯔꯤ ꯅꯦꯚ ꯑꯃꯥ ꯌꯥꯎꯍꯅꯕꯥ ꯌꯥꯏ—ꯅꯠꯠꯔꯒꯥ ꯃꯗꯨꯒꯤ ꯀꯝꯕꯤꯅꯦꯁꯟ ꯑꯃꯍꯦꯛꯇꯕꯨ꯫

ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

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

ꯇꯦꯕ ꯑꯃꯁꯨꯡ ꯄꯤꯂꯁꯤꯡ꯫

ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯏꯆꯝ ꯆꯝꯕꯥ ꯁꯦꯀꯦꯟꯗꯔꯤ ꯅꯦꯚꯤꯒꯦꯁꯟ ꯑꯃꯥ ꯁꯦꯃꯒꯠꯄꯥ <ul>. ꯃꯇꯤꯛ ꯆꯥꯕꯥ ꯀ꯭ꯂꯥꯁ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯇꯦꯕ ꯅꯠꯠꯔꯒꯥ ꯄꯤꯂꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯁꯣꯞ ꯇꯧ꯫

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

• ꯌꯨꯝ
• ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯁꯝꯂꯞꯄ ꯋꯥꯔꯣꯜ
• ꯄꯥꯎꯖꯦꯂꯁꯤꯡ꯫
• ꯁꯦꯇꯤꯡꯁꯤꯡ꯫
• ꯄꯥꯎ ꯐꯥꯎꯕ

<ul ꯀ꯭ꯂꯥꯁ="ꯇꯦꯕꯁꯁꯤꯡ">꯫ class = "ꯇꯦꯕꯁꯤꯡ" >
  <li class = "ꯑꯦꯛꯇꯤꯕ" ><a href = "#" > ꯌꯨꯃꯗꯥ </a></li>  
  <li><a href = "#" > ꯄ꯭ꯔꯣꯐꯥꯏꯜ </a></li> 
  <li><a href = "#" > ꯄꯥꯎꯖꯦꯂꯁꯤꯡ </a></li> 
  <li><a href = "#" > ꯁꯦꯇꯤꯡꯁꯤꯡ </a></li> 
  <li><a href = "#" > ꯀꯟꯇꯦꯛꯇ ꯇꯧꯕꯤꯌꯨ </a></li> 
</ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫

• ꯌꯨꯝ
• ꯃꯤꯑꯣꯏ ꯑꯃꯒꯤ ꯁꯝꯂꯞꯄ ꯋꯥꯔꯣꯜ
• ꯄꯥꯎꯖꯦꯂꯁꯤꯡ꯫
• ꯁꯦꯇꯤꯡꯁꯤꯡ꯫
• ꯄꯥꯎ ꯐꯥꯎꯕ

<ul class="ꯄꯤꯂꯁ"> ꯍꯥꯌꯅꯥ ꯂꯧꯕꯥ ꯌꯥꯏ꯫ class = "ꯄꯤꯂꯁꯤꯡ" > ꯫
  <li class = "ꯑꯦꯛꯇꯤꯕ" ><a href = "#" > ꯌꯨꯃꯗꯥ </a></li>  
  <li><a href = "#" > ꯄ꯭ꯔꯣꯐꯥꯏꯜ </a></li> 
  <li><a href = "#" > ꯄꯥꯎꯖꯦꯂꯁꯤꯡ </a></li> 
  <li><a href = "#" > ꯁꯦꯇꯤꯡꯁꯤꯡ </a></li> 
  <li><a href = "#" > ꯀꯟꯇꯦꯛꯇ ꯇꯧꯕꯤꯌꯨ </a></li> 
</ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫

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

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

<div ꯀ꯭ꯂꯥꯁ="ꯄꯦꯖꯤꯅꯦꯁꯟ"> ꯍꯥꯌꯅꯥ ꯂꯧꯕꯥ ꯌꯥꯏ꯫ class = "ꯄꯦꯖꯤꯅꯦꯁꯟ" >
  <ul> ꯍꯥꯌꯅꯥ ꯈꯉꯅꯩ꯫
    <li class = "ꯃꯃꯥꯡꯗꯥ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯦ" ><a href = "#" > ← ꯃꯃꯥꯡꯒꯤ </a></li>  
    <li class = "ꯑꯦꯛꯇꯤꯕ" ><a href = "#" > ꯱ </a></li>  
    <li><a href = "#" > ꯲ </a></li> ꯇꯧꯕꯥ ꯌꯥꯏ꯫ 
    <li><a href = "#" > ꯳ </a></li> ꯇꯧꯕꯥ ꯌꯥꯏ꯫ 
    <li><a href = "#" > ꯴ </a></li> ꯇꯧꯕꯥ ꯌꯥꯏ꯫ 
    <li><a href = "#" > ꯵ </a></li> ꯂꯩ꯫ 
    <li class = "ꯃꯊꯪꯒꯤ" ><a href = "#" > ꯃꯊꯪꯒꯤ → </a></li> ꯍꯥꯌꯅꯥ ꯈꯉꯅꯩ꯫  
  </ul> ꯍꯥꯌꯅꯥ ꯃꯤꯡꯊꯣꯅꯕꯥ꯫
</div> ꯍꯥꯌꯅꯥ ꯐꯣꯡꯗꯣꯀꯈꯤ꯫

ꯕꯦꯁꯤꯛ ꯑꯦꯂꯔꯇꯁꯤꯡ꯫

ꯑꯦꯛꯁꯟ ꯑꯃꯒꯤ ꯃꯥꯌ ꯄꯥꯀꯄꯥ, ꯑꯣꯏꯊꯣꯀꯄꯥ ꯌꯥꯕꯥ ꯃꯥꯌ ꯄꯥꯀꯄꯥ ꯅꯠꯠꯔꯒꯥ ꯃꯥꯌ ꯄꯥꯀꯄꯥ ꯑꯗꯨ ꯐꯣꯡꯗꯣꯛꯅꯕꯒꯤꯗꯃꯛ ꯋꯥꯟ-ꯂꯥꯏꯟ ꯃꯦꯁꯦꯖꯁꯤꯡ꯫ ꯃꯔꯨꯑꯣꯏꯅꯥ ꯐꯔꯃꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯀꯥꯟꯅꯒꯅꯤ꯫

ꯃꯦꯁꯦꯖꯁꯤꯡ ꯕ꯭ꯂꯣꯛ ꯇꯧꯕꯥ꯫

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

ꯃꯣꯗꯂꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ꯫

ꯃꯣꯗꯦꯂꯁꯤꯡ-ꯗꯥꯏꯂꯣꯒ ꯅꯠꯠꯔꯒꯥ ꯂꯥꯏꯠꯕꯣꯛꯁꯁꯤꯡ- ꯑꯁꯤ ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ ꯀꯟꯇꯦꯛꯁ ꯑꯗꯨ ꯉꯥꯛꯇꯨꯅꯥ ꯊꯝꯕꯥ ꯑꯁꯤ ꯃꯔꯨꯑꯣꯏꯕꯥ ꯐꯤꯚꯃꯁꯤꯡꯗꯥ ꯀꯟꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯑꯦꯛꯁꯅꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ ꯑꯆꯧꯕꯥ ꯑꯃꯅꯤ꯫

ꯇꯨꯜ ꯇꯤꯄꯁ꯫

ꯇ꯭ꯕꯤꯄꯁꯤꯁꯤꯡ ꯑꯁꯤ ꯋꯥꯈꯜ ꯋꯥꯕꯥ ꯌꯨꯖꯔ ꯑꯃꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯕꯗꯥ ꯑꯃꯁꯨꯡ ꯃꯈꯣꯌꯕꯨ ꯑꯆꯨꯝꯕꯥ ꯃꯥꯏꯀꯩꯗꯥ ꯇꯥꯀꯄꯗꯥ ꯁꯨꯄꯔ ꯀꯥꯟꯅꯕꯅꯤ꯫

ꯄꯣꯄꯣꯚꯔꯁꯤꯡ꯫

ꯂꯦꯑꯥꯎꯇꯇꯥ ꯑꯀꯥꯌꯕꯥ ꯄꯤꯗꯅꯥ ꯄꯦꯖ ꯑꯃꯗꯥ ꯁꯕꯇꯦꯛꯁꯆꯨꯑꯦꯜ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ ꯄꯤꯅꯕꯥ ꯄꯣꯄꯣꯚꯔꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ ꯄ꯭ꯔꯤꯕꯨꯠ , ꯌꯥꯝꯅꯥ ꯊꯨꯅꯥ ꯑꯃꯁꯨꯡ ꯌꯥꯝꯅꯥ ꯂꯥꯏꯅꯥ ꯋꯦꯕ ꯗꯤꯕꯦꯂꯄꯃꯦꯟꯇꯀꯤꯗꯃꯛ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯄ꯭ꯔꯤꯞꯔꯣꯁꯦꯁꯔ ꯑꯃꯥ ꯑꯣꯏꯔꯤꯕꯥ ꯂꯦꯁꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡꯒꯤ ꯑꯣꯄꯟ-ꯁꯣꯔꯁ ꯄꯦꯛ ꯑꯃꯥ ꯑꯣꯏꯔꯤꯕꯥ ꯄ꯭ꯔꯤꯕꯨꯠꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯦꯃꯈꯤꯕꯅꯤ꯫

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

ꯃꯇꯧ ꯀꯔꯝꯅꯥ ꯁꯤꯖꯤꯟꯅꯒꯗꯒꯦ꯫

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

<link rel="ꯁ꯭ꯇꯥꯏꯂꯁꯤꯠ/ꯂꯦꯁ" href="ꯂꯦꯁ/ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ.ꯂꯦꯁ" ꯃꯤꯗꯤꯌꯥ="ꯄꯨꯝꯅꯃꯛ" /> rel = "ꯁ꯭ꯇꯥꯏꯂꯁꯤꯠ/ꯂꯦꯁ" href = "ꯂꯦꯁ/ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ.ꯂꯦꯁ" media = "ꯄꯨꯝꯅꯃꯛ" />   
<script src = "ꯖꯦ.ꯑꯦꯁ./ꯂꯦꯁ-꯱.꯰.꯴꯱.ꯃꯤꯅꯤꯠ.ꯖꯦ.ꯑꯦꯁ" ></script> 

.js ꯁꯣꯂꯨꯁꯟ ꯑꯗꯨ ꯐꯥꯑꯣꯗ꯭ꯔꯤꯕꯔꯥ? ꯅꯍꯥꯛꯀꯤ ꯀꯣꯗ ꯑꯗꯨ ꯗꯤꯞꯂꯣꯏ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯅꯕꯥ ꯂꯦꯁ ꯃꯦꯛ ꯑꯦꯞ ꯑꯗꯨ ꯍꯣꯠꯅꯧ ꯅꯠꯠꯔꯒꯥ Node.js ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯌꯥꯑꯣꯔꯤꯕꯥ ꯑꯗꯨ ꯀꯔꯤꯅꯣ꯫

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

ꯃꯆꯨꯒꯤ ꯚꯦꯔꯤꯑꯦꯕꯂꯁꯤꯡ꯫

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

// ꯂꯤꯉ꯭ꯀꯁꯤꯡ꯫
@ꯂꯤꯉ꯭ꯀꯀꯂꯔ : #꯸ꯕꯤ꯵꯹ꯁꯤ꯲;         
@linkColorHover :     ꯑꯃꯝꯕꯥ ( @ꯂꯤꯉ꯭ꯀꯀꯂꯔ , ꯱꯰ ); 
// ꯒ꯭ꯔꯦꯁ ꯇꯧꯕꯥ꯫
@ꯕ꯭ꯂꯦꯛ : #꯰꯰꯰;             
@grayDark :           ꯃꯉꯥꯜ ꯄꯤꯕꯥ ( @ꯕ꯭ꯂꯦꯛ , ꯲꯵ %); 
@gray :               ꯂꯥꯏꯠ ꯇꯧꯕꯥ ( @ꯕ꯭ꯂꯦꯛ , ꯵꯰ %); 
@grayLight :          ꯃꯉꯥꯜ ꯄꯤꯕꯥ ( @ꯕ꯭ꯂꯦꯛ , ꯷꯰ %); 
@grayLighter :        ꯃꯉꯥꯜ ꯄꯤꯕꯥ ( @black , 90 %); 
@ꯍꯣꯌꯥꯏꯠ : #fff;             
// ꯑꯦꯀꯁꯦꯟꯇ ꯃꯆꯨꯁꯤꯡ꯫
@ꯕ꯭ꯂꯨ : # ꯰꯸ꯕꯤ꯵ꯑꯦꯐꯕꯤ ;              
@ꯒ꯭ꯔꯤꯟ : #꯴꯶ꯑꯦ꯵꯴꯶ ꯑꯃꯁꯨꯡ ꯑꯦꯟ .             
@ꯂꯥꯜ : # ꯹ꯗꯤ꯲꯶꯱ꯗꯤ ;               
@ꯌꯦꯂꯣ : # ꯑꯦꯐ.ꯑꯦꯐ.ꯁꯤ.꯴꯰ꯗꯤ;            
@ꯑꯣꯔꯦꯟꯖ : #f89406 ꯑꯃꯁꯨꯡ ꯑꯦꯟ .            
@ꯄꯤꯉ꯭ꯛ : # ꯁꯤ꯳꯳꯲꯵ꯑꯦꯐ ;              
@ꯃꯆꯨ ꯃꯆꯨꯒꯤ : # 7a43b6 ;            
// ꯕꯦꯖ ꯂꯥꯏꯟ꯫
@ ꯕꯦꯖ ꯂꯥꯏꯟ : ꯲꯰px ;          

ꯀꯃꯦꯟꯇ ꯇꯧꯕꯥ꯫

/* ... */ꯂꯦꯁꯅꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯀꯤ ꯅꯣꯔꯃꯦꯜ ꯁꯤꯟꯇꯦꯛꯁꯀꯤ ꯃꯊꯛꯇꯥ ꯀꯃꯦꯟꯇ ꯇꯧꯕꯒꯤ ꯑꯇꯣꯞꯄꯥ ꯃꯑꯣꯡ ꯑꯃꯁꯨ ꯄꯤꯔꯤ꯫

// ꯃꯁꯤ ꯀꯃꯦꯟꯇ ꯑꯃꯅꯤ꯫
/* ꯃꯁꯤꯁꯨ ꯀꯃꯦꯟꯇ ꯑꯃꯅꯤ */

ꯋꯥꯖꯨ ꯑꯁꯤ ꯃꯤꯛꯁ ꯇꯧꯏ꯫

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

ꯐꯣꯟꯇ ꯁ꯭ꯇꯦꯀꯁꯤꯡ꯫

#ꯐꯣꯟꯇ {
  . ꯁꯣꯔꯇꯍꯦꯟꯗ ( @weight : ꯅꯣꯔꯃꯦꯜ , @ ꯁꯥꯏꯖ : 14px , @lineHeight : 20px ) { .     
    ꯐꯣꯟꯇ - ꯁꯥꯏꯖ : @ ꯁꯥꯏꯖ ; 
    ꯐꯣꯟꯇ - ꯑꯔꯨꯝꯕꯥ : @ ꯑꯔꯨꯝꯕꯥ ; 
    ꯂꯥꯏꯟ - ꯍꯥꯏꯠ : @ꯂꯥꯏꯅꯍꯥꯏꯠ ; 
  } .
  . sans - serif ( @weight : ꯅꯣꯔꯃꯦꯜ , @ ꯁꯥꯏꯖ : 14px , @lineHeight : 20px ) {     
    font - family : "ꯍꯦꯂꯚꯦꯇꯤꯀꯥ ꯅ꯭ꯌꯨ" , ꯍꯦꯂꯚꯦꯇꯤꯀꯥ , ꯑꯦꯔꯤꯌꯥꯜ , ꯁꯥꯟꯁ - ꯁꯦꯔꯤꯐ ;   
    ꯐꯣꯟꯇ - ꯁꯥꯏꯖ : @ ꯁꯥꯏꯖ ; 
    ꯐꯣꯟꯇ - ꯑꯔꯨꯝꯕꯥ : @ ꯑꯔꯨꯝꯕꯥ ; 
    ꯂꯥꯏꯟ - ꯍꯥꯏꯠ : @ꯂꯥꯏꯅꯍꯥꯏꯠ ; 
  } .
  . serif ( @weight : ꯅꯣꯔꯃꯦꯜ , @ ꯁꯥꯏꯖ : 14px , @lineHeight : 20px ) { .     
    font - family : "ꯖꯔꯖꯤꯌꯥ" , ꯇꯥꯏꯃꯁ ꯅꯤꯎ ꯔꯣꯃꯥꯟ , ꯇꯥꯏꯃꯁ , sans - serif ;     
    ꯐꯣꯟꯇ - ꯁꯥꯏꯖ : @ ꯁꯥꯏꯖ ; 
    ꯐꯣꯟꯇ - ꯑꯔꯨꯝꯕꯥ : @ ꯑꯔꯨꯝꯕꯥ ; 
    ꯂꯥꯏꯟ - ꯍꯥꯏꯠ : @ꯂꯥꯏꯅꯍꯥꯏꯠ ; 
  } .
  . ꯃꯣꯅꯣꯁ꯭ꯄꯦꯁ ( @weight : ꯅꯣꯔꯃꯦꯜ , @ꯁꯥꯏꯖ : 12px , @lineHeight : 20px ) {     
    font - family : "ꯃꯣꯅꯥꯀꯣ" , ꯀꯨꯔꯤꯌꯔ ꯑꯅꯧꯕꯥ , ꯃꯣꯅꯣꯁ꯭ꯄꯦꯁ ;   
    ꯐꯣꯟꯇ - ꯁꯥꯏꯖ : @ ꯁꯥꯏꯖ ; 
    ꯐꯣꯟꯇ - ꯑꯔꯨꯝꯕꯥ : @ ꯑꯔꯨꯝꯕꯥ ; 
    ꯂꯥꯏꯟ - ꯍꯥꯏꯠ : @ꯂꯥꯏꯅꯍꯥꯏꯠ ; 
  } .
} .

ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯁꯤꯡ꯫

#ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ {
  . ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ( @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ : #꯵꯵꯵, @ꯑꯦꯟꯗꯀꯂꯔ: #꯳꯳꯳) { 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯃꯆꯨ : @endColor ; 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯔꯤꯄꯤꯠ ꯇꯧꯕꯥ : ꯔꯤꯄꯤꯠ ꯇꯧꯕꯥ - x ;
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - khtml - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯥꯏꯅꯥ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯊꯛ , ꯑꯔꯣꯏꯕꯥ ꯃꯊꯛ , ( @startColor ) ꯗꯒꯤ , ( @endColor ) ꯐꯥꯑꯣꯕꯥ ); // ꯀꯅꯛꯌꯨꯏꯔ ꯇꯧꯕꯥ꯫   
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯃꯣꯖ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯦꯃꯍꯧꯔꯤꯕꯥ , @startColor , @endColor ); // ꯑꯦꯐ.ꯑꯦꯐ.꯳.꯶+ ꯑꯣꯏꯕꯥ ꯌꯥꯏ꯫    
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ms - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯦꯃꯍꯧꯔꯤꯕꯥ , @startColor , @endColor ); // ꯑꯥꯏ.ꯏ.꯱꯰    
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯋꯦꯕꯀꯤꯠ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯥꯏꯅꯥ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯊꯛ , ꯑꯔꯣꯏꯕꯥ ꯃꯊꯛ , ꯃꯆꯨ - ꯊꯣꯡ ( ꯰ %, @startColor ), ꯃꯆꯨ - ꯊꯣꯡ ( ꯱꯰꯰ %, @endColor )); // ꯁꯥꯐꯥꯔꯤ ꯴+, ꯀ꯭ꯔꯣꯝ ꯲+꯫    
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯋꯦꯕꯀꯤꯠ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯦꯃꯍꯧꯔꯤꯕꯥ , @startColor , @endColor ); // ꯁꯥꯐꯥꯔꯤ ꯵.꯱+, ꯀ꯭ꯔꯣꯝ ꯱꯰+ ꯂꯩ꯫    
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯑꯣ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯦꯃꯍꯧꯔꯤꯕꯥ , @startColor , @endColor ); // ꯑꯣꯄꯦꯔꯥ ꯱꯱.꯱꯰ ꯂꯩ꯫    
    - ms - filter : %( "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯇꯥꯏꯞ=1)" , @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ , @ꯑꯦꯟꯗꯀꯂꯔ ); // ꯑꯥꯏ.ꯏ.꯸+  
    filter : e (%( "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', ꯑꯦꯟꯗꯀꯂꯔꯁ꯭ꯠꯔ='%d', ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯇꯥꯏꯞ=1)" , @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ , @ꯑꯦꯟꯗꯀꯂꯔ )); // ꯑꯥꯏ.ꯏ.꯶ ꯑꯃꯁꯨꯡ ꯑꯥꯏ.ꯏ.꯷ 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯦꯃꯍꯧꯔꯤꯕꯥ , @startColor , @endColor ); // ꯂꯦ ꯁ꯭ꯇꯦꯟꯗꯔꯗ ꯑꯣꯏꯕꯥ꯫   
  } .
  . ꯚꯔꯇꯤꯀꯦꯜ ( @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ : #꯵꯵꯵, @ꯑꯦꯟꯗꯀꯂꯔ: #꯳꯳꯳) { 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯃꯆꯨ : @endColor ; 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯔꯤꯄꯤꯠ ꯇꯧꯕꯥ : ꯔꯤꯄꯤꯠ ꯇꯧꯕꯥ - x ;
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - khtml - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯤꯅꯤꯌꯔ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯊꯛ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯈꯥ , ( @startColor ) ꯗꯒꯤ , ( @endColor ) ꯐꯥꯑꯣꯕꯥ ); // ꯀꯅꯛꯌꯨꯏꯔ ꯇꯧꯕꯥ꯫   
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯃꯣꯖ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( @startColor , @endColor ); // ꯑꯦꯐ.ꯑꯦꯐ.꯳.꯶+ ꯑꯣꯏꯕꯥ ꯌꯥꯏ꯫   
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ms - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( @startColor , @endColor ); // ꯑꯥꯏ.ꯏ.꯱꯰   
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯋꯦꯕꯀꯤꯠ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( ꯂꯥꯏꯅꯥ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯊꯛ , ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯃꯈꯥ , ꯃꯆꯨ - ꯊꯣꯡ ( ꯰ %, @startColor ), ꯃꯆꯨ - ꯊꯣꯡ ( ꯱꯰꯰ %, @endColor )); // ꯁꯥꯐꯥꯔꯤ ꯴+, ꯀ꯭ꯔꯣꯝ ꯲+꯫    
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯋꯦꯕꯀꯤꯠ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( @startColor , @endColor ); // ꯁꯥꯐꯥꯔꯤ ꯵.꯱+, ꯀ꯭ꯔꯣꯝ ꯱꯰+ ꯂꯩ꯫   
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : - ꯑꯣ - ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( @startColor , @endColor ); // ꯑꯣꯄꯦꯔꯥ ꯱꯱.꯱꯰ ꯂꯩ꯫   
    - ms - filter : %( "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯇꯥꯏꯞ=0)" , @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ , @ꯑꯦꯟꯗꯀꯂꯔ ); // ꯑꯥꯏ.ꯏ.꯸+  
    filter : e (%( "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', ꯑꯦꯟꯗꯀꯂꯔꯁ꯭ꯠꯔ='%d', ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇꯇꯥꯏꯞ=0)" , @ꯁ꯭ꯇꯥꯔꯇꯀꯂꯔ , @ꯑꯦꯟꯗꯀꯂꯔ )); // ꯑꯥꯏ.ꯏ.꯶ ꯑꯃꯁꯨꯡ ꯑꯥꯏ.ꯏ.꯷ 
    ꯕꯦꯀꯒ꯭ꯔꯥꯎꯟꯗ - ꯏꯃꯦꯖ : ꯂꯥꯏꯅꯥ - ꯒ꯭ꯔꯦꯗꯤꯌꯦꯟꯇ ( @startColor , @endColor ); // ꯁ꯭ꯇꯦꯟꯗꯔꯗ ꯑꯗꯨ꯫  
  } .
  . ꯗꯤꯔꯦꯛꯁꯅꯒꯤ ( @startColor : #555, @endColor: #333, @deg: 45deg) { 
    ...
  } .
  . ꯚꯔꯇꯤꯀꯦꯜ - ꯑꯍꯨꯝ - ꯃꯆꯨ ( @startColor : #00b3ee, @midColor: #7a43b6, @colorStop: 0.5, @endColor: #c3325f) { 
    ...
  } .
} .

ꯑꯣꯄꯔꯦꯁꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤꯒꯨꯝꯕꯥ ꯐ꯭ꯂꯦꯛꯁꯤꯕꯜ ꯑꯃꯁꯨꯡ ꯄꯥꯋꯔꯐꯨꯜ ꯃꯤꯛꯁꯤꯅꯁꯤꯡ ꯁꯦꯃꯒꯠꯅꯕꯥ ꯐꯦꯟꯁꯤ ꯂꯧꯕꯤꯌꯨ ꯑꯃꯁꯨꯡ ꯃꯦꯊꯁ ꯈꯔꯥ ꯄꯥꯡꯊꯣꯀꯄꯤꯌꯨ꯫

// ꯒ꯭ꯔꯤꯗꯤꯆꯨꯗ꯫
@ꯒ꯭ꯔꯤꯗꯀꯣꯂꯃꯁꯤꯡ : ꯱꯶ ;       
@ ꯒ꯭ꯔꯤꯗꯀꯣꯂꯃꯋꯥꯏꯗ : ꯴꯰px ;   
@ꯒ꯭ꯔꯤꯗꯒꯨꯇꯔꯋꯥꯏꯗ : ꯲꯰px ;   
// ꯒ꯭ꯔꯤꯗ ꯁꯤꯁ꯭ꯇꯦꯝ꯫
. ꯀꯟꯇꯦꯅꯔ ꯑꯃꯥ {
  ꯄꯥꯀꯆꯥꯎꯕꯥ : @ꯁꯥꯏꯇꯋꯥꯏꯗ ; 
  ꯃꯥꯔꯖꯤꯟ : ꯰ ꯑꯣꯇꯣ ;  
  . ꯀ꯭ꯂꯤꯌꯥꯔꯐꯤꯛꯁ ();
} .
. ꯀꯂꯃꯁꯤꯡ ( @columnSpan : ꯱ ) { .  
  ꯗꯤꯁꯞꯂꯦ : ꯏꯅꯂꯥꯏꯟ ; 
  float : ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ;
  width : ( @ꯒ꯭ꯔꯤꯗꯀꯣꯂꯃꯋꯥꯏꯗ * @ꯀꯣꯂꯃꯁ꯭ꯄꯦꯟ ) + ( @ꯒ꯭ꯔꯤꯗꯒꯨꯇꯔꯋꯥꯏꯗ * ( @ ꯀꯣꯂꯃꯁ꯭ꯄꯦꯟ - ꯱ ));         
  ꯃꯥꯔꯖꯤꯟ - ꯂꯦꯃꯍꯧꯔꯤꯕꯥ : @gridGutterWidth ; 
  &: ꯑꯍꯥꯅꯕꯥ - ꯑꯉꯥꯡ {
    ꯃꯥꯔꯖꯤꯟ - ꯂꯦꯞꯇꯅꯥ : ꯰ ; 
  } .
} .
. ꯑꯣꯐꯁꯦꯠ ( @columnOffset : ꯱ ) { .  
  margin - left : ( @ꯒ꯭ꯔꯤꯗꯀꯣꯂꯃꯋꯥꯏꯗ * @ꯀꯣꯂꯃꯑꯣꯐꯁꯦꯠ ) + ( @ꯒ꯭ꯔꯤꯗꯒꯨꯇꯔꯋꯤꯗ * ( @ꯀꯣꯂꯃꯑꯣꯐꯁꯦꯠ - ꯱ )) ! ꯃꯔꯨꯑꯣꯏꯕꯥ ;          
} .