ꯔꯤꯕꯨꯠ ꯇꯧꯕꯥ꯫
ꯐꯥꯏꯜ ꯑꯃꯈꯛꯇꯗꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ-ꯁ꯭ꯄꯦꯁꯤꯐꯤꯛ CSS ꯍꯣꯡꯗꯣꯛ-ꯍꯣꯡꯖꯤꯟ ꯇꯧꯕꯒꯤ ꯈꯣꯃꯖꯤꯅꯕꯥ ꯑꯃꯥ ꯑꯣꯏꯔꯤꯕꯥ ꯔꯤꯕꯨꯠ, ꯁꯦꯃꯒꯠꯅꯕꯥ ꯏꯂꯤꯒꯦꯟꯇ, ꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯇ, ꯑꯃꯁꯨꯡ ꯏꯆꯝ ꯆꯝꯕꯥ ꯕꯦꯖ ꯂꯥꯏꯟ ꯑꯃꯥ ꯄꯤꯅꯕꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯀꯤꯀꯁ꯭ꯇꯥꯔ ꯇꯧꯏ꯫
ꯔꯤꯕꯨꯠ ꯑꯁꯤ ꯅꯣꯔꯃꯦꯂꯥꯏꯖ ꯇꯧꯕꯗꯥ ꯁꯦꯃꯒꯠꯂꯤ, ꯑꯦꯂꯤꯃꯦꯟꯇ ꯁꯦꯂꯦꯛꯇꯔꯁꯤꯡ ꯈꯛꯇꯃꯛ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ HTML ꯑꯦꯂꯤꯃꯦꯟꯇ ꯀꯌꯥꯗꯥ ꯈꯔꯥ ꯑꯣꯄꯤꯅꯤꯌꯟ ꯑꯣꯏꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯄꯤꯔꯤ꯫ ꯑꯍꯦꯅꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯑꯁꯤ ꯀ꯭ꯂꯥꯁꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯈꯛꯇꯃꯛ ꯇꯧꯏ꯫ ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ <table>
ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯕꯦꯖ ꯂꯥꯏꯟ ꯑꯃꯒꯤꯗꯃꯛ ꯁ꯭ꯇꯥꯏꯜ ꯈꯔꯗꯤ ꯔꯤꯕꯨꯠ ꯇꯧꯏ ꯑꯃꯁꯨꯡ ꯃꯇꯨꯡꯗꯥ .table
, .table-bordered
, ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥ ꯄꯤꯔꯤ꯫
ꯔꯤꯕꯣꯠ ꯇꯧꯕꯗꯥ ꯀꯔꯤ ꯑꯣꯚꯔꯔꯥꯏꯗ ꯇꯧꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯈꯅꯕꯒꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯒꯥꯏꯗꯂꯥꯏꯅꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯔꯃꯁꯤꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤ:
- ꯁ꯭ꯀꯦꯂꯦꯕꯜ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯁ꯭ꯄꯦꯁꯤꯡꯒꯤꯗꯃꯛ
rem
sꯒꯤ ꯃꯍꯨꯠꯇꯥ s ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ ꯚꯦꯜꯌꯨ ꯈꯔꯗꯤ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯣ .em
- ꯊꯤꯡꯖꯤꯜꯂꯨ
margin-top
. ꯚꯔꯇꯤꯀꯦꯜ ꯃꯥꯔꯖꯤꯅꯁꯤꯡ ꯑꯁꯤ ꯁꯣꯀꯍꯜꯂꯀꯄꯥ ꯌꯥꯏ, ꯃꯗꯨꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯔꯒꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯐꯂꯁꯤꯡ ꯄꯤꯕꯥ ꯌꯥꯏ꯫ ꯑꯗꯨꯕꯨ ꯍꯦꯟꯅꯥ ꯃꯔꯨꯑꯣꯏꯕꯗꯤ, ꯃꯥꯏꯀꯩ ꯑꯃꯈꯛꯇꯃꯛmargin
ꯑꯁꯤ ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯃꯦꯟꯇꯦꯜ ꯃꯣꯗꯦꯜ ꯑꯃꯅꯤ꯫ - ꯗꯤꯚꯥꯏꯁ ꯁꯥꯏꯖꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯍꯦꯟꯅꯥ ꯐꯖꯅꯥ ꯁ꯭ꯀꯦꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ, ꯕ꯭ꯂꯣꯛ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯅꯥ sꯒꯤꯗꯃꯛ
rem
smargin
ꯁꯤꯖꯤꯟꯅꯒꯗꯕꯅꯤ꯫ font
-ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯄ꯭ꯔꯣꯄꯔꯇꯤꯁꯤꯡꯒꯤ ꯗꯤꯛꯂꯥꯔꯦꯁꯅꯁꯤꯡ ꯑꯗꯨ ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯦꯝꯕꯥ ꯃꯑꯣꯡꯗꯥ ꯊꯝꯃꯨ ,inherit
ꯌꯥꯔꯤꯕꯃꯈꯩ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ꯫
<html>
ꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯑꯁꯤ <body>
ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯄꯦꯖ-ꯋꯥꯏꯗ ꯗꯤꯐꯣꯜꯇꯁꯤꯡ ꯄꯤꯅꯕꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯏ꯫ ꯍꯦꯟꯅꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ:
- ꯗꯤ
box-sizing
ꯑꯁꯤ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯏꯂꯤꯃꯦꯟꯇ ꯈꯨꯗꯤꯡꯃꯛꯇꯥ ꯁꯦꯠ ꯇꯧꯏ—ꯃꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ*::before
ꯑꯃꯁꯨꯡ*::after
, ꯇꯨborder-box
. ꯃꯁꯤꯅꯥ ꯄꯦꯗꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯕꯣꯔꯗꯔꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯀꯤ ꯂꯥꯎꯊꯣꯛꯂꯕꯥ ꯄꯥꯛ-ꯆꯥꯎꯕꯥ ꯑꯗꯨ ꯀꯩꯗꯧꯉꯩꯗꯥ ꯍꯦꯅꯒꯠꯍꯟꯗꯅꯕꯥ ꯁꯣꯌꯗꯅꯥ ꯊꯝꯂꯤ꯫font-size
, ꯗꯥ ꯕꯦꯖ ꯑꯃꯠꯇꯥ ꯂꯥꯎꯊꯣꯛꯇꯦ<html>
, ꯑꯗꯨꯕꯨ16px
ꯂꯧꯁꯤꯜꯂꯤ (ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ)꯫ ꯑꯁꯤ ꯌꯨꯖꯔꯒꯤ ꯄꯁꯟꯗꯁꯤꯡ ꯏꯀꯥꯌꯈꯨꯝꯅꯕꯥ ꯎꯠꯇꯨꯅꯥ ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯈꯨꯗꯣꯡꯆꯥꯕꯥ ꯌꯥꯕꯥ ꯑꯦꯞꯔꯣꯆ ꯑꯃꯥ ꯁꯣꯌꯗꯅꯥ ꯐꯪꯍꯟꯗꯨꯅꯥ ꯃꯤꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯐꯖꯅꯥ ꯔꯦꯁ꯭ꯄꯣꯟꯁꯤꯕꯜ ꯑꯣꯏꯕꯥ ꯇꯥꯏꯞ-ꯁ꯭ꯀꯦꯂꯤꯡꯒꯤꯗꯃꯛfont-size: 1rem
ꯑꯣꯟ ꯗꯤ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫<body>
- ꯑꯁꯤꯅꯥ
<body>
ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥfont-family
,line-height
, ꯑꯃꯁꯨꯡtext-align
. ꯃꯁꯤ ꯐꯣꯟꯇ ꯏꯅꯀꯟꯁꯤꯁ꯭ꯇꯦꯟꯁꯁꯤꯡ ꯊꯤꯡꯅꯕꯥ ꯐꯔꯝ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯈꯔꯅꯥ ꯃꯇꯨꯡꯗꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯏ꯫ - ꯁꯦꯐꯇꯤꯒꯤꯗꯃꯛ,
<body>
ꯗꯤꯛꯂꯥꯔꯦꯗ ꯑꯃꯥ ꯂꯩꯔꯤbackground-color
, ꯗꯤꯐꯣꯜꯇ ꯇꯧꯗꯨꯅꯥ#fff
.
ꯗꯤꯐꯣꯜꯇ ꯋꯦꯕ ꯐꯣꯟꯇꯁꯤꯡ (ꯍꯦꯂꯚꯦꯇꯤꯀꯥ ꯅ꯭ꯌꯨ, ꯍꯦꯂꯚꯦꯇꯤꯀꯥ, ꯑꯃꯁꯨꯡ ꯑꯦꯔꯤꯑꯦꯜ) ꯑꯁꯤ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯴ꯗꯥ ꯊꯥꯗꯣꯀꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯗꯤꯚꯥꯏꯁ ꯑꯃꯁꯨꯡ ꯑꯣ.ꯑꯦꯁ. ꯁ꯭ꯃꯥꯁꯤꯡ ꯃꯦꯒꯥꯖꯤꯅꯒꯤ ꯑꯥꯔꯇꯤꯀꯜ ꯑꯁꯤꯗꯥ ꯅꯦꯇꯤꯕ ꯐꯣꯟꯇ ꯁ꯭ꯇꯦꯀꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯃꯈꯥ ꯇꯥꯅꯥ ꯄꯥꯕꯤꯌꯨ .
ꯃꯁꯤ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯄꯨꯝꯅꯃꯛꯇꯥ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯑꯃꯁꯨꯡ ꯑꯣꯇꯣꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯏ font-family
ꯍꯥꯌꯅꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫ <body>
ꯒ꯭ꯂꯣꯕꯦꯜ ꯍꯣꯡꯗꯣꯛꯅꯕꯥ , ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ font-family
ꯑꯄꯗꯦꯠ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯕꯥ꯫$font-family-base
ꯍꯦꯗꯤꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ—ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, <h1>
—ꯑꯗꯨꯒꯥ <p>
ꯃꯈꯣꯌꯒꯤ margin-top
ꯂꯧꯊꯣꯛꯅꯕꯥ ꯔꯤꯁꯦꯠ ꯇꯧꯏ꯫ ꯍꯦꯗꯤꯡꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ ꯑꯃꯁꯨꯡ ꯐꯖꯅꯥ ꯁ꯭ꯄꯦꯁꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ margin-bottom: .5rem
ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐꯁꯤꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫margin-bottom: 1rem
ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ | ꯈꯨꯗꯝ |
---|---|
|
ꯑꯩꯆ.꯱. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
|
h꯲. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
|
ꯑꯩꯆ꯳. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
|
ꯑꯩꯆ꯴. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
|
h꯵. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
|
ꯑꯩꯆ꯶. ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯍꯦꯗꯤꯡ ꯇꯧꯕꯥ꯫ |
ꯂꯤꯁ꯭ꯠ ꯄꯨꯝꯅꯃꯛ— <ul>
, <ol>
, ꯑꯃꯁꯨꯡ <dl>
—ꯃꯈꯣꯌꯒꯤ margin-top
ꯂꯧꯊꯣꯀꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ ꯑꯦ margin-bottom: 1rem
. ꯅꯦꯁ꯭ꯇꯦꯗ ꯂꯤꯁ꯭ꯇꯁꯤꯡꯗꯥ margin-bottom
.
- ꯂꯣꯔꯦꯝ ꯏꯄꯁꯨꯝ ꯗꯣꯂꯣꯔ ꯁꯤꯠ ꯑꯥꯃꯦꯠ꯫
- ꯀꯟꯁꯦꯛꯇꯇꯨꯔ ꯑꯦꯗꯤꯄꯤꯁꯤꯡ ꯏꯂꯤꯠ꯫
- ꯏꯟꯇꯤꯖꯔ ꯃꯣꯂꯦꯁ꯭ꯇꯤ ꯂꯣꯔꯦꯝ ꯑꯦꯠ ꯃꯥꯁꯥ꯫
- ꯄ꯭ꯔꯦꯇꯤꯌꯝ ꯅꯤꯁꯜ ꯑꯦꯂꯤꯀꯦꯠꯇꯥ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ꯫
- ꯅꯨꯜꯂꯥ ꯚꯣꯂꯨꯠꯄꯠ ꯑꯦꯂꯤꯛꯌꯨꯝ ꯚꯦꯂꯤꯠ꯫
- ꯐꯦꯁꯦꯂꯁ ꯏꯌꯥꯀꯨꯂꯤꯁ ꯅꯦꯀꯦ꯫
- ꯄꯨꯔꯨꯁ ꯁꯣꯗꯦꯂꯁ ꯑꯂꯠꯔꯤꯁꯤꯁ꯫
- ꯚꯦꯁ꯭ꯇꯤꯕꯨꯂꯝ ꯂꯥꯑꯣꯔꯤꯠ ꯄꯣꯔꯇꯤꯇꯣꯔ ꯁꯦꯝ꯫
- ꯑꯦꯛ ꯇ꯭ꯔꯤꯁ꯭ꯇꯤꯛ ꯂꯤꯕꯦꯔꯣ ꯚꯣꯂꯨꯠꯄꯠ ꯑꯦꯠ꯫
- ꯐꯧꯁꯤꯕꯁ ꯄꯣꯔꯇꯥ ꯂꯦꯀꯁ ꯐ꯭ꯔꯤꯟꯖꯤꯂꯥ ꯚꯦꯜ꯫
- ꯑꯦꯅꯤꯌꯟ ꯁꯤꯠ ꯑꯥꯃꯦꯠ ꯑꯦꯔꯥꯠ ꯅꯟꯛ꯫
- ꯑꯦꯒꯦꯠ ꯄꯣꯔꯇꯤꯇꯣꯔ ꯂꯣꯔꯦꯝ꯫
- ꯂꯣꯔꯦꯝ ꯏꯄꯁꯨꯝ ꯗꯣꯂꯣꯔ ꯁꯤꯠ ꯑꯥꯃꯦꯠ꯫
- ꯀꯟꯁꯦꯛꯇꯇꯨꯔ ꯑꯦꯗꯤꯄꯤꯁꯤꯡ ꯏꯂꯤꯠ꯫
- ꯏꯟꯇꯤꯖꯔ ꯃꯣꯂꯦꯁ꯭ꯇꯤ ꯂꯣꯔꯦꯝ ꯑꯦꯠ ꯃꯥꯁꯥ꯫
- ꯄ꯭ꯔꯦꯇꯤꯌꯝ ꯅꯤꯁꯜ ꯑꯦꯂꯤꯀꯦꯠꯇꯥ ꯐꯦꯁꯤꯂꯤꯁꯤꯁ꯫
- ꯅꯨꯜꯂꯥ ꯚꯣꯂꯨꯠꯄꯠ ꯑꯦꯂꯤꯛꯌꯨꯝ ꯚꯦꯂꯤꯠ꯫
- ꯐꯧꯁꯤꯕꯁ ꯄꯣꯔꯇꯥ ꯂꯦꯀꯁ ꯐ꯭ꯔꯤꯟꯖꯤꯂꯥ ꯚꯦꯜ꯫
- ꯑꯦꯅꯤꯌꯟ ꯁꯤꯠ ꯑꯥꯃꯦꯠ ꯑꯦꯔꯥꯠ ꯅꯟꯛ꯫
- ꯑꯦꯒꯦꯠ ꯄꯣꯔꯇꯤꯇꯣꯔ ꯂꯣꯔꯦꯝ꯫
ꯍꯦꯟꯅꯥ ꯂꯥꯏꯕꯥ ꯁ꯭ꯇꯥꯏꯂꯤꯡ, ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯍꯥꯏꯔꯔꯀꯤ, ꯑꯃꯁꯨꯡ ꯍꯦꯟꯅꯥ ꯐꯕꯥ ꯁ꯭ꯄꯦꯁꯤꯡꯒꯤꯗꯃꯛ, ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯇꯁꯤꯡꯗꯥ ꯑꯄꯗꯦꯠ ꯇꯧꯔꯕꯥ margin
ꯑꯦꯁ. <dd>
s ꯔꯤꯁꯦꯠ margin-left
ꯇꯧꯕꯥ 0
ꯑꯃꯁꯨꯡ ꯍꯥꯄꯆꯤꯅꯕꯥ margin-bottom: .5rem
. <dt>
ꯑꯦꯁ ꯑꯁꯤ ꯕꯣꯜꯗ ꯇꯧꯏ .
- ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯇꯁꯤꯡ꯫
- ꯋꯥꯍꯟꯊꯣꯛ ꯄꯤꯅꯕꯒꯤꯗꯃꯛ ꯗꯤꯁ꯭ꯛꯔꯤꯄꯁꯟ ꯂꯤꯁ꯭ꯠ ꯑꯃꯥ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫
- ꯏꯎꯏꯁꯃꯣꯗ꯫
- ꯚꯦꯁ꯭ꯇꯤꯕꯨꯂꯝ ꯑꯥꯏꯗꯤ ꯂꯤꯒꯨꯂꯥ ꯄꯣꯔꯇꯥ ꯐꯦꯂꯤꯁ ꯏꯎꯏꯁꯃꯣꯗ ꯁꯦꯝꯄꯔ ꯑꯦꯒꯦꯠ ꯂꯦꯁꯤꯅꯤꯌꯥ ꯑꯣꯗꯤꯑꯣ ꯁꯦꯝ꯫
- ꯗꯣꯅꯦꯛ ꯑꯥꯏꯗꯤ ꯏꯂꯤꯠ ꯅꯟ ꯃꯤ ꯄꯣꯔꯇꯥ ꯒ꯭ꯔꯦꯚꯤꯗꯥ ꯑꯦꯠ ꯑꯦꯒꯦꯠ ꯃꯦꯇꯁ꯫
- ꯃꯥꯂꯦꯁꯨꯌꯥꯗꯥ ꯄꯣꯔꯇꯥ꯫
- ꯏꯇꯤꯌꯥꯝ ꯄꯣꯔꯇꯥ ꯁꯦꯝ ꯃꯥꯂꯦꯁꯨꯌꯥꯗꯥ ꯃꯒꯅꯥ ꯃꯣꯂꯤꯁ ꯏꯎꯏꯁꯃꯣꯗ꯫
<pre>
ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ ꯃꯁꯤꯒꯤ ꯂꯧꯊꯣꯛꯅꯕꯥ margin-top
ꯑꯃꯁꯨꯡ rem
ꯃꯁꯤꯒꯤ margin-bottom
.
.ꯈꯨꯗꯝ-ꯏꯂꯤꯃꯦꯟꯇ { . ꯃꯥꯔꯖꯤꯟ-ꯕꯣꯇꯣꯝ: ꯱ꯔꯦꯝ; } .
ꯇꯦꯕꯂꯁꯤꯡ ꯑꯁꯤ ꯁ꯭ꯇꯥꯏꯜ <caption>
ꯑꯦꯁ, ꯀꯣꯂꯥꯞꯁ ꯕꯣꯔꯗꯔꯁꯤꯡꯗꯥ ꯈꯔꯥ ꯑꯦꯗꯖꯁ꯭ꯠ ꯇꯧꯏ, ꯑꯃꯁꯨꯡ text-align
ꯄꯨꯝꯅꯃꯛꯇꯥ ꯂꯦꯞꯄꯥ ꯂꯩꯇꯅꯥ ꯁꯣꯏꯗꯅꯥ ꯊꯝꯂꯤ꯫ ꯉꯃꯈꯩꯁꯤꯡ, ꯄꯦꯗꯤꯡ, ꯑꯃꯁꯨꯡ ꯑꯇꯩ ꯀꯌꯥꯒꯤ ꯑꯍꯦꯅꯕꯥ ꯑꯍꯣꯡꯕꯥ ꯑꯁꯤ ꯀ꯭ꯂꯥꯁ .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 ꯑꯁꯤ ꯍꯣꯔꯥꯏꯖꯣꯟꯇꯦꯜ ꯔꯤꯁꯥꯏꯖ ꯇꯧꯕꯅꯥ ꯑꯌꯥꯝꯕꯅꯥ ꯄꯦꯖ ꯂꯦꯑꯥꯎꯠ “ꯕ꯭ꯔꯦꯛ” ꯇꯧꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯚꯔꯇꯤꯀꯦꯜ ꯑꯣꯏꯅꯥ ꯔꯤꯁꯥꯏꯖ ꯇꯧꯕꯥ ꯌꯥꯕꯥ ꯈꯛꯇꯃꯛ ꯑꯣꯏꯅꯥ ꯃꯣꯗꯤꯐꯥꯏ ꯇꯧꯏ꯫
ꯑꯍꯣꯡꯕꯁꯤꯡ ꯑꯁꯤ, ꯑꯃꯁꯨꯡ ꯃꯁꯤꯗꯒꯤ ꯍꯦꯅꯕꯥ, ꯃꯈꯥꯗꯥ ꯎꯠꯂꯤ꯫
ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤ <address>
ꯕ꯭ꯔꯥꯎꯖꯔꯒꯤ ꯗꯤꯐꯣꯜꯇ font-style
ꯑꯗꯨ . ꯑꯁꯤꯁꯨ ꯍꯧꯖꯤꯛ ꯏꯅꯍꯦꯔꯤ ꯇꯧꯔꯦ, ꯑꯃꯁꯨꯡ ꯍꯥꯄꯆꯤꯜꯂꯦ꯫ s ꯑꯁꯤ ꯈ꯭ꯕꯥꯏꯗꯒꯤ ꯅꯀꯄꯥ ꯏꯄꯥ-ꯏꯄꯨꯒꯤ (ꯅꯠꯠꯔꯒꯥ ꯊꯕꯛꯀꯤ ꯃꯄꯨꯡ ꯑꯣꯏꯕꯥ ꯕꯣꯗꯤ ꯑꯃꯒꯤ) ꯀꯟꯇꯦꯛꯇ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ ꯄꯤꯅꯕꯒꯤꯗꯃꯛꯇꯅꯤ꯫ ꯂꯣꯌꯅꯅꯥ ꯂꯥꯏꯅꯁꯤꯡ ꯂꯣꯏꯁꯤꯟꯗꯨꯅꯥ ꯐꯣꯔꯃꯦꯇꯤꯡ ꯉꯥꯛꯇꯨꯅꯥ ꯊꯝꯃꯨ .italic
normal
line-height
margin-bottom: 1rem
<address>
<br>
꯱꯳꯵꯵ ꯃꯥꯔꯀꯦꯠ ꯁꯦꯟꯇꯔ, ꯁꯨꯏꯠ ꯹꯰꯰
ꯁꯥꯟ ꯐ꯭ꯔꯥꯟꯁꯤꯁ꯭ꯀꯣ, ꯁꯤ.ꯑꯦ.꯹꯴꯱꯰꯳
ꯄꯤ: (꯱꯲꯳) ꯴꯵꯶-꯷꯸꯹꯰꯫ ꯃꯄꯨꯡ ꯐꯥꯕꯥ ꯃꯤꯡ
[email protected]
ꯕ꯭ꯂꯣꯀꯀꯣꯠꯁꯤꯡꯗꯥ ꯗꯤꯐꯣꯜꯇ margin
ꯑꯁꯤ 1em 40px
, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯗꯨ 0 0 1rem
ꯑꯇꯣꯞꯄꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯥ ꯍꯦꯟꯅꯥ ꯆꯨꯅꯕꯥ ꯋꯥꯐꯝ ꯑꯃꯒꯤꯗꯃꯛ ꯔꯤꯁꯦꯠ ꯇꯧꯏ꯫
ꯂꯣꯔꯦꯝ ꯏꯄꯁꯝ ꯗꯣꯂꯣꯔ ꯁꯤꯠ ꯑꯦꯃꯦꯠ, ꯀꯟꯁꯦꯛꯇꯦꯇꯨꯔ ꯑꯦꯗꯤꯄꯤꯁꯤꯡ ꯏꯂꯤꯠ꯫ ꯏꯟꯇꯤꯖꯔ ꯄꯣꯁꯨꯔꯦ ꯑꯦꯔꯥꯠ ꯑꯃꯥ ꯑꯦꯟꯇꯤ꯫
ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯁꯤꯅꯥ <abbr>
ꯄꯦꯔꯥꯒ꯭ꯔꯥꯐ ꯇꯦꯛꯁꯀꯤ ꯃꯔꯛꯇꯥ ꯃꯁꯛ ꯊꯣꯀꯄꯥ ꯑꯣꯏꯍꯟꯅꯕꯥ ꯕꯦꯁꯤꯛ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯐꯪꯏ꯫
cursor
ꯁꯣꯃꯥꯔꯤꯗꯥ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ text
, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯗꯨ ꯔꯤꯁꯦꯠ pointer
ꯇꯧꯗꯨꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯀ꯭ꯂꯤꯛ ꯇꯧꯗꯨꯅꯥ ꯏꯟꯇꯔꯦꯛꯇ ꯇꯧꯕꯥ ꯌꯥꯏ ꯍꯥꯌꯕꯥ ꯐꯣꯡꯗꯣꯛꯅꯕꯥ꯫
ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯜ ꯈꯔꯥ꯫
ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯏꯅꯐꯣꯔꯃꯦꯁꯟ꯫
ꯃꯁꯤꯗꯒꯤꯁꯨ ꯍꯦꯟꯅꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡ꯫
ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯍꯦꯟꯅꯥ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯁꯤꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤ꯫
HTML5ꯅꯥ ꯑꯅꯧꯕꯥ ꯃꯥꯂꯦꯃꯒꯤ ꯑꯣꯏꯕꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯃꯥ[hidden]
ꯍꯥꯄꯆꯤꯜꯂꯤ , ꯃꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯁ꯭ꯇꯥꯏꯜ display: none
ꯇꯧꯏ꯫ PureCSS ꯗꯒꯤ ꯋꯥꯈꯜꯂꯣꯟ ꯑꯃꯥ ꯂꯧꯗꯨꯅꯥ , ꯑꯩꯈꯣꯌꯅꯥ ꯃꯁꯤꯒꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯁꯤ ꯑꯁꯣꯌꯕꯥ ꯂꯩꯇꯅꯥ ꯑꯣꯚꯔꯔꯥꯏꯗ [hidden] { display: none !important; }
ꯇꯧꯗꯅꯕꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯅꯕꯥ ꯁꯦꯃꯗꯨꯅꯥ ꯐꯒꯠꯍꯜꯂꯤ꯫ display
ꯑꯥꯏ.ꯏ.꯱꯰ꯅꯥ ꯅꯦꯇꯤꯕ ꯑꯣꯏꯅꯥ ꯁꯄꯣꯔꯠ ꯇꯧꯗ꯭ꯔꯤꯉꯩꯗꯥ [hidden]
, ꯑꯩꯈꯣꯌꯒꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯇꯥ ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯗꯤꯛꯂꯥꯔꯦꯁꯟ ꯑꯁꯤꯅꯥ ꯁꯃꯁ꯭ꯌꯥ ꯑꯗꯨꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯂꯥꯀꯁꯤꯜꯂꯤ꯫
jQuery ꯏꯅꯀꯃꯄꯦꯇꯤꯕꯤꯂꯤꯇꯤ ꯂꯩꯕꯥ꯫
[hidden]
$(...).hide()
jQuery's ꯑꯃꯁꯨꯡ $(...).show()
ꯃꯦꯊꯗꯁꯤꯡꯒꯥ ꯀꯣꯟꯅꯅꯥ ꯆꯠꯅꯕꯥ ꯌꯥꯗꯦ꯫ ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯛ ꯃꯔꯨꯑꯣꯏꯅꯥ ꯏꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤ [hidden]
ꯃꯦꯅꯦꯖ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯑꯇꯣꯞꯄꯥ ꯇꯦꯛꯅꯤꯀꯁꯤꯡꯒꯤ ꯃꯊꯛꯇꯥ ꯑꯦꯟꯗꯣꯔꯁ ꯇꯧꯗꯦ꯫display
ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯚꯤꯖꯤꯕꯤꯂꯤꯇꯤ ꯑꯗꯨ ꯁꯨꯞꯅꯒꯤ ꯇꯣꯒꯜ ꯇꯧꯅꯕꯥ, ꯃꯗꯨꯒꯤ ꯑꯔꯊꯗꯤ ꯃꯁꯤꯒꯤ display
ꯃꯣꯗꯤꯐꯥꯏꯗ ꯇꯧꯗ꯭ꯔꯤ ꯑꯃꯁꯨꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯅꯥ ꯍꯧꯖꯤꯀꯁꯨ ꯗꯣꯛꯌꯨꯃꯦꯟꯇ ꯑꯗꯨꯒꯤ ꯐ꯭ꯂꯣꯗꯥ ꯑꯀꯥꯌꯕꯥ ꯄꯤꯕꯥ ꯌꯥꯏ, ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯧ꯫.invisible