letter-spacing | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS | |
6.0+ | 8.0+ | 1.0+ | 3.5+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
ΠΡΠ°ΡΠΊΠ°Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ
ΠΠ΅ΡΡΠΈΠΈ CSS
CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
---|---|---|---|
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅
ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠ°ΡΠ·Π΅ΡΡ ΠΎΠ±ΡΡΠ½ΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ, ΠΈΡΡ ΠΎΠ΄Ρ ΠΈΠ· ΡΠΈΠΏΠ° ΠΈ Π²ΠΈΠ΄Π° ΡΡΠΈΡΡΠ°, Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈ Π½Π°ΡΡΡΠΎΠ΅ΠΊ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΡ. Π§ΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π΄Π°Π½Π½ΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ. ΠΠΎΠΏΡΡΡΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅, Π½ΠΎ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π½Π°Π΄ΠΎ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΡΡΡ ΡΠΈΡΠ°Π±Π΅Π»ΡΠ½ΠΎΡΡΡ ΡΠ΅ΠΊΡΡΠ°.
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ
letter-spacing: Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ | normal | inherit
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ
Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡΡΡ Π»ΡΠ±ΡΠ΅ Π΅Π΄ΠΈΠ½ΠΈΡΡ Π΄Π»ΠΈΠ½Ρ, ΠΏΡΠΈΠ½ΡΡΡΠ΅ Π² CSS β Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΈΠΊΡΠ΅Π»Ρ (px), Π΄ΡΠΉΠΌΡ (in), ΠΏΡΠ½ΠΊΡΡ (pt) ΠΈ Π΄Ρ. ΠΠ°ΠΈΠ»ΡΡΡΠΈΠΉ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡ ΠΎΡΠ½ΠΎΠ²Π°Π½Π½ΡΡ Π½Π° ΡΠ°Π·ΠΌΠ΅ΡΠ΅ ΡΡΠΈΡΡΠ° (em ΠΈ ex).
- normal
- ΠΠ°Π΄Π°Π΅Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΊΠ°ΠΊ ΠΎΠ±ΡΡΠ½ΠΎ.
- inherit
- ΠΠ°ΡΠ»Π΅Π΄ΡΠ΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΠ΄ΠΈΡΠ΅Π»Ρ.
ΠΡΠΈΠΌΠ΅Ρ
HTML5CSS2.1IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>letter-spacing</title>
<style>
p {
letter-spacing: 5px;
}
</style>
</head>
<body>
<h2>Duis te feugifacilisi</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem
nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.
Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit
lobortis nisl ut aliquip ex ea commodo consequat.</p>
</body>
</html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. ΠΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° letter-spacing
ΠΠ±ΡΠ΅ΠΊΡΠ½Π°Ρ ΠΌΠΎΠ΄Π΅Π»Ρ
[window.]document.getElementById(«elementID»).style.letterSpacing
ΠΡΠ°ΡΠ·Π΅ΡΡ
Internet Explorer Π΄ΠΎ Π²Π΅ΡΡΠΈΠΈ 7.0 Π²ΠΊΠ»ΡΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ inherit.
letter-spacing | CSS | WebReference
ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠ°ΡΠ·Π΅ΡΡ ΠΎΠ±ΡΡΠ½ΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ, ΠΈΡΡ ΠΎΠ΄Ρ ΠΈΠ· ΡΠΈΠΏΠ° ΠΈ Π²ΠΈΠ΄Π° ΡΡΠΈΡΡΠ°, Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈ Π½Π°ΡΡΡΠΎΠ΅ΠΊ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΡ. Π§ΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π΄Π°Π½Π½ΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ. ΠΠΎΠΏΡΡΡΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅, Π½ΠΎ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π½Π°Π΄ΠΎ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΡΡΡ ΡΠΈΡΠ°Π±Π΅Π»ΡΠ½ΠΎΡΡΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠ°ΡΠΊΠ°Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ | normal |
---|---|
ΠΠ°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ | ΠΠ° |
ΠΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ | ΠΠΎ Π²ΡΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ |
ΠΠ½ΠΈΠΌΠΈΡΡΠ΅ΡΡΡ | ΠΠ° |
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ ?
letter-spacing: <ΡΠ°Π·ΠΌΠ΅Ρ> | normal
ΠΠ±ΠΎΠ·Π½Π°ΡΠ΅Π½ΠΈΡ
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ | ΠΡΠΈΠΌΠ΅Ρ | |
---|---|---|
<ΡΠΈΠΏ> | Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΈΠΏ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. | <ΡΠ°Π·ΠΌΠ΅Ρ> |
AΒ &&Β B | ΠΠ½Π°ΡΠ΅Π½ΠΈΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π²ΡΠ²ΠΎΠ΄ΠΈΡΡΡΡ Π² ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅. | <ΡΠ°Π·ΠΌΠ΅Ρ> && <ΡΠ²Π΅Ρ> |
A | B | Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π½Π°Π΄ΠΎ Π²ΡΠ±ΡΠ°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈΠ· ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½Π½ΡΡ (A ΠΈΠ»ΠΈ B). | normal | small-caps |
A || B | ΠΠ°ΠΆΠ΄ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΈΠ»ΠΈ ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ Π² ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ»ΡΠ½ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅. | width || count |
[ ] | ΠΡΡΠΏΠΏΠΈΡΡΠ΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. | [ crop || cross ] |
* | ΠΠΎΠ²ΡΠΎΡΡΡΡ Π½ΠΎΠ»Ρ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π·. | [,<Π²ΡΠ΅ΠΌΡ>]* |
+ | ΠΠΎΠ²ΡΠΎΡΡΡΡ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π·. | <ΡΠΈΡΠ»ΠΎ>+ |
? | Π£ΠΊΠ°Π·Π°Π½Π½ΡΠΉ ΡΠΈΠΏ, ΡΠ»ΠΎΠ²ΠΎ ΠΈΠ»ΠΈ Π³ΡΡΠΏΠΏΠ° Π½Π΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΌ. | inset? |
{A, B} | ΠΠΎΠ²ΡΠΎΡΡΡΡ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅ A, Π½ΠΎ Π½Π΅ Π±ΠΎΠ»Π΅Π΅ B ΡΠ°Π·. | <ΡΠ°Π΄ΠΈΡΡ>{1,4} |
# | ΠΠΎΠ²ΡΠΎΡΡΡΡ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π· ΡΠ΅ΡΠ΅Π· Π·Π°ΠΏΡΡΡΡ. | <Π²ΡΠ΅ΠΌΡ># |
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ
Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡΡΡ Π»ΡΠ±ΡΠ΅ Π΅Π΄ΠΈΠ½ΠΈΡΡ Π΄Π»ΠΈΠ½Ρ, ΠΏΡΠΈΠ½ΡΡΡΠ΅ Π² CSS β Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΈΠΊΡΠ΅Π»ΠΈ (px), Π΄ΡΠΉΠΌΡ (in), ΠΏΡΠ½ΠΊΡΡ (pt) ΠΈ Π΄Ρ. ΠΠ°ΠΈΠ»ΡΡΡΠΈΠΉ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡ, ΠΎΡΠ½ΠΎΠ²Π°Π½Π½ΡΡ Π½Π° ΡΠ°Π·ΠΌΠ΅ΡΠ΅ ΡΡΠΈΡΡΠ° (em ΠΈ ex).
- normal
- ΠΠ°Π΄Π°ΡΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΊΠ°ΠΊ ΠΎΠ±ΡΡΠ½ΠΎ.
ΠΠ΅ΡΠΎΡΠ½ΠΈΡΠ°
ΠΠΈΠ½Π½ΠΈ-ΠΡΡ Π±ΡΠ» Π²ΡΠ΅Π³Π΄Π° Π½Π΅ ΠΏΡΠΎΡΡ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΊΡΠ΅ΠΏΠΈΡΡΡΡ, Π² ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠΈ ΡΠ°ΡΠΎΠ² Π² ΠΎΠ΄ΠΈΠ½Π½Π°Π΄ΡΠ°ΡΡ ΡΡΡΠ°, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π² ΡΡΠΎ Π²ΡΠ΅ΠΌΡ Π·Π°Π²ΡΡΠ°ΠΊ ΡΠΆΠ΅ Π΄Π°Π²Π½ΠΎ ΠΎΠΊΠΎΠ½ΡΠΈΠ»ΡΡ, Π° ΠΎΠ±Π΅Π΄ Π΅ΡΡ ΠΈ Π½Π΅ Π΄ΡΠΌΠ°Π» Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ. Π, ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ, ΠΎΠ½ ΡΡΡΠ°ΡΠ½ΠΎ ΠΎΠ±ΡΠ°Π΄ΠΎΠ²Π°Π»ΡΡ, ΡΠ²ΠΈΠ΄Π΅Π², ΡΡΠΎ ΠΡΠΎΠ»ΠΈΠΊ Π΄ΠΎΡΡΠ°ΡΡ ΡΠ°ΡΠΊΠΈ ΠΈ ΡΠ°ΡΠ΅Π»ΠΊΠΈ.
ΠΡΠΈΠΌΠ΅Ρ
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>letter-spacing</title> <style> em { letter-spacing: 2px; } </style> </head> <body> <p>ΠΡΠ»ΡΠΌΠΈΠ½Π°ΡΠΈΡ, ΠΏΠΎΡΠ»Π΅ ΠΎΡΡΠΎΡΠΎΠΆΠ½ΠΎΠ³ΠΎ Π°Π½Π°Π»ΠΈΠ·Π°, ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅ΡΠ΅ΡΠΊΠΈΠ²Π°Π΅Ρ ΡΠΊΠ²Π°ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΠΉ Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΊΡΡΠ³ Π½Π΅Π±Π΅ΡΠ½ΠΎΠΉ ΡΡΠ΅ΡΡ, ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ»ΡΡΠΈΠ»ΠΎΡΡ Π² 1994 Π³ΠΎΠ΄Ρ Ρ ΠΊΠΎΠΌΠ΅ΡΠΎΠΉ <em>Π¨ΡΠΌΠ΅ΠΉΠΊΠ΅pΠΎΠ²-ΠΠ΅Π²ΠΈ 9</em>.</p> </body> </html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. ΠΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° letter-spacing
ΠΠ±ΡΠ΅ΠΊΡΠ½Π°Ρ ΠΌΠΎΠ΄Π΅Π»Ρ
ΠΠ±ΡΠ΅ΠΊΡ.style.letterSpacing
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ?
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ
ΠΠ°ΠΆΠ΄Π°Ρ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΏΡΠΎΡ ΠΎΠ΄ΠΈΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠ°Π΄ΠΈΠΉ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½ΠΈΡ.
- Recommendation (Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½Π° W3C ΠΈ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΠΎΠ²Π°Π½Π° ΠΊΠ°ΠΊ ΡΡΠ°Π½Π΄Π°ΡΡ.
- Candidate Recommendation (ΠΠΎΠ·ΠΌΠΎΠΆΠ½Π°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β Π³ΡΡΠΏΠΏΠ°, ΠΎΡΠ²Π΅ΡΠ°ΡΡΠ°Ρ Π·Π° ΡΡΠ°Π½Π΄Π°ΡΡ, ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠ΅Π½Π°, ΠΊΠ°ΠΊ ΠΎΠ½ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΡΠ²ΠΎΠΈΠΌ ΡΠ΅Π»ΡΠΌ, Π½ΠΎ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΠΎΠΌΠΎΡΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΠΏΠΎ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
- Proposed Recommendation (ΠΡΠ΅Π΄Π»Π°Π³Π°Π΅ΠΌΠ°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ) β Π½Π° ΡΡΠΎΠΌ ΡΡΠ°ΠΏΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ Π½Π° ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΠ΅ ΠΠΎΠ½ΡΡΠ»ΡΡΠ°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠΎΠ²Π΅ΡΠ° W3C Π΄Π»Ρ ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΡΡΠ²Π΅ΡΠΆΠ΄Π΅Π½ΠΈΡ.
- Working Draft (Π Π°Π±ΠΎΡΠΈΠΉ ΠΏΡΠΎΠ΅ΠΊΡ) β Π±ΠΎΠ»Π΅Π΅ Π·ΡΠ΅Π»Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊΠ° ΠΏΠΎΡΠ»Π΅ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ ΠΈ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠΏΡΠ°Π²ΠΎΠΊ Π΄Π»Ρ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ.
- Editor’s draft (Π Π΅Π΄Π°ΠΊΡΠΎΡΡΠΊΠΈΠΉ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊ) β ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ° ΠΏΠΎΡΠ»Π΅ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΡΠ°Π²ΠΎΠΊ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°ΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
- Draft (Π§Π΅ΡΠ½ΠΎΠ²ΠΈΠΊ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ) β ΠΏΠ΅ΡΠ²Π°Ρ ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
ΠΡΠ°ΡΠ·Π΅ΡΡ
Π ΡΠ°Π±Π»ΠΈΡΠ΅ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠ² ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΎΠ±ΠΎΠ·Π½Π°ΡΠ΅Π½ΠΈΡ.
- Β β ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ Π΄ΠΎΠΏΡΡΡΠΈΠΌΡΠΌΠΈ Π·Π½Π°ΡΠ΅Π½ΠΈΡΠΌΠΈ;
- Β β ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ Π½Π΅ Π²ΠΎΡΠΏΡΠΈΠ½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΈ ΠΈΠ³Π½ΠΎΡΠΈΡΡΠ΅ΡΡΡ;
- Β β ΠΏΡΠΈ ΡΠ°Π±ΠΎΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΎΡΠΈΠ±ΠΎΠΊ, Π»ΠΈΠ±ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π»ΠΈΡΡ ΡΠ°ΡΡΠΈΡΠ½ΠΎ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π΅ Π²ΡΠ΅ Π΄ΠΎΠΏΡΡΡΠΈΠΌΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π΄Π΅ΠΉΡΡΠ²ΡΡΡ ΠΈΠ»ΠΈ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π½Π΅ ΠΊΠΎ Π²ΡΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΊΠ°Π·Π°Π½Ρ Π² ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ.
Π§ΠΈΡΠ»ΠΎ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π²Π΅ΡΡΠΈΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ°, Π½Π°ΡΠΈΠ½Π°Ρ Ρ ΠΊΠΎΡΠΎΡΠΎΠΉ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ.
ΓΠΠ²ΡΠΎΡ ΠΈ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΡ
ΠΠ²ΡΠΎΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
ΠΠΎΡΠ»Π΅Π΄Π½Π΅Π΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅: 05.09.2017
Π Π΅Π΄Π°ΠΊΡΠΎΡΡ: ΠΠ»Π°Π΄ ΠΠ΅ΡΠΆΠ΅Π²ΠΈΡ
CSS: letter-spacing
ΠΡΠΈ Π²Π΅ΡΡΡΠΊΠ΅ ΡΠ°ΠΉΡΠ° ΠΎΠ±ΡΡΠ½ΠΎ Π²ΠΎΠ·Π½ΠΈΠΊΠ°ΡΡ Π²ΡΡΠΊΠΎΠ³ΠΎ ΡΠΎΠ΄Π° ΡΡΠ΅Π±ΠΎΠ²Π°Π½ΠΈΡ ΠΊ ΡΠ΅ΠΊΡΡΡ: Π³Π΄Π΅-ΡΠΎ Π½ΡΠΆΠ½ΠΎ Π²ΡΠ΄Π΅Π»ΠΈΡΡ Π΅Π³ΠΎ Π·Π°Π³Π»Π°Π²Π½ΡΠΌΠΈ Π±ΡΠΊΠ²Π°ΠΌΠΈ, Π³Π΄Π΅-ΡΠΎ ΡΠ°ΡΡΡΠ½ΡΡΡ, Π° ΠΈΠ½ΠΎΠ³Π΄Π° Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΡ Π² ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΠΈ ΠΈΠ»ΠΈ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΠΈ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ.
ΠΠΎΡΠ»Π΅ Π½Π΅Π΄ΠΎΠ»Π³ΠΈΡ ΡΠ°Π·Π΄ΡΠΌΠΈΠΉ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΅ΡΠΈΡΡ, ΡΡΠΎ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠ³ΠΎ ΡΠΎΠ΄Π° Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΡ Ρ Π²Π°Ρ Π½Π΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ½Π΅Ρ.Β ΠΠ΄Π½Π°ΠΊΠΎ, Π½Π°ΡΠΎΠ΄Π½Π°Ρ ΠΌΡΠ΄ΡΠΎΡΡΡ Π³Π»Π°ΡΠΈΡ: «ΠΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ Π³ΠΎΠ²ΠΎΡΠΈ Π½ΠΈΠΊΠΎΠ³Π΄Π°». ΠΡΠΎ ΠΈΠ·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ ΡΠΌΠ΅ΡΡΠ½ΠΎ, Π΅ΡΠ»ΠΈ Π²Ρ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΠ΅ΡΡ Π²Π΅ΡΡΡΠΊΠΎΠΉ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ.
ΠΠΈΠΊΡΠΎ Π½Π΅ Π΄Π°ΡΡ Π³Π°ΡΠ°Π½ΡΠΈΠΉ, ΡΡΠΎ Π²Π°Ρ ΠΎΡΠ΅ΡΠ΅Π΄Π½ΠΎΠΉ Π·Π°ΠΊΠ°Π·ΡΠΈΠΊ Π½Π΅ Π·Π°Ρ
ΠΎΡΠ΅Ρ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π». ΠΡ ΠΈΠ»ΠΈ Π½Π°ΠΎΠ±ΠΎΡΠΎΡ, ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ. Π Π΄Π°Π½Π½ΠΎΠΌ CSS ΡΡΠΎΠΊΠ΅ ΠΌΡ ΡΡΠΈΠΌΡΡ ΡΡΠΎ Π΄Π΅Π»Π°ΡΡ, Π° ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π½Π°ΠΌ Π² ΡΡΠΎΠΌ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing
.
ΠΠΈΠ΄Π΅ΠΎΠ²Π΅ΡΡΠΈΡ:
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing
ΠΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΡΡΠΎΠ³ΠΎ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΠΌΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»ΠΎΠΌ. Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΡΡ ΡΠ΅ ΠΆΠ΅ Π΅Π΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ ΠΏΡΠΈ Π·Π°Π΄Π°Π½ΠΈΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΡΠ΅ΠΊΡΡΠ°. Π ΡΠ²ΡΠ·ΠΈ Ρ ΡΡΠΈΠΌ ΡΠΎΠ²Π΅ΡΡΡ ΠΈΠ·ΡΡΠΈΡΡ ΡΡΠΎΠΊ ΠΏΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡ ΡΠ΅ΠΊΡΡΠ°, Π΅ΡΠ»ΠΈ Π²Ρ ΡΡΠΎΠ³ΠΎ Π΅ΡΠ΅ Π½Π΅ ΡΠ΄Π΅Π»Π°Π»ΠΈ. Π‘ΠΏΠ΅ΡΠ²Π°, Π΄Π°Π²Π°ΠΉΡΠ΅ ΠΏΠΎΠΏΡΠΎΠ±ΡΠ΅ΠΌ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» Π½Π° 2 px.
body { letter-spacing: 2px; }
ΠΡΠ΅ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎ: ΠΌΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΠΌ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing
Β ΠΈ ΡΡΠ΅Π±ΡΠ΅ΠΌΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π² ΡΠ΅Ρ
ΠΈΠ»ΠΈ ΠΈΠ½ΡΡ
Π΅Π΄ΠΈΠ½ΠΈΡΠ°Ρ
ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ. ΠΠ°Π²Π°ΠΉΡΠ΅ ΠΊ ΠΏΡΠΈΠΌΠ΅ΡΡ, ΠΏΠΎΠΏΡΠΎΠ±ΡΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ em
.
body { letter-spacing: .1em; }
ΠΠ°ΠΊ ΠΈ Π² ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌ ΡΠ»ΡΡΠ°Π΅, ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ ΡΠ²Π΅Π»ΠΈΡΠΈΠ»ΠΎΡΡ, Π½ΠΎ Π΅ΡΠ΅ Π½Π° Π±ΠΎΠ»ΡΡΡΡ Π²Π΅Π»ΠΈΡΠΈΠ½Ρ. Π Π΅Π·ΡΠ»ΡΡΠ°Ρ ΠΎΠ±Π΅ΠΈΡ CSS ΠΏΡΠ°Π²ΠΈΠ» ΠΌΠΎΠΆΠ½ΠΎ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π½Π° ΠΈΠ»Π»ΡΡΡΡΠ°ΡΠΈΠΈ Π½ΠΈΠΆΠ΅.
Π£Π²Π΅Π»ΠΈΡΠ΅Π½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΡΠ΅Π½Ρ Ρ ΠΎΡΠΎΡΠΈΠΌ ΠΏΡΠΈΠ΅ΠΌΠΎΠΌ Π΄Π»Ρ Π°ΠΊΡΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ ΡΠΈΡΠ°ΡΠ΅Π»Ρ Π½Π° ΠΊΠ°ΠΊΠΎΠΌ-ΡΠΎ ΡΠ»ΠΎΠ²Π΅. Π’Π°ΠΊ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ Π½Π° Π½Π΅ΠΊΠΎΡΠΎΡΡΡ Π±Π»ΠΎΠ³Π°Ρ ΡΠ»ΠΎΠ²Π° Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ Π² ΠΏΠΎΠ»ΡΠΆΠΈΡΠ½ΠΎΠΌ Π½Π°ΡΠ΅ΡΡΠ°Π½ΠΈΠΈ, Π½ΠΎ ΠΈ Ρ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½Π½ΡΠΌ ΠΌΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»ΠΎΠΌ.
Π£ΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π² ΡΡΠΎΡΠΎΠ½Ρ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΡ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π° ΠΎΠ΄ΠΈΠ½ ΠΏΠΈΠΊΡΠ΅Π»Ρ:
body { letter-spacing: -1px; }
ΠΠΎΡ ΠΊΠ°ΠΊ ΡΡΠΎ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ Π½Π° ΠΏΡΠ°ΠΊΡΠΈΠΊΠ΅:
ΠΠ΄Π½Π°ΠΊΠΎ, Ρ ΠΎΡΡ Π²Π°Ρ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅Π΄ΠΈΡΡ —Β ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΡΠΎΡΠΎΠΆΠ½ΠΎ, ΠΈΠ½Π°ΡΠ΅ Π±ΡΠΊΠ²Ρ ΠΌΠΎΠ³ΡΡ Π½Π°Π»ΠΎΠΆΠΈΡΡΡΡ Π΄ΡΡΠ³ Π½Π° Π΄ΡΡΠ³Π°.
ΠΠ°ΡΠ»Π΅Π΄ΠΎΠ²Π°Π½ΠΈΠ΅
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎΒ letter-spacing
ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π°ΡΠ»Π΅Π΄ΡΠ΅ΠΌΡΠΌ. ΠΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ² ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π΄Π»Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, Π²Π»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ Π² Π½Π΅Π³ΠΎ ΡΠ΅Π³ΠΈ ΡΠ½Π°ΡΠ»Π΅Π΄ΡΡΡΒ ΡΡΠΈ ΠΆΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΠ΅Π΄ΡΡΠ°Π²ΠΈΠΌ ΡΡΠΎ ΠΌΡ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΈ ΠΌΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ Π΄Π»Ρ ΠΊΡΡΠΊΠ° ΡΠ΅ΠΊΡΡΠ° Ρ ΠΊΠ»Π°ΡΡΠΎΠΌ morning
(<div>
).
Π’Π΅ΠΏΠ΅ΡΡ, Π²ΡΠ΅ Π²Π»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ Π² Π½Π΅Π³ΠΎ Π°Π±Π·Π°ΡΡ Π±ΡΠ΄ΡΡ Π½Π°ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΠ΄ΠΈΡΠ΅Π»Ρ. ΠΠ»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠ΅ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ Π΄Π»Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ· Π°Π±Π·Π°ΡΠ΅Π², Π½ΡΠΆΠ½ΠΎ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π²ΡΠ΅ ΡΠ΅ΠΌ ΠΆΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎΠΌΒ letter-spacing
, ΡΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΠ΄Π°Π² Π΅ΠΌΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ normal
.
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅Β normal Π²ΡΠ΅Π³Π΄Π° Π±ΡΠ΄Π΅Ρ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°ΡΡ ΡΠ΅ΠΊΡΡ ΠΊ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠΌΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ.
Π’Π°ΠΊΠΆΠ΅ ΠΈ Π½Π°ΠΎΠ±ΠΎΡΠΎΡ, Π΅ΡΠ»ΠΈ ΠΌΡ Π·Π°Ρ
ΠΎΡΠΈΠΌ ΠΎΡ ΠΊΠ°ΠΊΠΎΠ³ΠΎ-Π½ΠΈΠ±ΡΠ΄Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΡΠ½Π°ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΡΠΎΠ΄ΠΈΡΠ΅Π»Ρ, Π²ΠΏΠΎΡΡ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎΠΌ inherit
.
Π ΠΎΠ±ΡΠ΅ΠΌ, ΠΊΠ°ΠΊ Π²ΠΈΠ΄ΠΈΡΠ΅, Π² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΈ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»ΠΎΠΌ Π½Π΅Ρ Π½ΠΈΡΠ΅Π³ΠΎ ΡΠ»ΠΎΠΆΠ½ΠΎΠ³ΠΎ. ΠΠ»Π°Π²Π½ΠΎΠ΅ — Π½Π΅ Π·Π°Π±ΡΠ²Π°ΠΉΡΠ΅ ΠΏΡΠΎ ΡΠ΄ΠΎΠ±ΡΡΠ²ΠΎ ΡΠΈΡΠ°ΡΠ΅Π»Ρ.
Π Π½Π° ΡΡΠΎΠΌ Ρ ΠΌΠ΅Π½Ρ Π²ΡΠ΅. Π‘ΠΌΠ΅Ρ ΠΏΡΠ΅Π΄ΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΡΡΠΎ Π²Π°ΠΌ Π²ΡΠ΅ ΠΏΠΎΠ½ΡΡΠ½ΠΎ, Π΅ΡΠ»ΠΈ Π½Π΅Ρ — Π·Π°Π΄Π°Π²Π°ΠΉΡΠ΅ ΡΠ²ΠΎΠΈ Π²ΠΎΠΏΡΠΎΡΡ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ . ΠΠ°Π΄Π΅ΡΡΡ, Π΄Π°Π½Π½ΡΠΉ ΡΡΠΎΠΊ ΠΏΠΎ CSS Π±ΡΠ» Π΄Π»Ρ Π²Π°Ρ ΠΏΠΎΠ»Π΅Π·Π΅Π½. ΠΡΠ»ΠΈ ΡΡΠΎ ΡΠ°ΠΊ, ΡΠ΄Π΅Π»Π°ΠΉΡΠ΅ ΡΠ΅ΠΏΠΎΡΡ Π΄Π°Π½Π½ΠΎΠΉ ΡΡΠ°ΡΡΠΈΒ Π² ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΡΡ , ΡΡΠΎΠ±Ρ Π±ΠΎΠ»ΡΡΠ΅ Π»ΡΠ΄Π΅ΠΉ ΠΏΠΎΠ»ΡΡΠΈΠ»ΠΈ ΠΎΡ Π½Π΅Π΅Β ΠΏΠΎΠ»ΡΠ·Ρ.
line-height, letter-spacing, word-spacing β ΡΡΠ΅Π±Π½ΠΈΠΊ CSS
Π Π°Π±ΠΎΡΠ°Ρ ΡΠΎ ΡΡΠΈΠ»Π΅ΠΌ Π΄Π»Ρ ΡΠ΅ΠΊΡΡΠ°, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΡΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ, ΡΠ»ΠΎΠ²Π°ΠΌΠΈ ΠΈ ΡΡΡΠΎΠΊΠ°ΠΌΠΈ. ΠΠ°Π΄Π°ΡΡΡΡ ΡΠ°ΠΊΠΈΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ Π² Π»ΡΠ±ΡΡ
Π΅Π΄ΠΈΠ½ΠΈΡΠ°Ρ
ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ CSS, Π±ΡΠ΄Ρ-ΡΠΎ px
, pt
, em
ΠΈΠ»ΠΈ Π΄ΡΡΠ³ΠΎΠ΅. ΠΡΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΠ²Π»ΡΡΡΡΡ ΠΏΡΠΎΡΠ΅Π½ΡΡ β Ρ ΠΈΡ
ΠΏΠΎΠΌΠΎΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠΎΠΊΠ°ΠΌΠΈ (ΠΈΠ½ΡΠ΅ΡΠ»ΠΈΠ½ΡΡΠΆ), Π½ΠΎ ΠΎΠ½ΠΈ Π½Π΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΏΡΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ΅ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΈΠ»ΠΈ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ.
ΠΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» CSS: letter-spacing
ΠΠ°Π΄Π°ΡΡ ΠΌΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠΎΠΆΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° CSS letter-spacing. ΠΠΎΠΌΠΈΠΌΠΎ ΠΎΠ±ΡΡΠ½ΡΡ
Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ (ΠΏΠΎΠ»ΠΎΠΆΠΈΡΠ΅Π»ΡΠ½ΡΡ
ΠΈ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ
) ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΡ inherit
(ΡΡΠΎΠ±Ρ Π½Π°ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»Ρ) ΠΈ normal
(Π΅ΡΠ»ΠΈ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π²Π΅ΡΠ½ΡΡΡ Π½ΠΎΡΠΌΠ°Π»ΡΠ½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ).
ΠΡΠΈΠΌΠ΅Ρ Π·Π°ΠΏΠΈΡΠΈ ΠΌΠ΅ΠΆΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π°:
p { letter-spacing: 2em; }
ΠΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ: word-spacing
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ CSS word-spacing ΠΎΡΠ»ΠΈΡΠ°Π΅ΡΡΡ ΠΎΡ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅Π³ΠΎ ΡΠ΅ΠΌ, ΡΡΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, Π° Π½Π΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ. ΠΠ»Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π° ΡΠΎΠΆΠ΅ ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΡnormal
ΠΈ inherit
. ΠΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. ΠΠΈΠΆΠ΅ ΠΏΠΎΠΊΠ°Π·Π°Π½ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°ΠΏΠΈΡΠΈ ΡΡΠΈΠ»Ρ:p { word-spacing: 6px; }
ΠΠ΅ΠΆΡΡΡΠΎΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»: line-height
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° CSS line-height ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠΎΠΊΠ°ΠΌΠΈ ΡΠ΅ΠΊΡΡΠ°. ΠΠ°ΠΊ Π±ΡΠ»ΠΎ ΡΠΊΠ°Π·Π°Π½ΠΎ Π² Π½Π°ΡΠ°Π»Π΅ ΡΠ΅ΠΌΡ, Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΈΠ½ΡΠ΅ΡΠ»ΠΈΠ½ΡΡΠΆΠ°, ΠΏΠΎΠΌΠΈΠΌΠΎ Π΄ΡΡΠ³ΠΈΡ
Π΅Π΄ΠΈΠ½ΠΈΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, Π΄ΠΎΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΡΠΎΡΠ΅Π½ΡΡ. Π’Π°ΠΊΠΆΠ΅ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΎ Π·Π°ΠΏΠΈΡΡΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π² Π²ΠΈΠ΄Π΅ ΠΌΠ½ΠΎΠΆΠΈΡΠ΅Π»Ρ (ΡΠΈΡΠ»Π° Π±ΠΎΠ»ΡΡΠ΅ 0): Π΄Π»Ρ Π²ΡΡΠΈΡΠ»Π΅Π½ΠΈΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ Π±ΡΠ°ΡΠ·Π΅Ρ ΡΠΌΠ½ΠΎΠΆΠΈΡ ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠΈΡΡΠ° Π½Π° Π·Π°Π΄Π°Π½Π½ΠΎΠ΅ ΡΠΈΡΠ»ΠΎ. ΠΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Π½Π΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ. ΠΠΎΡΡΡΠΏΠ½Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΡ normal
ΠΈ inherit
.
ΠΠΈΠΆΠ΅ β ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΌΠ΅ΠΆΡΡΡΠΎΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» CSS:
p { line-height: 180%; }
ΠΠ° ΡΠΊΡΠΈΠ½ΡΠΎΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΠΊΠ°ΠΊ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠ΅ΠΊΡΡ ΡΠΎ Π²ΡΠ΅ΠΌΠΈ ΡΡΠ΅ΠΌΡ ΡΠ²ΠΎΠΉΡΡΠ²Π°ΠΌΠΈ:
ΠΡΠΎΠ³ΠΈ
Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΈΠ»ΠΈ ΡΡΡΠΎΠΊΠ°ΠΌΠΈ, Π² ΠΏΠ΅ΡΠ²ΡΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ ΡΠ»Π΅Π΄ΠΈΡΠ΅ Π·Π° ΡΠ΅ΠΌ, ΡΡΠΎΠ±Ρ ΡΠ΅ΠΊΡΡ Π² ΠΈΡΠΎΠ³Π΅ Π±ΡΠ» Π»Π΅Π³ΠΊΠΎ ΡΠΈΡΠ°Π΅ΠΌ. Π‘ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠΌΠΈ ΡΠ²ΠΎΠΉΡΡΠ²Π°ΠΌΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΎΠ±ΡΠ°ΡΠ°ΡΡΡΡ Π°ΠΊΠΊΡΡΠ°ΡΠ½ΠΎ ΠΈ Π²ΡΠ΅Π³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΈΡ Π² ΠΌΠ΅ΡΡ, Π±Π΅Π· ΡΠ°Π½Π°ΡΠΈΠ·ΠΌΠ°, ΠΈΠ½Π°ΡΠ΅ Π²ΡΠ΅ ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π³ΡΠΎΠ·ΠΈΡ ΠΏΡΠ΅Π²ΡΠ°ΡΠΈΡΡΡΡ Π² Π½Π΅ΡΠ°Π·Π±ΠΎΡΡΠΈΠ²ΡΠΉ Π½Π°Π±ΠΎΡ Π±ΡΠΊΠ².
ΠΠ°Π»Π΅Π΅ Π² ΡΡΠ΅Π±Π½ΠΈΠΊΠ΅: Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° Π² CSS β ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ text-align.
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing | CSS ΡΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ
CSS ΡΠ²ΠΎΠΉΡΡΠ²Π°ΠΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅
CSS ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°Π΅Ρ ΠΈΠ»ΠΈ ΡΠΌΠ΅Π½ΡΡΠ°Π΅Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅.
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ
CSS ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ:
letter-spacing:"normal | length | initial | inherit";
JavaScript ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ:
object.style.letterSpacing = "5px"
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ ΡΠ²ΠΎΠΉΡΡΠ²Π°
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
---|---|
normal | ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΎΡΡΡΡΡΡΠ²ΡΠ΅Ρ. ΠΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. |
length | ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ (Π΅Π΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠ΅ Π² CSS). ΠΠΎΠΏΡΡΠΊΠ°ΡΡΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. |
initial | Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅Ρ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π² Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. |
inherit | Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π½Π°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ ΠΎΡ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. |
ΠΠ΅ΡΡΠΈΡ CSS
CSS1ΠΠ°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ
ΠΠ°.ΠΠ½ΠΈΠΌΠΈΡΡΠ΅ΠΌΠΎΠ΅
ΠΠ°.ΠΡΠΈΠΌΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ
<!DOCTYPE html> <html> <head> <title>Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing.</title> <style> .test { letter-spacing : -1px; /* Π·Π°Π΄Π°ΡΠΌ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅. */ } .test2 { letter-spacing : normal; /* Π·Π°Π΄Π°ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅ (Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ). */ } .test3 { letter-spacing : 2px; /* Π·Π°Π΄Π°ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅. */ }ΠΡΠΈΠΌΠ΅Ρ ΡΠ²Π΅Π»ΠΈΡΠ΅Π½ΠΈΡ ΠΈ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅.CSS ΡΠ²ΠΎΠΉΡΡΠ²Π°.test4 { letter-spacing : 10px; /* Π·Π°Π΄Π°ΡΠΌ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅. */ } </style> </head> <body> <div class = "test">letter-spacing: -1px</div> <div class = "test2">letter-spacing: normal</div> <div class = "test3">letter-spacing: 2px</div> <div class = "test4">letter-spacing: 10px</div> </body> </html>
Π£ΠΌΠ΅Π½ΡΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ css. Π‘Π²ΠΎΠΉΡΡΠ²Π° CSS
ΠΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠ³ΠΎ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° Π² ΡΠ΅ΠΊΡΡΠ΅ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡΡΡΡ Π΄Π»Ρ ΡΠΈΠΊΡΠ°ΡΠΈΠΈ Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ Π½Π° Π΅Π³ΠΎ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ ΡΡΠ°ΡΡΠΊΠ°Ρ . Π§ΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π² Π²ΠΎΡΠ΄Π΅, Π½ΡΠΆΠ½ΠΎ Π²ΡΠΏΠΎΠ»Π½ΠΈΡΡ ΠΏΡΠΈΠ²ΠΎΠ΄ΠΈΠΌΡΡ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΠ΅Π»ΡΠ½ΠΎΡΡΡ Π΄Π΅ΠΉΡΡΠ²ΠΈΠΉ.
ΠΠΎΡΡΠ΅ΠΊΡΠΈΡΠΎΠ²ΠΊΠ° ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π°
Π§ΡΠΎΠ±Ρ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ, ΡΠ»Π΅Π΄ΡΠ΅Ρ Π²ΡΠ±ΡΠ°ΡΡ Β«Π Π°Π·ΡΠ΅ΠΆΠ΅Π½Π½ΡΠΉΒ».
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ°ΡΡΠΈΡΠΈΡΡ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ Π½Π° 1 ΠΏΡΠ½ΠΊΡ, ΡΠ°Π²Π½ΡΠΉ 0,35 ΠΌΠΌ. ΠΠ»Ρ ΡΠ΄ΠΎΠ±ΡΡΠ²Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ ΡΠ°ΡΡΠΈ ΠΏΡΠΈΠ²Π΅Π΄ΡΠ½ ΠΎΠ±ΡΠ°Π·Π΅Ρ, ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡΠΈΠΉ, ΠΊΠ°ΠΊ Π±ΡΠ΄Π΅Ρ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ΅ΠΊΡΡ. ΠΡΠ΅Π²ΠΈΠ΄Π½ΠΎ, ΡΡΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΌΠΎΠΆΠ΅Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π² 1 ΠΏΡΠ½ΠΊΡ, Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΡ ΡΡΠ΅ΡΠ³ΠΎΠ»ΡΠ½ΠΈΠΊΠΎΠ² Π΄ΠΎΠ±Π°Π²Π»ΡΡ ΠΈΠ»ΠΈ ΡΠ±Π°Π²Π»ΡΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» Π½Π° 0,1 ΠΏΡ. ΠΡΡΠ³ΠΎΠΉ Π²Π°ΡΠΈΠ°Π½Ρ β Π½Π΅ΠΏΠΎΡΡΠ΅Π΄ΡΡΠ²Π΅Π½Π½ΠΎ Π²Π²Π΅ΡΡΠΈ Π² ΠΏΠΎΠ»Π΅ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° Π½ΡΠΆΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈ ΡΡΠ»ΠΊΠ½ΡΡΡ OK. ΠΠΎΠΆΠ½ΠΎ Π²Π²Π΅ΡΡΠΈ ΡΠΊΠΎΠ»Ρ ΡΠ³ΠΎΠ΄Π½ΠΎ Π±ΠΎΠ»ΡΡΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅.
Π§ΡΠΎΠ±Ρ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π», Π½Π°Π΄ΠΎ Π²ΡΠ±ΡΠ°ΡΡ Β«Π‘ΠΆΠ°ΡΡΠΉΒ».
ΠΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΌΠΎΠΆΠ΅Ρ ΡΠΎΠΊΡΠ°ΡΠΈΡΡ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌΡ ΡΠ»ΡΡΠ°Ρ β ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π½Π° 1 ΠΏΡ, ΠΈΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠ² ΠΆΠ΅Π»Π°Π΅ΠΌΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅. ΠΠ°ΠΊ Π²ΠΈΠ΄Π½ΠΎ ΠΏΠΎ ΠΎΠ±ΡΠ°Π·ΡΡ, Π² Π΄Π°Π½Π½ΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΡΠΏΠ»ΠΎΡΠ½Π΅Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ ΡΠΊΠ°Π·Π°Π»ΠΎΡΡ Π½Π° Π΅Π³ΠΎ ΡΠΈΡΠ°Π±Π΅Π»ΡΠ½ΠΎΡΡΠΈ.
Π Π°ΡΡΠΌΠΎΡΡΠ΅Π½Π½ΠΎΠ΅ Π²ΡΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° ΠΏΡΠΎΡ ΠΎΠ΄ΠΈΡ Π΄Π»Ρ Π²ΡΠ΅Ρ Π±ΡΠΊΠ² Π²ΡΠ΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ° ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ. Π ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠΌ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅ Word Π΅ΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» Π±ΠΎΠ»Π΅Π΅ ΡΠΎΠ½ΠΊΠΎ, ΡΡΠΈΡΡΠ²Π°Ρ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠΈ Π½Π°ΡΠ΅ΡΡΠ°Π½ΠΈΡ ΡΠΎΡΠ΅Π΄Π½ΠΈΡ Π±ΡΠΊΠ². ΠΡΠΈ Π²ΠΊΠ»ΡΡΡΠ½Π½ΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ ΠΊΠ΅ΡΠ½ΠΈΠ½Π³Π° Word Π²ΡΠ±ΠΈΡΠ°Π΅Ρ ΠΎΠΏΡΠΈΠΌΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΠΏΠ°ΡΠ°ΠΌΠΈ ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ² Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ, Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠ΅ΠΉ ΡΡΠΈΡΡΠ°. Π¦Π΅Π»Ρ ΠΊΠ΅ΡΠ½ΠΈΠ½Π³Π° β ΠΏΠΎΠ²ΡΡΠΈΡΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΡ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΠΎΡΡΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΠ½ΠΈΠΌΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΡΡΠ°Π²Π½Π΅Π½ΠΈΠ΅ Π΄Π²ΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΡ ΡΠΊΡΠΈΠ½ΡΠΎΡΠΎΠ² β Π΄ΠΎ ΠΈ ΠΏΠΎΡΠ»Π΅ ΠΊΠ΅ΡΠ½ΠΈΠ½Π³Π°, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π² ΡΡΠΎΠΌ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ. ΠΠ΅ΡΠ½ΠΈΠ½Π³ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π² ΡΠ΅ΠΊΡΡΠ°Ρ Ρ ΠΊΡΡΠΏΠ½ΡΠΌ ΡΡΠΈΡΡΠΎΠΌ β Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°Ρ ΠΈ Π»ΠΎΠ³ΠΎΡΠΈΠΏΠ°Ρ .
ΠΠΈΠ΄Π΅ΠΎ: ΠΠ°ΠΊ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ?
ΠΡΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ±ΡΠΊΠ²Π΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π»Π° Π²Π΅Π»ΠΎΡΡ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΊ Word 2010. Π Π²ΠΎΡΠ΄Π΅ Π±Π»ΠΈΠΆΠ°ΠΉΡΠΈΡ Π²Π΅ΡΡΠΈΠΉ β 2007 ΠΈ 2013 ΠΎΡΠ»ΠΈΡΠΈΠΉ Π½Π΅Ρ.
ΠΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΡΠ°ΡΠ·Π΅ΡΡ ΠΎΠ±ΡΡΠ½ΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ, ΠΈΡΡ ΠΎΠ΄Ρ ΠΈΠ· ΡΠΈΠΏΠ° ΠΈ Π²ΠΈΠ΄Π° ΡΡΠΈΡΡΠ°, Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈ Π½Π°ΡΡΡΠΎΠ΅ΠΊ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΡ. Π§ΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π΄Π°Π½Π½ΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ. ΠΠΎΠΏΡΡΡΠΈΠΌΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅, Π½ΠΎ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π½Π°Π΄ΠΎ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΡΡΡ ΡΠΈΡΠ°Π±Π΅Π»ΡΠ½ΠΎΡΡΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠ°ΡΠΊΠ°Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ
ΠΠ±ΠΎΠ·Π½Π°ΡΠ΅Π½ΠΈΡ
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ | ΠΡΠΈΠΌΠ΅Ρ | |
---|---|---|
Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΈΠΏ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. | ||
A && B | ΠΠ½Π°ΡΠ΅Π½ΠΈΡ Π΄ΠΎΠ»ΠΆΠ½Ρ Π²ΡΠ²ΠΎΠ΄ΠΈΡΡΡΡ Π² ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅. | && |
A | B | Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π½Π°Π΄ΠΎ Π²ΡΠ±ΡΠ°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΈΠ· ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½Π½ΡΡ (A ΠΈΠ»ΠΈ B). | normal | small-caps |
A || B | ΠΠ°ΠΆΠ΄ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΈΠ»ΠΈ ΡΠΎΠ²ΠΌΠ΅ΡΡΠ½ΠΎ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ Π² ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ»ΡΠ½ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅. | width || count |
ΠΡΡΠΏΠΏΠΈΡΡΠ΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. | [ crop || cross ] | |
* | ΠΠΎΠ²ΡΠΎΡΡΡΡ Π½ΠΎΠ»Ρ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π·. | [,]* |
+ | ΠΠΎΠ²ΡΠΎΡΡΡΡ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π·. | + |
? | Π£ΠΊΠ°Π·Π°Π½Π½ΡΠΉ ΡΠΈΠΏ, ΡΠ»ΠΎΠ²ΠΎ ΠΈΠ»ΠΈ Π³ΡΡΠΏΠΏΠ° Π½Π΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΌ. | inset? |
{A, B} | ΠΠΎΠ²ΡΠΎΡΡΡΡ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅ A, Π½ΠΎ Π½Π΅ Π±ΠΎΠ»Π΅Π΅ B ΡΠ°Π·. | {1,4} |
# | ΠΠΎΠ²ΡΠΎΡΡΡΡ ΠΎΠ΄ΠΈΠ½ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ°Π· ΡΠ΅ΡΠ΅Π· Π·Π°ΠΏΡΡΡΡ. | # |
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ
Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΡΠΈΠ½ΠΈΠΌΠ°ΡΡΡΡ Π»ΡΠ±ΡΠ΅ Π΅Π΄ΠΈΠ½ΠΈΡΡ Π΄Π»ΠΈΠ½Ρ, ΠΏΡΠΈΠ½ΡΡΡΠ΅ Π² CSS β Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΠΈΠΊΡΠ΅Π»ΠΈ (px), Π΄ΡΠΉΠΌΡ (in), ΠΏΡΠ½ΠΊΡΡ (pt) ΠΈ Π΄Ρ. ΠΠ°ΠΈΠ»ΡΡΡΠΈΠΉ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡ, ΠΎΡΠ½ΠΎΠ²Π°Π½Π½ΡΡ Π½Π° ΡΠ°Π·ΠΌΠ΅ΡΠ΅ ΡΡΠΈΡΡΠ° (em ΠΈ ex).
Normal ΠΠ°Π΄Π°ΡΡ ΠΈΠ½ΡΠ΅ΡΠ²Π°Π» ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ ΠΊΠ°ΠΊ ΠΎΠ±ΡΡΠ½ΠΎ.
ΠΠ΅ΡΠΎΡΠ½ΠΈΡΠ°
ΠΠΈΠ½Π½ΠΈ-ΠΡΡ Π±ΡΠ» Π²ΡΠ΅Π³Π΄Π° Π½Π΅ ΠΏΡΠΎΡΡ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΊΡΠ΅ΠΏΠΈΡΡΡΡ, Π² ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠΈ ΡΠ°ΡΠΎΠ² Π² ΠΎΠ΄ΠΈΠ½Π½Π°Π΄ΡΠ°ΡΡ ΡΡΡΠ°, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π² ΡΡΠΎ Π²ΡΠ΅ΠΌΡ Π·Π°Π²ΡΡΠ°ΠΊ ΡΠΆΠ΅ Π΄Π°Π²Π½ΠΎ ΠΎΠΊΠΎΠ½ΡΠΈΠ»ΡΡ, Π° ΠΎΠ±Π΅Π΄ Π΅ΡΡ ΠΈ Π½Π΅ Π΄ΡΠΌΠ°Π» Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ. Π, ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ, ΠΎΠ½ ΡΡΡΠ°ΡΠ½ΠΎ ΠΎΠ±ΡΠ°Π΄ΠΎΠ²Π°Π»ΡΡ, ΡΠ²ΠΈΠ΄Π΅Π², ΡΡΠΎ ΠΡΠΎΠ»ΠΈΠΊ Π΄ΠΎΡΡΠ°ΡΡ ΡΠ°ΡΠΊΠΈ ΠΈ ΡΠ°ΡΠ΅Π»ΠΊΠΈ.
div { letter-spacing: 0 ; }
ΠΡΠΈΠΌΠ΅Ρ
letter-spacingΠΡΠ»ΡΠΌΠΈΠ½Π°ΡΠΈΡ, ΠΏΠΎΡΠ»Π΅ ΠΎΡΡΠΎΡΠΎΠΆΠ½ΠΎΠ³ΠΎ Π°Π½Π°Π»ΠΈΠ·Π°, ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠ΅ΡΠ΅ΡΠ΅ΡΠΊΠΈΠ²Π°Π΅Ρ ΡΠΊΠ²Π°ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΠΉ Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΊΡΡΠ³ Π½Π΅Π±Π΅ΡΠ½ΠΎΠΉ ΡΡΠ΅ΡΡ, ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ»ΡΡΠΈΠ»ΠΎΡΡ Π² 1994 Π³ΠΎΠ΄Ρ Ρ ΠΊΠΎΠΌΠ΅ΡΠΎΠΉ Π¨ΡΠΌΠ΅ΠΉΠΊΠ΅pΠΎΠ²-ΠΠ΅Π²ΠΈ 9.
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ° ΠΏΠΎΠΊΠ°Π·Π°Π½ Π½Π° ΡΠΈΡ. 1.
Π ΠΈΡ. 1. ΠΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° letter-spacing
ΠΠ±ΡΠ΅ΠΊΡΠ½Π°Ρ ΠΌΠΎΠ΄Π΅Π»Ρ
ΠΠ±ΡΠ΅ΠΊΡ .style.letterSpacing
Π‘ΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ
ΠΠ°ΠΆΠ΄Π°Ρ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΏΡΠΎΡ ΠΎΠ΄ΠΈΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠ°Π΄ΠΈΠΉ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½ΠΈΡ.
- Recommendation (Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ ) — ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΡ ΠΎΠ΄ΠΎΠ±ΡΠ΅Π½Π° W3C ΠΈ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΠΎΠ²Π°Π½Π° ΠΊΠ°ΠΊ ΡΡΠ°Π½Π΄Π°ΡΡ.
- Candidate Recommendation (ΠΠΎΠ·ΠΌΠΎΠΆΠ½Π°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ ) — Π³ΡΡΠΏΠΏΠ°, ΠΎΡΠ²Π΅ΡΠ°ΡΡΠ°Ρ Π·Π° ΡΡΠ°Π½Π΄Π°ΡΡ, ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠ΅Π½Π°, ΠΊΠ°ΠΊ ΠΎΠ½ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΡΠ²ΠΎΠΈΠΌ ΡΠ΅Π»ΡΠΌ, Π½ΠΎ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΠΏΠΎΠΌΠΎΡΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ² ΠΏΠΎ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
- Proposed Recommendation (ΠΡΠ΅Π΄Π»Π°Π³Π°Π΅ΠΌΠ°Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΡ ) — Π½Π° ΡΡΠΎΠΌ ΡΡΠ°ΠΏΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ Π½Π° ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΠ΅ ΠΠΎΠ½ΡΡΠ»ΡΡΠ°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠΎΠ²Π΅ΡΠ° W3C Π΄Π»Ρ ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΡΡΠ²Π΅ΡΠΆΠ΄Π΅Π½ΠΈΡ.
- Working Draft (Π Π°Π±ΠΎΡΠΈΠΉ ΠΏΡΠΎΠ΅ΠΊΡ ) — Π±ΠΎΠ»Π΅Π΅ Π·ΡΠ΅Π»Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊΠ° ΠΏΠΎΡΠ»Π΅ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ ΠΈ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠΏΡΠ°Π²ΠΎΠΊ Π΄Π»Ρ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½ΠΈΡ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ.
- Editor»s draft (Π Π΅Π΄Π°ΠΊΡΠΎΡΡΠΊΠΈΠΉ ΡΠ΅ΡΠ½ΠΎΠ²ΠΈΠΊ ) — ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ° ΠΏΠΎΡΠ»Π΅ Π²Π½Π΅ΡΠ΅Π½ΠΈΡ ΠΏΡΠ°Π²ΠΎΠΊ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°ΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
- Draft (Π§Π΅ΡΠ½ΠΎΠ²ΠΈΠΊ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ ) — ΠΏΠ΅ΡΠ²Π°Ρ ΡΠ΅ΡΠ½ΠΎΠ²Π°Ρ Π²Π΅ΡΡΠΈΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ°.
ΠΡΠ΅ ΡΠ°ΠΉΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½Ρ, ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠΌΠ΅Π΅Ρ ΡΠ²ΠΎΠΉ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½. Π’Π΅ΠΊΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ²Π»ΡΠ΅ΡΡΡ Π³Π»Π°Π²Π½ΠΎΠΉ ΡΠΎΡΡΠ°Π²Π»ΡΡΡΠ΅ΠΉ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ°, Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ ΠΎΠ±ΡΠ΅ΠΉ ΡΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΠΈ. ΠΠ½ΠΎΠ³Π΄Π° ΠΏΡΠΎΡΡΠΎΠ³ΠΎ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ΅ΠΌΠ΅ΠΉΡΡΠ²Π° ΡΡΠΈΡΡΠΎΠ² ΠΈ ΡΠ²Π΅ΡΠ° Π½Π΅Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°. Π ΡΠ°ΠΊΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π½Π°ΠΌ Π½Π° ΠΏΠΎΠΌΠΎΡΡ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡ letter-spacing — ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π² CSS
ΠΠ°ΡΠ΅ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing?
ΠΡΠ»ΠΈ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π² CSS, ΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΡΡΠΈΠ»Ρ ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΠ»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΡΠΈΡΡΠ° ΠΈΠ½ΠΎΠ³Π΄Π° ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΎΡΡΡΡΠΏΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ. Π£Π²Π΅Π»ΠΈΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΡΠ΅Π· CSS. Π Π½Π΅ΠΌ ΡΡΡ ΡΡΠ½ΠΊΡΠΈΡ Π²ΡΠΏΠΎΠ»Π½ΡΠ΅Ρ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing.
ΠΠ½ΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠΌ Π² CSS, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ. ΠΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° ΠΈΠΌΠ΅Π½Π½ΠΎ Π΅Π³ΠΎ ΠΈ Π½Π΅ Ρ Π²Π°ΡΠ°Π΅Ρ Π΄Π»Ρ Ρ ΠΎΡΠΎΡΠ΅ΠΉ ΡΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΠΈ ΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.
ΠΠ°ΠΊ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ? CSS: letter-spacing
ΠΠΎ Π²ΡΠ΅Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ ΡΡΠΎ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π·Π°Π΄Π°Π½ΠΎ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. ΠΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΠΌΠΎ ΠΊΠΎ Π²ΡΠ΅ΠΌ ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌ, ΠΈ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Internet Explorer).
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΡΠΎΠ³ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π° Π½Π°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ Π΄Π»Ρ Π²ΡΠ΅Ρ ΠΏΠΎΡΠΎΠΌΠΊΠΎΠ² ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠ°. ΠΡΠΎ Π·Π½Π°ΡΠΈΡ, ΡΡΠΎ, Π·Π°Π΄Π°Π² ΠΎΡΡΡΡΠΏΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π΄Π»Ρ ΡΠ΅Π³Π° body, Π²Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ letter-spacing Π΄Π»Ρ Π²ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΡΠ΅ ΠΎΠ΄ΠΈΠ½ ΠΌΠΎΠΌΠ΅Π½Ρ: ΡΡΠΈΡΡΠ²Π°ΠΉΡΠ΅ Π·Π°Π΄Π°Π½Π½ΡΠΉ ΡΡΠΈΡΡ. ΠΠ»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΎΡΡΡΡΠΏΡ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ ΡΠ°Π·Π½ΡΡΡΡ. Π Π°Π·Π½ΠΈΡΠ° Π½Π΅Π±ΠΎΠ»ΡΡΠ°Ρ, ΠΈΠ·ΠΌΠ΅ΡΡΠ΅ΡΡΡ Π² Π΄ΠΎΠ»ΡΡ ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ, Π½ΠΎ ΠΈΠΌΠ΅ΠΉΡΠ΅ Π² Π²ΠΈΠ΄Ρ.
Π Π°Π±ΠΎΡΠ° ΡΡΠΎΠ³ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π° Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ΠΎΠ½ΠΎ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ ΠΊ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ Π±ΡΠΊΠ²Π΅ ΠΎΡΡΡΡΠΏΡ Ρ ΠΏΡΠ°Π²ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ. ΠΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅Ρ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π½Π° Π±ΠΎΠ»Π΅Π΅ Π΄Π΅ΡΠ°Π»ΡΠ½ΠΎΠΌ ΡΡΠΎΠ²Π½Π΅. Π Π°Π±ΠΎΡΠ°Π΅Ρ ΠΏΠΎ ΠΏΡΠΈΠ½ΡΠΈΠΏΡ margin-left. Letter-spacing ΠΌΠΎΠΆΠ΅Ρ Π·Π°Π΄Π°Π²Π°ΡΡΡΡ Π² ΡΠ°Π·Π½ΡΡ Π²Π΅Π»ΠΈΡΠΈΠ½Π°Ρ : ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΡ (em, rem, ex ΠΈ Π΄ΡΡΠ³ΠΈΠ΅) ΠΈ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΡ (px, mm, cm). ΠΠ°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΡΠΈΠ³ΠΎΠ΄Π½ΡΠΌΠΈ Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΠ²Π»ΡΡΡΡΡ Π²Π΅Π»ΠΈΡΠΈΠ½Ρ px, rem ΠΈ em. ΠΠΎΠ½Π΅ΡΠ½ΠΎ, Π»ΡΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ , ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΎΠ½ΠΎ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΡΠ΄ΠΎΠ±Π½ΠΎΠ΅ ΠΈ Π»ΡΡΡΠ΅ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΎΠ³ΠΎ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ.
ΠΠ»Ρ Π½Π°ΡΠ°Π»Π° Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠΌ ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΡΠ΅ΡΡΠΈΡΠΎΠ²Π°ΡΡ ΡΡΠΎ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ.
Π§ΡΠΎΠ±Ρ Π·Π°Π΄Π°ΡΡ Π΅Π³ΠΎ, ΠΎΡΠΊΡΠΎΠΉΡΠ΅ Π²Π°Ρ CSS-Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ, Π° Π·Π°ΡΠ΅ΠΌ Π·Π°ΠΏΠΈΡΠΈΡΠ΅ ΡΡΡΠΎΡΠΊΡ letter-spacing: 5px Π΄Π»Ρ ΡΠ΅Π³Π° body. Π’Π°ΠΊΠ°Ρ Π·Π°ΠΏΠΈΡΡ Π±ΡΠ΄Π΅Ρ ΠΎΠ·Π½Π°ΡΠ°ΡΡ, ΡΡΠΎ Π½Π° Π²ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡΡ Π½Π° 5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ (Π±ΡΠ΄Π΅Ρ ΡΠ°Π²Π½ΡΡΡΡΡ 6 ΠΈΠ»ΠΈ 5,5 Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΡΠΈΡΡΠ°).
ΠΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π²Ρ Π·Π°ΠΏΠΈΡΠΈΡΠ΅ Π²ΡΡΠ΅ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΡΠΉ ΠΊΠΎΠ΄, Ρ Π²Π°Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡΡ ΡΠ°ΠΊΠ°Ρ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ°:
ΠΠΎΠ»ΠΎΠΆΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΎΠ±ΡΡΠ½ΠΎ Π½Π΅ ΠΏΡΠ΅Π²ΡΡΠ°ΡΡ 3-5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ, Π½ΠΎ Π½Π΅ Π²ΡΠ΅Π³Π΄Π°. ΠΠ½ΠΎΠ³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ ΠΈ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°. ΠΠ΅Π»Π°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ Π²ΡΡΠ΅ 10px Π½Π΅ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΡΡΡ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΡΠ΅ΠΊΡΡ ΠΏΠΎΠ»ΡΡΠΈΡΡΡ Π½Π΅ΡΠΈΡΠ°Π±Π΅Π»ΡΠ½ΡΠΌ.
ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π΅ΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π² CSS. ΠΠ°Π΄Π°Π΅ΡΡΡ ΡΠ°ΠΊ ΠΆΠ΅, Π½ΠΎ ΡΠΎ Π·Π½Π°ΠΊΠΎΠΌ «-«. ΠΠ±ΡΡΠ½ΠΎ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠ°Π²Π½ΠΎ -1 px. ΠΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°ΡΡ ΠΈ -10, Π΄Π°ΠΆΠ΅ -20, Π½ΠΎ ΡΠ΅ΠΊΡΡ ΡΠΈΡΠ°ΡΡ Π±ΡΠ΄Π΅Ρ Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ. ΠΡΠ»ΠΈ Ρ ΠΎΡΠΈΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ΅ΠΊΡΡ Ρ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΌΠΈ ΠΎΡΡΡΡΠΏΠ°ΠΌΠΈ, Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΌΠ΅Π½Π΅Π΅ 200px.
ΠΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅
Π CSS ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΡΡΠΈΡΡΠ°. ΠΠΎΠΆΠ΅Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ², Π΅ΡΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π²ΠΌΠ΅ΡΡΠ΅ ΡΠΎ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎΠΌ font-style: italic ΠΈ Ρ ΠΎΡΠΎΡΠΈΠΌ ΡΠ²Π΅ΡΠΎΠΌ, ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΡΠ»ΡΠΆΠΈΡΡ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²ΠΎΠΉ Ρ ΠΎΡΠΎΡΠ΅ΠΌΡ Π»ΠΎΠ³ΠΎΡΠΈΠΏΡ.
Π’Π°ΠΊΠΆΠ΅, Π΅ΡΠ»ΠΈ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π°Π½Π½ΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π²ΠΌΠ΅ΡΡΠ΅ Ρ text-align: center, ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΡΡΠ°ΡΡΠΈ Π΄Π»Ρ Π±Π»ΠΎΠ³Π°.
Letter-spacing — ΠΎΡΠ»ΠΈΡΠ½ΠΎΠ΅ CSS-ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°ΡΡ
letter-spacing — ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ
12.0+ | 4.0+ | 1.0+ | 1.0+ | 3.5+ | 1.0+ |
ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅
CSS ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ letter-spacing
ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°ΡΡ ΠΈΠ»ΠΈ ΡΠΌΠ΅Π½ΡΡΠ°ΡΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ Π±ΡΠΊΠ²Π°ΠΌΠΈ Π² ΡΠ΅ΠΊΡΡΠ΅.
ΠΠΎΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ. Π ΡΠ»ΡΡΠ°Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ, ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Π±ΡΠ΄ΡΡ ΡΠΌΠ΅Π½ΡΡΠ°ΡΡΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠΉ ΡΠΈΡΠΈΠ½Ρ.
ΠΡΠΈΠΌΠ΅ΡΠ°Π½ΠΈΠ΅: Π΄Π»Ρ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠΉ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ CSS ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ word-spacing, Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠΎΠΊ — line-height.
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ: | normal |
---|---|
ΠΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ: | ΠΊΠΎ Π²ΡΠ΅ΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ, Π° ΡΠ°ΠΊΠΆΠ΅ ΠΊ ΠΏΡΠ΅Π²Π΄ΠΎ-ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ ::first-letter ΠΈ ::first-line |
ΠΠ½ΠΈΠΌΠΈΡΡΠ΅ΡΡΡ: | Π΄Π° |
ΠΠ°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ: | Π΄Π° |
ΠΠ΅ΡΡΠΈΡ: | CSS1 |
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ JavaScript: | object.style.letterSpacing=»3px» |
Π‘ΠΈΠ½ΡΠ°ΠΊΡΠΈΡ
letter-spacing: normal|ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅|inherit;
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ ΡΠ²ΠΎΠΉΡΡΠ²Π°
ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
---|---|
normal | Π‘ΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠ΅ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ. |
ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ | ΠΠ°Π΄Π°Π΅Ρ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠΈΠΌΠ²ΠΎΠ»Π°ΠΌΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π΅Π΄ΠΈΠ½ΠΈΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΡ Π² CSS. ΠΠΎΠΏΡΡΡΠΈΠΌΡ ΠΎΡΡΠΈΡΠ°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. |
inherit | Π£ΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π½Π°ΡΠ»Π΅Π΄ΡΠ΅ΡΡΡ ΠΎΡ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. |
ΠΡΠΈΠΌΠ΅Ρ
ΠΠ·ΠΌΠ΅Π½ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π΄Π»Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ°.
div {
letter-spacing: normal;
}