Π¨Π°Π±Π»ΠΎΠ½ Π±Π»ΠΎΠ³Π° | Blog Template for Bootstrap. ΠΠ΅ΡΡΠΈΡ v3.4
Sample blog post
January 1, 2014 by Mark
This blog post shows a few different types of content that’s supported and styled with Bootstrap. Basic typography, images, and code are all supported.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.
Curabitur blandit tempus porttitor. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam id dolor id nibh ultricies vehicula ut id elit.
Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
Heading
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Sub-heading
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Example code block
Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.
Sub-heading
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
- Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Donec id elit non mi porta gravida at eget metus.
- Nulla vitae elit libero, a pharetra augue.

Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.
- Vestibulum id ligula porta felis euismod semper.
- Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
- Maecenas sed diam eget risus varius blandit sit amet non magna.
Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis.
Another blog post
December 23, 2013 by Jacob
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.
Curabitur blandit tempus porttitor. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam id dolor id nibh ultricies vehicula ut id elit.
Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
New feature
December 14, 2013 by Chris
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
- Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
- Donec id elit non mi porta gravida at eget metus.
- Nulla vitae elit libero, a pharetra augue.
Etiam porta sem malesuada magna mollis euismod.
Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.
Π¨Π°Π±Π»ΠΎΠ½ Π±Π»ΠΎΠ³Π° Β· Bootstrap v5.0
ΠΡΠΈΠΌΠ΅Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΡ Π² Π±Π»ΠΎΠ³Π΅
1 ΡΠ½Π²Π°ΡΡ 2021 Π³ΠΎΠ΄Π° ΠΠ°ΡΠΊ
Π ΡΡΠΎΠΌ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΈ Π±Π»ΠΎΠ³Π° ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΡΠΈΠΏΠΎΠ² ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ ΠΈ ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Π½Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Bootstrap. ΠΠ°ΠΊ ΠΈ ΠΎΠΆΠΈΠ΄Π°Π»ΠΎΡΡ, ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ Π±Π°Π·ΠΎΠ²Π°Ρ ΡΠΈΠΏΠΎΠ³ΡΠ°ΡΠΈΠΊΠ°, ΡΠΏΠΈΡΠΊΠΈ, ΡΠ°Π±Π»ΠΈΡΡ, ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΊΠΎΠ΄ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
Π¦ΠΈΡΠ°ΡΡ
ΠΡΠΎ ΠΏΡΠΈΠΌΠ΅Ρ ΡΠΈΡΠ°ΡΡ Π² Π΄Π΅ΠΉΡΡΠ²ΠΈΠΈ:
Π¦ΠΈΡΠΈΡΡΠ΅ΠΌΡΠΉ ΡΠ΅ΠΊΡΡ ΠΈΠ΄Π΅Ρ ΡΡΠ΄Π°.
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°.
ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠΈΠΌΠ΅ΡΡ ΡΠΏΠΈΡΠΊΠΎΠ²
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΡΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΡΠΎΡΠΊΠ°Ρ Π²Π΅ΡΡΠΈΡ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΡΠ°ΡΡΠΎ ΠΏΠΎΠ²ΡΠΎΡΡΡΡΠ΅Π³ΠΎΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠΎΠ³ΠΎ ΠΏΠΎΠ²ΡΡΠ΄Ρ. ΠΡΠΎ ΠΏΡΠΈΠΌΠ΅Ρ Π½Π΅ΡΠΏΠΎΡΡΠ΄ΠΎΡΠ΅Π½Π½ΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ°:
- ΠΠ΅ΡΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ°
- ΠΡΠΎΡΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ° Ρ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΌ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ΠΌ
- Π’ΡΠ΅ΡΠΈΠΉ ΠΏΡΠ½ΠΊΡ ΡΠΏΠΈΡΠΊΠ°, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π΅Π³ΠΎ
Π ΡΡΠΎ ΡΠΏΠΎΡΡΠ΄ΠΎΡΠ΅Π½Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ:
- ΠΠ΅ΡΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ°
- ΠΡΠΎΡΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ° Ρ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΌ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ΠΌ
- Π’ΡΠ΅ΡΠΈΠΉ ΠΏΡΠ½ΠΊΡ ΡΠΏΠΈΡΠΊΠ°, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π΅Π³ΠΎ
Π ΡΡΠΎ ΡΠΏΠΈΡΠΎΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ:
- Π―Π·ΡΠΊ Π³ΠΈΠΏΠ΅ΡΡΠ΅ΠΊΡΡΠΎΠ²ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ (HTML)
- Π―Π·ΡΠΊ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ Π΄Π»Ρ ΠΎΠΏΠΈΡΠ°Π½ΠΈΡ ΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ.
- ΠΠ°ΡΠΊΠ°Π΄Π½ΡΠ΅ ΡΠ°Π±Π»ΠΈΡΡ ΡΡΠΈΠ»Π΅ΠΉ (CSS)
- ΠΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΎΠΏΠΈΡΠ°Π½ΠΈΡ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ Π²ΠΈΠ΄Π° Π²Π΅Π±-ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°.
- JavaScript (JS)
- Π―Π·ΡΠΊ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ»ΠΎΠΆΠ½ΡΡ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ² ΠΈ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ.
ΠΡΡΡΠΎΠ΅Π½Π½ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML
HTML ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ Π΄ΠΎΡΡΡΠΏΠ½ΡΡ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΡ ΡΠ΅Π³ΠΎΠ², ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΊΠΎΡΠΎΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Mozilla Developer Network.
- Π§ΡΠΎΠ±Ρ Π²ΡΠ΄Π΅Π»ΠΈΡΡ ΡΠ΅ΠΊΡΡ ΠΏΠΎΠ»ΡΠΆΠΈΡΠ½ΡΠΌ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅
<strong>. - Π§ΡΠΎΠ±Ρ Π²ΡΠ΄Π΅Π»ΠΈΡΡ ΡΠ΅ΠΊΡΡ ΠΊΡΡΡΠΈΠ²ΠΎΠΌ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅
<em>. - Π ΡΠΎΠΊΡΠ°ΡΠ΅Π½ΠΈΡΡ
, ΡΠ°ΠΊΠΈΡ
ΠΊΠ°ΠΊ HTML, ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ
<abbr>Ρ Π½Π΅ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΌtitleΠ°ΡΡΠΈΠ±ΡΡ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΠΉ ΡΡΠ°Π·Ρ. - Π¦ΠΈΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ β ΠΠ°ΡΠΊ ΠΡΡΠΎ, Π΄ΠΎΠ»ΠΆΠ½Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ
. <cite> Π£Π΄Π°Π»Π΅Π½Π½ΡΠΉΡΠ΅ΠΊΡΡ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ<del>ΠΈ inserted ΡΠ΅ΠΊΡΡ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ<ins>.
- ΠΠ΅ΡΡ
Π½ΠΈΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ text ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ
<sup>ΠΈ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ text ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ<sub>.
ΠΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΡΡΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Π½Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ°ΠΌΠΈ Ρ Π½Π΅Π±ΠΎΠ»ΡΡΠΈΠΌΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡΠΌΠΈ Ρ Π½Π°ΡΠ΅ΠΉ ΡΡΠΎΡΠΎΠ½Ρ.
ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΠΎΠ΄Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠΈΠΌΠ΅Ρ Π±Π»ΠΎΠΊΠ° ΠΊΠΎΠ΄Π°
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°.
ΠΡΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΡΠΎΡΠΊΠ°Ρ Π²Π΅ΡΡΠΈΡ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΡΠ°ΡΡΠΎ ΠΏΠΎΠ²ΡΠΎΡΡΡΡΠ΅Π³ΠΎΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠΎΠ³ΠΎ ΠΏΠΎΠ²ΡΡΠ΄Ρ.
ΠΡΡΠ³ΠΎΠΉ ΠΏΠΎΡΡ Π² Π±Π»ΠΎΠ³Π΅
23 Π΄Π΅ΠΊΠ°Π±ΡΡ 2020 Π³. ΠΠΆΠ΅ΠΉΠΊΠΎΠ±
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΠ΄Π΅ΡΡ ΠΈΠ΄Π΅Ρ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½Π°Ρ ΡΠΈΡΠ°ΡΠ°, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌ
Π²ΡΠ΄Π΅Π»Π΅Π½Π½ΡΠΌ ΡΠ΅ΠΊΡΡΠΎΠΌ ΠΏΠΎΡΠ΅ΡΠ΅Π΄ΠΈΠ½Π΅.
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
ΠΡΠΈΠΌΠ΅Ρ ΡΠ°Π±Π»ΠΈΡΠ°
Π Π½Π΅ Π·Π°Π±ΡΠ²Π°ΠΉΡΠ΅ ΠΎ ΡΠ°Π±Π»ΠΈΡΠ°Ρ Π² ΡΡΠΈΡ ΠΏΠΎΡΡΠ°Ρ :
| ΠΠ°ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½ΠΈΠ΅ | ΠΠΎΠ»ΠΎΡΠΎΠ²Π°Π½ΠΈΠ΅ Π·Π° | ΠΠΎΠ»ΠΎΡΠΎΠ² ΠΏΡΠΎΡΠΈΠ² |
|---|---|---|
| Alice | 10 | 11 |
| Bob | 4 | 3 |
| Charlie | 7 | 9 |
| Totals | 21 | 23 |
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°.
ΠΠΎΠ²Π°Ρ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΡ
14 Π΄Π΅ΠΊΠ°Π±ΡΡ 2020 Π³. ΠΡΠΈΡ
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΠ½ Π±ΡΠ» Π½Π°ΠΏΠΈΡΠ°Π½, ΡΡΠΎΠ±Ρ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΈ ΠΏΠΎΠΊΠ°Π·Π°ΡΡ, ΠΊΠ°ΠΊ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΉ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ. ΠΡ Π±ΡΠ΄Π΅ΠΌ ΠΏΠΎΠ²ΡΠΎΡΡΡΡ ΡΡΠΎ ΡΠ°ΡΡΠΎ, ΡΡΠΎΠ±Ρ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°Π»Π°ΡΡ, ΡΠ°ΠΊ ΡΡΠΎ ΠΈΡΠΈΡΠ΅ ΡΠΎΡΠ½ΠΎ ΡΠ°ΠΊΡΡ ΠΆΠ΅ ΡΡΡΠΎΠΊΡ ΡΠ΅ΠΊΡΡΠ°.
- ΠΠ΅ΡΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ°
- ΠΡΠΎΡΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΏΠΈΡΠΊΠ° Ρ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½ΡΠΌ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ΠΌ
- Π’ΡΠ΅ΡΠΈΠΉ ΠΏΡΠ½ΠΊΡ ΡΠΏΠΈΡΠΊΠ°, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π΅Π³ΠΎ
ΠΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Ρ Π°Π±Π·Π°ΡΠ°. ΠΡΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΡΠΎΡΠΊΠ°Ρ Π²Π΅ΡΡΠΈΡ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΡΠ°ΡΡΠΎ ΠΏΠΎΠ²ΡΠΎΡΡΡΡΠ΅Π³ΠΎΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΠΎΠ³ΠΎ ΠΏΠΎΠ²ΡΡΠ΄Ρ.
ΠΠ»ΠΎΠ³ Bootstrap Β· ΠΡΠΈΡΠΈΠ°Π»ΡΠ½ΡΠΉ Π±Π»ΠΎΠ³ ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠ° Bootstrap.
@ΠΌΠ΄ΠΎ
24 Π΄Π΅ΠΊΠ°Π±ΡΡ 2022 Π³.
ΠΡΠΎ ΡΠΎΠΆΠ΄Π΅ΡΡΠ²Π΅Π½ΡΠΊΠΎΠ΅ ΡΡΠ΄ΠΎ β Bootstrap v5.
3.0-alpha1 ΠΏΡΠΈΠ±ΡΠ» ΠΊΠ°ΠΊ ΡΠ°Π· ΠΊ ΠΏΡΠ°Π·Π΄Π½ΠΈΡΠ½ΡΠΌ ΠΊΠ°Π½ΠΈΠΊΡΠ»Π°ΠΌ! Π ΡΡΠΎΠΌ Π²ΡΠΏΡΡΠΊΠ΅ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π° ββΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° Π½ΠΎΠ²ΠΎΠ³ΠΎ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΡΠ΅ΠΆΠΈΠΌΠ°, ΡΠ°ΡΡΠΈΡΠ΅Π½Π½Π°Ρ ΡΠ²Π΅ΡΠΎΠ²Π°Ρ ΠΏΠ°Π»ΠΈΡΡΠ° Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ ΠΈ ΡΡΠΈΠ»ΠΈΡΠ°ΠΌΠΈ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
Π ΡΡΠΎΠΉ Π·Π°ΠΏΠΈΡΠΈ Π±Π»ΠΎΠ³Π° ΠΌΡ Π±ΡΠ΄Π΅ΠΌ Π³ΠΎΠ²ΠΎΡΠΈΡΡ ΠΊΡΠ°ΡΠΊΠΎ ΠΈ ΠΏΡΠΎΡΡΠΎ, Π° Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΡΠ°ΡΡΠΊΠ°ΠΆΠ΅ΠΌ ΠΎ Π½ΠΎΠ²ΡΡ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΠ΅ΠΆΠΈΠΌΠ°Ρ ΠΈ ΠΎ Π΄ΡΡΠ³ΠΈΡ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎΡΡΡΡ Π² ΡΠ»Π΅Π΄ΡΡΡΠΈΡ ΡΡΠ°ΡΡΡΡ . Π ΠΏΠΎΠΊΠ° ΠΌΡ Ρ ΠΎΡΠΈΠΌ, ΡΡΠΎΠ±Ρ Π²Ρ Π½Π°ΡΠ»Π°Π΄ΠΈΠ»ΠΈΡΡ ΠΊΠ°Π½ΠΈΠΊΡΠ»Π°ΠΌΠΈ ΠΈ Π²Π΅ΡΠ½ΡΠ»ΠΈΡΡ Π² ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ Π³ΠΎΠ΄Ρ, ΡΡΠ²ΡΡΠ²ΡΡ ΡΠ΅Π±Ρ ΠΎΡΠ΄ΠΎΡ Π½ΡΠ²ΡΠΈΠΌΠΈ ΠΈ ΠΏΠΎΠΌΠΎΠ»ΠΎΠ΄Π΅Π²ΡΠΈΠΌΠΈ. ΠΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡΠ΅ ΡΠΈΡΠ°ΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ, ΡΡΠΎ Π½ΠΎΠ²ΠΎΠ³ΠΎ, ΠΈ ΡΠ²ΠΈΠ΄ΠΈΠΌΡΡ Π² ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ Π³ΠΎΠ΄Ρ!
Π’Π΅ΠΌΠ½ΡΠΉ ΡΠ΅ΠΆΠΈΠΌ ΠΈ ΡΠ²Π΅ΡΠΎΠ²ΡΠ΅ ΡΠ΅ΠΆΠΈΠΌΡ
Bootstrap ΡΠ΅ΠΏΠ΅ΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΡΠ²Π½ΠΎΠ΅ ΡΠΎΠ³Π»Π°ΡΠΈΠ΅ Π½Π° ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ
ΡΠ²Π΅ΡΠΎΠ²ΡΡ
ΡΠ΅ΠΆΠΈΠΌΠΎΠ² ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡ data-bs-theme Π² ΠΊΠΎΡΠ½Π΅Π²ΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ΅ . ΠΡ Π²ΡΠ±ΡΠ°Π»ΠΈ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΠ° Π΄Π°Π½Π½ΡΡ
, ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΡΠ΅ΠΌ, Π° Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ²Π΅ΡΠ»ΡΠ΅ ΠΈ ΡΠ΅ΠΌΠ½ΡΠ΅. ΠΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ Π½ΠΎΠ²ΡΠΉ ΠΌΠΈΠΊΡΠΈΠ½ Sass, color-mode() , Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ ΡΠ΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ΅ΠΆΠΈΠΌΠ° Π»ΠΈΠ±ΠΎ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ Π΄Π°Π½Π½ΡΡ
(ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ), Π»ΠΈΠ±ΠΎ Ρ ΠΌΠ΅Π΄ΠΈΠ°-Π·Π°ΠΏΡΠΎΡΠΎΠΌ.
ΠΠΎΡΠ»Π΅Π΄Π½Π΅Π΅ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, Π΅ΡΠ»ΠΈ Ρ Π²Π°Ρ Π΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ Π΄Π²Π° ΡΠ²Π΅ΡΠΎΠ²ΡΡ
ΡΠ΅ΠΆΠΈΠΌΠ° ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΌΠ΅Π½ΡΡΡ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΉ ΡΠ΅ΠΆΠΈΠΌ ΡΠ΅ΡΠ΅Π· CSS.
ΠΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅ ΡΠΈΡΠ°ΠΉΡΠ΅ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΏΠΎ Π½ΠΎΠ²ΠΎΠΌΡ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΌΡ ΡΠ΅ΠΆΠΈΠΌΡ.
ΠΠ»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ Ρ ΠΎΡΠ΅Ρ ΡΠΎΠ·Π΄Π°ΡΡ ΡΡΠΎ-ΡΠΎ Π±ΠΎΠ»Π΅Π΅ ΠΏΡΠΎΠ΄Π²ΠΈΠ½ΡΡΠΎΠ΅, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΡΠΎΡΠΈΡΠ°ΡΡ, ΠΊΠ°ΠΊ ΠΌΡ ΡΠΎΠ·Π΄Π°Π»ΠΈ Π½Π°Ρ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π²ΡΠ±ΠΎΡΠ° ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΡΠ΅ΠΆΠΈΠΌΠ° Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΡΠΈΡΡΠ²Π°Π΅Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΡΡΡΡΠΎΠΉΡΡΠ²Π° ΠΈΠ»ΠΈ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΡ, Π½ΠΎ Π²ΡΠ΅ ΠΆΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΊΠΎΠΌΡ-ΡΠΎ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ Π΅Π³ΠΎ Ρ ΡΠ²Π½ΠΎΠΉ ΡΠ΅ΠΌΠΎΠΉ.
ΠΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ CDN ΠΈΠ»ΠΈ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ ΡΠ°Π±Π»ΠΎΠ½, ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½ΠΎΠ²ΡΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΡΠ΅ ΡΠ΅ΠΆΠΈΠΌΡ Π½Π΅ΡΠ»ΠΎΠΆΠ½ΠΎ. ΠΠΎΠ±Π°Π²ΡΡΠ΅ Π°ΡΡΠΈΠ±ΡΡ data-bs-theme Ρ light ΠΈΠ»ΠΈ dark ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΠ΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ , ΠΈ Π²Ρ Π±ΡΠ΄Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π»ΠΈΠ±ΠΎ ΡΠ²Π΅ΡΠ»ΡΡ, Π»ΠΈΠ±ΠΎ ΡΠ΅ΠΌΠ½ΡΡ ΡΠ΅ΠΌΡ.
<Π³ΠΎΠ»ΠΎΠ²Π°>
<ΠΌΠ΅ΡΠ°-ΠΊΠΎΠ΄ΠΈΡΠΎΠ²ΠΊΠ°="utf-8">
ΠΠ΅ΠΌΠΎ Bootstrap
jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" ΡΠ΅Π»ΠΎΡΡΠ½ΠΎΡΡΡ="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="Π°Π½ΠΎΠ½ΠΈΠΌΠ½ΡΠΉ">
Π³ΠΎΠ»ΠΎΠ²Π°>
<ΡΠ΅Π»ΠΎ>
ΠΡΠΈΠ²Π΅Ρ, ΠΌΠΈΡ!
ΡΠ΅Π»ΠΎ>
Π₯ΠΎΡΠΈΡΠ΅ Π²ΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠΉΠ½ΡΠ΅ Π·Π°ΠΏΡΠΎΡΡ CSS Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΡΠ΅ΠΆΠΈΠΌΠ°? ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ Bootstrap Ρ ΠΏΠΎΠΌΠΎΡΡΡ Sass ΠΈ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΠ΅ΠΆΠΈΠΌΠΎΠ². ΠΡΠΎΡΡΠΈΡΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ Π±ΠΎΠ»ΡΡΠ΅. ΠΡ Π΄Π°ΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΡΠ΅ ΡΠ΅ΠΆΠΈΠΌΡ.
Π Π°ΡΡΠΈΡΠ΅Π½Π½Π°Ρ ΡΠ²Π΅ΡΠΎΠ²Π°Ρ ΠΏΠ°Π»ΠΈΡΡΠ°
Π£ Π½Π°Ρ Π΅ΡΡΡ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΉ ΠΏΠ°Π»ΠΈΡΡΡ Ρ Π½ΠΎΠ²ΡΠΌΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ Sass, ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠΌΠΈ CSS ΠΈ ΡΡΠΈΠ»ΠΈΡΠ°ΠΌΠΈ Π΄Π»Ρ Π·Π°Π³ΡΡΠ·ΠΊΠΈ. Π¦Π²Π΅ΡΠ° ΠΏΠ΅ΡΠ΅Π΄Π½Π΅Π³ΠΎ ΠΏΠ»Π°Π½Π° ΠΈ ΡΠΎΠ½Π° ΠΈΠΌΠ΅ΡΡ Π½ΠΎΠ²ΡΠ΅ Π²ΡΠΎΡΠΈΡΠ½ΡΠ΅, ΡΡΠ΅ΡΠΈΡΠ½ΡΠ΅ ΠΈ Π°ΠΊΡΠ΅Π½ΡΠ½ΡΠ΅ ΡΠ²Π΅ΡΠ° Π½Π° Π²ΡΠ±ΠΎΡ, Π² ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π½Π°ΡΠΈ ΡΠ²Π΅ΡΠ° ΡΠ΅ΠΌΡ Π±ΡΠ»ΠΈ ΡΠ°ΡΡΠΈΡΠ΅Π½Ρ ΠΈ ΡΠ΅ΠΏΠ΅ΡΡ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΈΡ
ΡΠΎΠ½ΠΊΠΈΠ΅ ΡΠ²Π΅ΡΠ° ΡΠΎΠ½Π°, ΡΠΎΠ½ΠΊΠΈΠ΅ ΡΠ²Π΅ΡΠ° Π³ΡΠ°Π½ΠΈΡ ΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΠ΅ΠΌΠ½ΡΠ΅ ΡΠ²Π΅ΡΠ° ΡΠ΅ΠΊΡΡΠ°.
ΠΡ ΠΏΠ΅ΡΠ΅ΡΡΡΠΎΠΈΠ»ΠΈ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π³ΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠΎΠ² ΠΈ ΠΎΠΏΠΎΠ²Π΅ΡΠ΅Π½ΠΈΡ), ΡΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΈ Π½ΠΎΠ²ΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ Π² ΠΈΡ
ΠΈΡΡ
ΠΎΠ΄Π½ΠΎΠΌ Sass, ΠΈ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°Π»ΠΈ CSS, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ ΡΠ΅Π°Π³ΠΈΡΠΎΠ²Π°Π»ΠΈ Π½Π° ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΡΠ΅ΠΆΠΈΠΌΠ°.
ΠΠ·Π½Π°ΠΊΠΎΠΌΡΡΠ΅ΡΡ Ρ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ ΠΏΠΎ Π½ΠΎΠ²ΡΠΌ ΡΠ²Π΅ΡΠ°ΠΌ.
Π ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅!
Π Π΅ΡΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½ΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ:
ΠΠΎΠ±Π°Π²Π»Π΅Π½Ρ Π½ΠΎΠ²ΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ CSS Π΄Π»Ρ ΡΠΎΡΠ΅ΠΊ ΠΎΡΡΠ°Π½ΠΎΠ²Π° ΡΠ΅ΡΠΊΠΈ, ΡΠ²Π΅ΡΠΎΠ² ΡΡΡΠ»ΠΎΠΊ, ΠΊΠ½ΠΎΠΏΠΊΠΈ Π·Π°ΠΊΡΡΡΠΈΡ, ΡΡΡΠ»ΠΎΠΊ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ, ΡΠΎΡΠΌ ΠΈ Ρ. Π΄. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ Π±ΡΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π±ΠΎΠ»Π΅Π΅ Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅ CSS, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ
--bs-border-color, ΡΡΠΎΠ±Ρ Π»ΡΡΡΠ΅ ΡΠ΅Π°Π³ΠΈΡΠΎΠ²Π°ΡΡ Π½Π° ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΠ΅ΠΆΠΈΠΌΠΎΠ².ΠΠ»Π°Π²Π°ΡΡΠΈΠ΅ ΡΠΎΡΠΌΡ Π±ΡΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΠΈΡ Π±ΠΎΠ»Π΅Π΅ ΠΏΡΠ»Π΅Π½Π΅ΠΏΡΠΎΠ±ΠΈΠ²Π°Π΅ΠΌΡΠΌΠΈ, ΠΈ ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΠ½ΠΈ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΡ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΡ ΠΎΠ±Π»Π°ΡΡΠ΅ΠΉ.
ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΎ ΠΌΠ½ΠΎΠ³ΠΎ Π½ΠΎΠ²ΡΡ ΡΡΠΈΠ»ΠΈΡ, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅
fw-medium,overflowΠΈobject-fitΡΡΠΈΠ»ΠΈΡΡ, z-index ΠΈ Π΄ΡΡΠ³ΠΈΠ΅.
ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, ΡΡΠΈΠ»ΠΈΡΡ border-radiusΠ±ΡΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ, ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ ΠΊΠΎΠΌΠ±ΠΈΠ½ΠΈΡΠΎΠ²Π°ΡΡ.rounded-{top|bottom|start|end}Ρ.rounded-{0-5|pill|circle}.ΠΡΠΏΡΠ°Π²Π»Π΅Π½Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΡΠΎΠ³Π»Π°ΡΠΎΠ²Π°Π½Π½ΠΎΡΡΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΎΠΊΠΎΠ½.
ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ·Π½Π°ΠΊΠΎΠΌΡΡΠ΅ΡΡ Ρ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²ΠΎΠΌ ΠΏΠΎ ΠΌΠΈΠ³ΡΠ°ΡΠΈΠΈ Π²Π΅ΡΡΠΈΠΈ 5.3.0, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ, ΡΡΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΎΡΡ.
Π‘Π»Π΅Π΄ΡΡΡΠ΅Π΅
ΠΠΎ ΠΌΠ΅ΡΠ΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΌΡ Π΄ΠΎΡΠ°Π±Π°ΡΡΠ²Π°Π΅ΠΌ Π²ΡΠΏΡΡΠΊ Ρ ΡΡΠ΅ΡΠΎΠΌ Π²Π°ΡΠΈΡ ΠΎΡΠ·ΡΠ²ΠΎΠ² ΠΈ ΠΎΡΡΠ΅ΡΠΎΠ² ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ°Ρ , ΠΌΡ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ΄Π΅ΠΌ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡΡ Π±Π»ΠΎΠ³ Bootstrap ΠΈ ΡΠ°ΠΉΡΡ Bootstrap Icons Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π½ΠΎΠ²ΡΡ ΡΠ΅ΠΌ Π² Π±Π»ΠΈΠΆΠ°ΠΉΡΠ΅Π΅ Π²ΡΠ΅ΠΌΡ. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΠΌ ΡΠΎΠ²Π΅ΡΡΠ΅Π½ΡΡΠ²ΠΎΠ²Π°ΡΡ ΡΠ°Π±ΠΎΡΡ Π½Π°ΡΠΈΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΠΈ ΡΡΠΈΠ»ΠΈΡ Ρ Π½ΠΎΠ²ΡΠΌΠΈ ΡΠ²Π΅ΡΠΎΠ²ΡΠΌΠΈ ΡΠ΅ΠΆΠΈΠΌΠ°ΠΌΠΈ, Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΡΠ΅ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Sass, ΡΡΠΎΠ±Ρ ΡΠ»ΡΡΡΠΈΡΡ ΠΎΡ Π²Π°Ρ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π»ΡΠ΄ΠΈ ΡΡΡΠΎΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Bootstrap, ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅.
ΠΠΎΠ»ΡΡΠΈΡΡ Π²ΡΠΏΡΡΠΊ
ΠΠ΅ΡΠ΅ΠΉΠ΄ΠΈΡΠ΅ Π½Π° https://getbootstrap.com, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²Π΅ΡΡΠΈΡ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ» ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ Π² npm:
Π½ΠΏΠΌ Π² Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠΉ Π·Π°Π³ΡΡΠ·ΠΊΠ΅ @v5.3.0-Π°Π»ΡΡΠ°1
ΠΡΠΎΡΡΠΈΡΠ΅ ΠΆΡΡΠ½Π°Π» ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ GitHub v5.3.0-alpha1, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² ΡΡΠΎΠΌ Π²ΡΠΏΡΡΠΊΠ΅.
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΡΠ΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρ
ΠΠΎΡΠ΅ΡΠΈΡΠ΅ Π½Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Open Collective ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΠ»ΠΈ ΡΠ»Π΅Π½ΠΎΠ² Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π½Π° GitHub, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠ°ΡΡ ΡΠ΅Ρ , ΠΊΡΠΎ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ Bootstrap.
@ΠΌΠ΄ΠΎ
22 Π½ΠΎΡΠ±ΡΡ 2022 Π³.
ΠΡ ΠΎΡΠΊΠ°Π·Π°Π»ΠΈΡΡ ΠΎΡ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ v5.3.0, ΡΡΠΎΠ±Ρ Π²ΡΠΏΡΡΡΠΈΡΡ Π½ΠΎΠ²ΡΡ Π²Π΅ΡΡΠΈΡ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, Bootstrap v5.2.3, Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌΠΈ Π±ΠΎΠ»Π΅Π΅ ΡΡΠΎΡΠ½ΡΠΌΠΈ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΎΡΠΈΠ±ΠΎΠΊ.
Highlights
- ΠΠΎΠ±Π°Π²Π»Π΅Π½Ρ ΠΎΡΡΡΡΡΡΠ²ΡΡΡΠΈΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅
:rootCSS Π² Π½Π°Ρ ΠΏΠ°ΠΊΠ΅Ρ ΡΡΠΈΠ»ΠΈΡ - ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠ΅ ΠΎΠ± ΡΡΡΠ°ΡΠ΅Π²Π°Π½ΠΈΠΈ Π² Sass 1.56.0
- ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ RTL
translate()Π΄Π»Ρ ΠΊΠ°ΡΡΡΠ΅Π»Π΅ΠΉ - ΠΡΠΏΡΠ°Π²Π»Π΅Π½Ρ Π½Π΅ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ ΠΎΠΊΠΎΠ½
ΠΡ Π²ΠΎΠ·Π²ΡΠ°ΡΠ°Π΅ΠΌΡΡ ΠΊ Π½Π΅ΠΌΡ Ρ Π²Π΅ΡΡΠΈΠ΅ΠΉ 5.3.0 Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ ΡΠ²Π΅ΡΠΎΠ²ΡΡ
ΡΠ΅ΠΆΠΈΠΌΠΎΠ², Π½ΠΎΠ²ΡΡ
ΡΡΠΈΠ»ΠΈΡ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ³ΠΎ Π΄ΡΡΠ³ΠΎΠ³ΠΎ.
ΠΡΠΈΡΠ΅ ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ Π²ΡΠΏΡΡΠΊ ΡΡΠΎΠ³ΠΎ Π² Π±Π»ΠΈΠΆΠ°ΠΉΡΠ΅Π΅ Π²ΡΠ΅ΠΌΡ.
ΠΠΎΠ»ΡΡΠΈΡΡ Π²ΡΠΏΡΡΠΊ
ΠΠ΅ΡΠ΅ΠΉΠ΄ΠΈΡΠ΅ Π½Π° https://getbootstrap.com, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²Π΅ΡΡΠΈΡ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ» ΠΎΡΠΏΡΠ°Π²Π»Π΅Π½ Π² npm:
npm i [email protected]
ΠΡΠΎΡΠΈΡΠ°ΠΉΡΠ΅ ΠΆΡΡΠ½Π°Π» ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ GitHub v5.2.3, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² ΡΡΠΎΠΌ Π²ΡΠΏΡΡΠΊΠ΅.
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΡΠ΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρ
ΠΠΎΡΠ΅ΡΠΈΡΠ΅ Π½Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Open Collective ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΠ»ΠΈ ΡΠ»Π΅Π½ΠΎΠ² Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π½Π° GitHub, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠ°ΡΡ ΡΠ΅Ρ , ΠΊΡΠΎ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ Bootstrap.
@ΠΌΠ΄ΠΎ
11 Π½ΠΎΡΠ±ΡΡ 2022 Π³.
Bootstrap Icons v1.10.0 ΡΠΆΠ΅ Π·Π΄Π΅ΡΡ Ρ ΠΏΠΎΡΡΠΈ 150 Π½ΠΎΠ²ΡΠΌΠΈ Π·Π½Π°ΡΠΊΠ°ΠΌΠΈ. ΠΡΠΎΡ Π²ΡΠΏΡΡΠΊ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ Π½ΠΎΠ²ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ² Π·Π½Π°ΡΠΊΠΎΠ² Π»ΡΠ΄Π΅ΠΉ, Π·Π΄Π°Π½ΠΈΠΉ ΠΈ Π±Π°Π· Π΄Π°Π½Π½ΡΡ , Π° ΡΠ°ΠΊΠΆΠ΅ Π½ΠΎΠ²ΡΠ΅ Π±ΡΠ΅Π½Π΄Ρ, ΡΠ°ΠΊΠ΅ΡΡ, Π΄ΠΎΡΠΎΠΆΠ½ΡΠ΅ Π·Π½Π°ΠΊΠΈ, Π³Π»ΠΎΠ±ΡΡΡ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄ΡΡΠ³ΠΎΠ΅. ΠΠ°ΠΌ ΡΠ΅ΠΉΡΠ°Ρ Π±ΠΎΠ»Π΅Π΅ 1900 ΠΈΠΊΠΎΠ½ΠΎΠΊ !
150 Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠΎΠ²
ΠΠΎΡ ΠΊΡΠ°ΡΠΊΠΈΠΉ ΠΎΠ±Π·ΠΎΡ Π²ΡΠ΅Ρ
Π½ΠΎΠ²ΡΡ
Π·Π½Π°ΡΠΊΠΎΠ² Π² Π²Π΅ΡΡΠΈΠΈ 1.
10.0:
ΠΠ΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΠΈ Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠΎΠ²:
- 22 Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠ° Π»ΡΠ΄Π΅ΠΉ
- 26 Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠΎΠ² Π΄ΠΎΠΌΠΎΠ²
- 24 Π·Π½Π°ΡΠΊΠ° Π½ΠΎΠ²ΡΡ
Π·Π΄Π°Π½ΠΈΠΉ, Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅ ΠΏΠ΅ΡΠ΅ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½Π½ΠΎΠ΅ Π·Π΄Π°Π½ΠΈΠ΅
ΡΠΏΠΎΠ·Π΄Π°Π½ΠΈΠΉ - 22 Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠ° Π±Π°Π·Ρ Π΄Π°Π½Π½ΡΡ
- 24 Π½ΠΎΠ²ΡΡ Π·Π½Π°ΡΠΊΠ° Π΄ΠΎΡΠΎΠΆΠ½ΡΡ Π·Π½Π°ΠΊΠΎΠ²
- ΠΠΎΠ²ΡΠ΅ ΠΈΠΊΠΎΠ½ΠΊΠΈ Π·Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°ΡΠ°
- ΠΠΎΠ²ΡΠ΅ Π·Π½Π°ΡΠΊΠΈ ΡΡΠ°Π½ΡΠΏΠΎΡΡΠ° Π΄Π»Ρ ΡΠ»Π΅ΠΊΡΡΠΎΠΌΠΎΠ±ΠΈΠ»Π΅ΠΉ, ΡΠ°ΠΊΡΠΈ, Π°Π²ΡΠΎΠ±ΡΡΠΎΠ² ΠΈ ΡΠΊΡΡΠ΅ΡΠΎΠ²
- ΠΠΎΠ²ΡΠ΅ ΡΠ°ΠΊΠ΅ΡΡ
- ΠΈ Π±ΠΎΠ»ΡΡΠ΅!
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΈΡΠΏΡΠ°Π²ΠΈΠ»ΠΈ ΠΏΡΠ°Π²ΠΈΠ»Π° Π·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ Π΄Π»Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΎΡΠΈΠ±ΠΎΠΊ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°Ρ , Π² ΡΠΎΠΌ ΡΠΈΡΠ»Π΅:
- ΠΠ΅Π΄ΡΠΏΠ»ΠΈΠΊΠ°ΡΠΈΡ Π½Π°Π·Π²Π°Π½ΠΈΠΉ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΉ
ΠΠ°ΡΠΊΠ°ΠΈΠΡΠ΅Π½Π΄Ρ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π±ΡΠ»ΠΈ ΠΏΡΠΎΡΡΠΎΠΠ°ΡΠΊΠΎΠΉ - ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΡΠ΅Π³ΠΈ Π½Π° Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΡΡΡΠ°Π½ΠΈΡΠ°Ρ Π·Π½Π°ΡΠΊΠΎΠ² Π΄Π»Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΏΡΠ΅Π²Π΄ΠΎΠ½ΠΈΠΌΠΎΠ²
ΠΡΠ΅ΡΠ΅ Π½ΠΎΠ²ΡΠ΅ Π·Π½Π°ΡΠΊΠΈ? ΠΠ΅ΡΠ΅ΠΉΠ΄ΠΈΡΠ΅ ΠΊ ΡΠΈΡΡΠ΅ΠΌΠ΅ ΠΎΡΡΠ»Π΅ΠΆΠΈΠ²Π°Π½ΠΈΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌ, ΡΡΠΎΠ±Ρ ΠΏΡΠΎΠ²Π΅ΡΠΈΡΡ Π½Π°Π»ΠΈΡΠΈΠ΅ ΠΎΡΠΊΡΡΡΡΡ Π·Π°ΠΏΡΠΎΡΠΎΠ² ΠΈΠ»ΠΈ ΠΎΡΠΏΡΠ°Π²ΠΈΡΡ Π½ΠΎΠ²ΡΠΉ.
Π£ΡΡΠ°Π½ΠΎΠ²ΠΊΠ°
ΠΠ»Ρ Π½Π°ΡΠ°Π»Π° ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΠ΅ ΠΈΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²ΠΈΡΠ΅ ΡΠ΅ΡΠ΅Π· npm:
npm i bootstrap-icons
ΠΠ»ΠΈ Composer:
composer ΡΡΠ΅Π±ΡΡΡ twbs/bootstrap-icons
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡ Π²ΡΠΏΡΡΠΊ Ρ GitHub ΠΈΠ»ΠΈ Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΡΠΎΠ»ΡΠΊΠΎ SVG ΠΈ ΡΡΠΈΡΡΡ (Π±Π΅Π· ΠΎΡΡΠ°Π»ΡΠ½ΡΡ
ΡΠ°ΠΉΠ»ΠΎΠ² ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΡ).
Figma
Π€Π°ΠΉΠ» Figma ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΠΏΡΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½ Π² ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π΅ Figma! ΠΡΠΎ ΡΠΎΡ ΠΆΠ΅ ΡΠ°ΠΉΠ» Bootstrap Icons Figma, ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ Π²ΠΈΠ΄Π΅Π»ΠΈ Π² ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΡ Π²ΡΠΏΡΡΠΊΠ°Ρ , ΡΠΎΠ»ΡΠΊΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»Π΅Π΅ Π΄ΠΎΡΡΡΠΏΠ½ΡΠΉ Π΄Π»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅.
@ΠΌΠ΄ΠΎ
03 ΠΎΠΊΡΡΠ±ΡΡ 2022 Π³.
Bootstrap v5.2.2 Π²ΡΠΏΡΡΠ΅Π½ Ρ Π½ΠΎΠ²ΡΠΌΠΈ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΎΡΠΈΠ±ΠΎΠΊ ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ β ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡΠ΅ ΡΠΈΡΠ°ΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ, ΡΡΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΎΡΡ!
ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΠΌΠΎΠΌΠ΅Π½ΡΡ
- ΠΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½
- ΠΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Sass Π΄Π»Ρ ΡΠ²Π΅ΡΠ° Π°ΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½Π° Π²ΠΌΠ΅ΡΡΠΎ Π½Π΅Π΄ΠΎΠΏΡΡΡΠΈΠΌΠΎΠΉ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ CSS
- ΠΠ½ΠΎΠΏΠΊΠΈ
- ΠΡΠΌΠ΅Π½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π΄ΠΎ
.btn:hoverΠΈΠ· Π²Π΅ΡΡΠΈΠΈ 5.2.1. Π’Π΅ΠΏΠ΅ΡΡ ΠΌΡ ΡΠ²Π½ΠΎ Π½Π°ΡΠ΅Π»ΠΈΠ²Π°Π΅ΠΌΡΡ Π½Π°.btn-check 9ΠΠΌΠ΅ΡΡΠΎ ΡΡΠΎΠ³ΠΎ ΡΡΠΈΠ»ΠΈ 0016.
- ΠΡΠΌΠ΅Π½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π΄ΠΎ
- ΠΡΠΏΠ°Π΄Π°ΡΡΠΈΠ΅ ΡΠΏΠΈΡΠΊΠΈ
- ΠΡΠ΅ΠΌΠ΅Π½Π½ΠΎ Π²ΠΎΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠ°Π±ΠΎΡΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ
ΡΡ ΡΠΏΠΈΡΠΊΠΎΠ² Π±Π΅Π· ΡΠ²Π½ΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°
data(Π±ΡΠ΄Π΅Ρ ΡΠ½ΠΎΠ²Π° ΡΠ΄Π°Π»Π΅Π½ΠΎ Π² v6)
- ΠΡΠ΅ΠΌΠ΅Π½Π½ΠΎ Π²ΠΎΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠ°Π±ΠΎΡΡ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ
ΡΡ ΡΠΏΠΈΡΠΊΠΎΠ² Π±Π΅Π· ΡΠ²Π½ΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°
- ΠΠΎΠ΄Π°Π»Ρ
- Π£Π»ΡΡΡΠ΅Π½ΠΈΠ΅ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΠ΅Π»Π΅ΠΉ ΠΌΠΎΠ΄Π°Π»ΡΠ½ΡΡ ΡΠΎΠ±ΡΡΠΈΠΉ
- ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ
Π΄Π»Ρ Π²ΡΠ΅ΡΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΠΎΠ² .Π² Π½Π°ΡΠΈΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°Ρ
modal-title
- Π‘ΡΠΎΠ»Ρ
- ΠΠ΅ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡΡ
$border-colorΠ²Π²Π°ΡΠΈΠ°Π½Ρ ΡΠ°Π±Π»ΠΈΡΡ()ΠΏΡΠΈΠΌΠ΅ΡΡ
- ΠΠ΅ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡΡ
- ΠΠΊΠ»Π°Π΄ΠΊΠΈ
- ΠΠΊΠ»Π°Π΄ΠΊΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ Π°Π²ΡΠΎΡΠΎΠΊΡΡΠΈΡΡΡΡΡΡ ΠΈ Π²ΡΠ·ΡΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΡΡΡΠ°Π½ΠΈΡ
tab.show() - Fix
.activeclass ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ Π²ΠΊΠ»Π°Π΄ΠΎΠΊ Π² ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ ΡΡ ΡΠΏΠΈΡΠΊΠ°Ρ
- ΠΠΊΠ»Π°Π΄ΠΊΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ Π°Π²ΡΠΎΡΠΎΠΊΡΡΠΈΡΡΡΡΡΡ ΠΈ Π²ΡΠ·ΡΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ ΡΡΡΠ°Π½ΠΈΡ
- Π’ΠΎΡΡΡ
- ΠΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΠΉ toast
z-indexΠ½Π°.toast-containerΠ² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ.toasts, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π΅ ΠΏΠΎΠ»ΡΡΠ°ΡΡ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ
- ΠΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΠΉ toast
- ΠΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ
- ΠΡΠΏΡΠ°Π²ΠΈΡΡ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ
titleΠ΄Π»Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈ ΡΠΎΠ·Π΄Π°Π²Π°Π΅ΠΌΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ²
- ΠΡΠΏΡΠ°Π²ΠΈΡΡ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ
ΠΠΎΠ»ΡΡΠΈΡΡ Π²ΡΠΏΡΡΠΊ
ΠΠ΅ΡΠ΅ΠΉΠ΄ΠΈΡΠ΅ Π½Π° https://getbootstrap.com, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²Π΅ΡΡΠΈΡ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ» ΠΎΡΠΏΡΠ°Π²Π»Π΅Π½ Π² npm:
npm i bootstrap@v5.2.2
ΠΡΠΎΡΡΠΈΡΠ΅ ΠΆΡΡΠ½Π°Π» ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ GitHub v5.2.2, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² ΡΡΠΎΠΌ Π²ΡΠΏΡΡΠΊΠ΅.
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΡΠ΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρ
ΠΠΎΡΠ΅ΡΠΈΡΠ΅ Π½Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Open Collective ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΠ»ΠΈ ΡΠ»Π΅Π½ΠΎΠ² Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π½Π° GitHub, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠ°ΡΡ ΡΠ΅Ρ , ΠΊΡΠΎ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ Bootstrap.
@ΠΌΠ΄ΠΎ
07 ΡΠ΅Π½ΡΡΠ±ΡΡ 2022 Π³.
Bootstrap v5.2.1 Π·Π΄Π΅ΡΡ Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΈΠ· Π½Π°ΡΠ΅Π³ΠΎ ΠΏΠΎΡΠ»Π΅Π΄Π½Π΅Π³ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠΏΡΡΠΊΠ°, v5.2. Π Π²ΠΈΠ΄Π΅ Π²ΡΠΏΡΡΠΊΠ° ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΉ ΡΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΎΡΠΈΠ±ΠΎΠΊ, ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΈ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ.
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΠ»ΠΈ ΡΠ°Π±ΠΎΡΡ Π½Π°Π΄ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌΠΈ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°ΠΌΠΈ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΌΠΎΡΡ Π»ΡΠ΄ΡΠΌ Π½Π°ΡΠ°ΡΡ ΡΠ°Π±ΠΎΡΡ Ρ Bootstrap Ρ npm, Π΄ΡΡΠ³ΠΈΠΌΠΈ JS-ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠ°ΠΌΠΈ ΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ°ΠΌΠΈ ΡΠ±ΠΎΡΠΊΠΈ. ΠΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡΠ΅ ΡΠΈΡΠ°ΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ Π±ΠΎΠ»ΡΡΠ΅.
ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ
Π£ Π½Π°Ρ ΠΎΠ±Π½ΠΎΠ²ΠΈΠ» Π½Π°ΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ calc() , ΡΡΠΎΠ±Ρ ΠΎΠ±ΠΎΠΉΡΠΈ ΠΎΡΠ΅Π²ΠΈΠ΄Π½ΡΡ ΠΎΡΠΈΠ±ΠΊΡ Π² postcss-values-parser , ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΡΠ΅ΠΏΡΡΡΡΠ²ΠΎΠ²Π°Π»Π° ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠΈΠ»ΡΡΠΈΠΈ Π½Π°ΡΠΈΡ
ΠΈΡΡ
ΠΎΠ΄Π½ΡΡ
ΡΠ°ΠΉΠ»ΠΎΠ² Sass ΠΏΡΠΈ ΡΠ±ΠΎΡΠΊΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ React ΠΈ PostCSS.
ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ»ΠΎ Π² ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ Π½Π°ΡΠ΅Π³ΠΎ ΡΠΌΠ½ΠΎΠΆΠ΅Π½ΠΈΡ Π²Π½ΡΡΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΉ calc() . ΠΠΌΠ΅ΠΉΡΠ΅ Π² Π²ΠΈΠ΄Ρ, ΡΡΠΎ Π²Π°ΠΌ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΡΡΠ΅Π±ΠΎΠ²Π°ΡΡΡΡ Π²Π½Π΅ΡΡΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ Π²Π°ΡΠΈΡ
ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ
Π½Π°ΡΡΡΠΎΠ΅ΠΊ.
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΡΠ΅ΡΠΈΠ»ΠΈ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π΄Π°Π²Π½ΠΈΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ ΡΠΎΠΊΡΡΠΎΠΌ ΠΊΠ½ΠΎΠΏΠΎΠΊ ΠΈ Π°ΠΊΡΠΈΠ²Π½ΡΠΌ ΡΡΠΈΠ»Π΅ΠΌ, Π² ΡΠ°ΡΡΠ½ΠΎΡΡΠΈ, Ρ ΡΠ»Π°ΠΆΠΊΠ°ΠΌΠΈ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»ΡΠΌΠΈ. ΠΠ° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ
ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π²Π²ΠΎΠ΄Π° ΠΈΠΌΠ΅ΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ ΡΠΎ ΡΠ±ΡΠΎΡΠΎΠΌ ΡΡΠΈΠ»Π΅ΠΉ ΡΠΎΠΊΡΡΠ°. ΠΡΠΎ Π±ΡΠ»ΠΎ ΡΠ΅ΡΠ΅Π½ΠΎ Π² v5.2.1 Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ΠΌ Ρ :focus Π΄ΠΎ :focus-visible Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ .btn s. Π’Π΅ΠΏΠ΅ΡΡ ΡΠ»Π°ΠΆΠΊΠΈ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΠΌΠ΅Π½ΡΡΡ ΡΠ²ΠΎΠΉ background-color Π½Π° :focus-visible , ΠΈ ΠΎΠ½ΠΈ Π½Π΅ ΠΏΠΎΠ»ΡΡΠ°ΡΡ ΡΡΠΈΠ»Ρ :hover . ΠΠ±ΡΡΠ½ΡΠ΅ .btn ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ ΠΈΠΌΠ΅ΡΡ Π·Π½Π°ΠΊΠΎΠΌΡΠ΅ ΡΡΠΈΠ»ΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ ΡΠΎΠΊΡΡΠΈΡΠΎΠ²ΠΊΠΈ.
ΠΡ ΠΎΠ±ΡΡΠΆΠ΄Π°Π»ΠΈ, ΡΡΠΎ Π½Π΅ ΡΠ»Π΅Π΄ΡΠ΅Ρ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠΎΠΊΡΡΠ° ΠΊΠ½ΠΎΠΏΠΊΠΈ Π² v5.2.1, Π½ΠΎ ΡΠΎΡΠ»ΠΈ ΡΡΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π²Π°ΠΆΠ½ΡΠΌ, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΡΠΈΠ±ΠΎΠΊ. ΠΠ°ΠΉΡΠ΅ Π½Π°ΠΌ Π·Π½Π°ΡΡ, ΡΡΠΎ Π²Ρ Π΄ΡΠΌΠ°Π΅ΡΠ΅, ΠΈ ΠΌΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΠΌ ΡΠΎΠ²Π΅ΡΡΠ΅Π½ΡΡΠ²ΠΎΠ²Π°ΡΡ Π½Π°ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ.
ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΠΌΠΎΠΌΠ΅Π½ΡΡ
Π Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΊ Π²ΡΡΠ΅ΡΠΊΠ°Π·Π°Π½Π½ΡΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡΠΌ ΠΌΡ ΠΈΡΠΏΡΠ°Π²ΠΈΠ»ΠΈ ΠΎΡΠΈΠ±ΠΊΠΈ Π² Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°Ρ :
- ΠΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½
- ΠΠ±Π½ΠΎΠ²ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
color, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Sass$accordion-button-colorΠ²ΠΌΠ΅ΡΡΠΎ Π½Π°ΡΠ΅ΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΡΠ°ΡΡΠ°
- ΠΠ±Π½ΠΎΠ²ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
- ΠΠ½ΠΎΠΏΠΊΠΈ
- ΠΠΎΠ±Π°Π²Π»Π΅Π½Π° ββ
ΠΏΡΠΎΠ·ΡΠ°ΡΠ½Π°ΡΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½Π°Ρ CSS ΡΠ²Π΅ΡΠ° ΡΠ°ΠΌΠΊΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΡ ΡΠ΅Π³ΡΠ΅ΡΡΠΈΡ -
.btn-linkΠ±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π³ΡΠ°Π΄ΠΈΠ΅Π½ΡΠ°, ΠΊΠΎΠ³Π΄Π° Π΄Π»Ρ$enable-gradientsΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅true
- ΠΠΎΠ±Π°Π²Π»Π΅Π½Π° ββ
- Π€ΠΎΡΠΌΡ
- ΠΡΡΠΏΠΏΡ Π²Π²ΠΎΠ΄Π° ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ
Π·Π½Π°ΡΠ΅Π½ΠΈΡ z-indexΠ΄Π»Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠ²Π΅ΡΠ΅Π½Π½ΡΡ ΠΏΠΎΠ»Π΅ΠΉ ΡΠΎΡΠΌΡ - ΠΠ»Π°Π²Π°ΡΡΠΈΠ΅ ΠΌΠ΅ΡΠΊΠΈ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠ±ΡΠ°ΡΡΠ²Π°ΡΡ
text-alignΠ΄Π»Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ ΡΠΎΠ³Π»Π°ΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΡΠΈΠ»Ρ
- ΠΡΡΠΏΠΏΡ Π²Π²ΠΎΠ΄Π° ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ
- ΠΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠΎΠ²
- ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠ΅ Π³ΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠ° ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΎΠ΄Π½ΠΈΠΌ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΉ
ΡΠ°Π΄ΠΈΡΡ Π³ΡΠ°Π½ΠΈΡΡ - ΠΠ·ΠΌΠ΅Π½Π΅Π½Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ
list-group-itemΠ΄Π»Ρ Π»ΡΡΡΠ΅ΠΉ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ Π²Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠΌΠΏΠΎΡΡΠ° CSS Bootstrap
- ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠ΅ Π³ΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠ° ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΎΠ΄Π½ΠΈΠΌ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΉ
- ΠΠΎΠ΄Π°Π»Ρ
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΠ΅Π»ΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ, ΡΡΠΎΠ±Ρ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ΅Π»ΡΠΊΠΈ ΠΏΠΎ ΡΠ΅Π»ΡΠΊΠ°ΠΌ ΠΏΠΎΠ»ΠΎΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ, ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ Π²Π½ΡΡΡΠΈ
., Π½ΠΎ Π·Π°ΠΊΠ°Π½ΡΠΈΠ²Π°ΡΡΡΡ Π·Π° Π΅Π³ΠΎ ΠΏΡΠ΅Π΄Π΅Π»Π°ΠΌΠΈ, ΠΈ ΡΠ΅Π°Π³ΠΈΡΡΡΡ Π½Π° ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ ΠΈ Π·Π°ΠΊΠ°Π½ΡΠΈΠ²Π°ΡΡΡΡ Π·Π° ΠΏΡΠ΅Π΄Π΅Π»Π°ΠΌΠΈ
modal-dialog .modal-dialog
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΠ΅Π»ΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ, ΡΡΠΎΠ±Ρ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ΅Π»ΡΠΊΠΈ ΠΏΠΎ ΡΠ΅Π»ΡΠΊΠ°ΠΌ ΠΏΠΎΠ»ΠΎΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ, ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ Π²Π½ΡΡΡΠΈ
- ΠΠ°Π³ΠΈΠ½Π°ΡΠΈΡ
- ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π΅Π²Π΅ΡΠ½ΠΎ
border-radiusΠ·Π½Π°ΡΠ΅Π½ΠΈΡ Π²Π½ΡΡΡΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΠΏΠ°Π³ΠΈΠ½Π°ΡΠΈΠΈ
- ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΎ Π½Π΅Π²Π΅ΡΠ½ΠΎ
- Π¨ΠΏΠΈΠΎΠ½ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ
- ΠΠΏΡΠΈΡ ΠΏΠΎΡΠΎΠ³Π° Scrollspy ΡΠ΅ΠΏΠ΅ΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΡΡΡ
- ΠΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°
- ΠΡΠΌΠ΅Π½Π΅Π½Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ
ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠΎΠΌ
, Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ ΠΈ ΡΠ΄Π°Π»Π΅Π½Π½ΡΠΌΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠΌΠΈ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ°ΠΌΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° - ΠΡΠΏΡΠ°Π²Π»Π΅Π½ ΡΡΠΈΠ³Π³Π΅Ρ
: Β«ΡΡΡΠ½ΠΎΠΉΒ»ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π»ΡΡ ΠΈ ΡΡΠ°Π·Ρ ΡΠΊΡΡΠ²Π°Π»ΡΡ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ()
- ΠΡΠΌΠ΅Π½Π΅Π½Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ
ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠΎΠΌ
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½ Autoprefixer Π΄Π»Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π΅
color-adjust(ΡΠΏΠ°ΡΠΈΠ±ΠΎ @julien-deramond ΠΈΠ· Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π·Π° ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠ΅ Π²ΡΡΠ΅ ΠΏΠΎ ΡΠ΅ΡΠ΅Π½ΠΈΡ Π·Π΄Π΅ΡΡ)
ΠΠΎΠΊΡΠΌΠ΅Π½ΡΡ
- Π£Π»ΡΡΡΠ΅Π½ ΠΏΠΎΠΈΡΠΊ Π½Π°ΡΠΈΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ² Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ : ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° ΡΠ΅ΠΏΠ΅ΡΡ Π²ΡΠ΅Π³Π΄Π° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΡΠ·ΠΊΠΈΡ ΠΎΠΊΠ½Π°Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°
- Π£Π΄Π°Π»Π΅Π½Ρ ΡΡΡΠ»ΠΊΠΈ ΠΈ ΡΠΏΠΎΠΌΠΈΠ½Π°Π½ΠΈΡ ΠΎ Slack ΠΈΠ· ΠΊΠΎΠ΄ΠΎΠ²ΠΎΠΉ Π±Π°Π·Ρ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΌΡ Π½Π°ΠΌΠ΅ΡΠ΅Π½Ρ Π·Π°ΠΊΡΡΡΡ Slack Π² ΠΏΠΎΠ»ΡΠ·Ρ GitHub ΠΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ
- ΠΠ½ΠΎΠ²Ρ Π²Π²Π΅Π΄Π΅Π½Ρ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΠΈΠ»ΠΈ
ΡΡΡΡΠΊΡΡΡΡΠ΄Π»Ρ ΠΎΠ±ΡΠ°Π·ΡΠΎΠ² ΠΊΠΎΠ΄Π° ΠΈ ΠΊΠ½ΠΎΠΏΠΎΠΊ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ², ΠΊΠΎΠ³Π΄Π°:not(:focus-visible)
ΠΡΠΎΡΠ°ΠΉ, Π‘Π»ΡΠΊ!
ΠΠ°ΠΊ ΡΠΏΠΎΠΌΠΈΠ½Π°Π»ΠΎΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΌΠ΅ΡΡΡΠ° Π½Π°Π·Π°Π΄, ΠΌΡ ΠΏΡΠΈΠ½ΡΠ»ΠΈ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π·Π°ΠΊΡΡΡΡ Π½Π°Ρ Slack-ΠΊΠ°Π½Π°Π» ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π°.
Slack Π½Π΅ ΠΎΡΠ΅Π½Ρ Ρ
ΠΎΡΠΎΡ Π² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΈ Π±ΠΎΠ»ΡΡΠΈΠΌ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ, ΠΈ ΡΡΠΎ Π½Π΅ΠΏΠΎΠΌΠ΅ΡΠ½ΠΎ Π΄ΠΎΡΠΎΠ³ΠΎ Π΄Π»Ρ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° ΡΠ°ΠΊΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°, ΠΊΠ°ΠΊ Π½Π°ΡΠ΅ (Π² Slack Π±ΡΠ»ΠΎ Π±ΠΎΠ»Π΅Π΅ 45 000 ΡΠ΅Π»ΠΎΠ²Π΅ΠΊ!). ΠΠΌΠ΅ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Slack ΠΈΠ»ΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎΠ³ΠΎ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ° ΠΌΡ ΠΏΡΠΈΠ·ΡΠ²Π°Π΅ΠΌ Π»ΡΠ΄Π΅ΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ Β«ΠΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡΒ» Π½Π° GitHub.
ΠΡΡΠ»Π΅Π΄ΡΠΉΡΠ΅ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ Bootstrap
Π Π΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ²
ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ ΠΏΡΠΎΠ²Π΅ΡΠΈΡΡ (ΠΊΠ°Π»Π°ΠΌΠ±ΡΡ!) Π½Π°Ρ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ ΠΏΡΠΎΠ΅ΠΊΡ, ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ twbs/examples! ΠΡΠΎΠ΅ΠΊΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠ΅ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ Π΄Π»Ρ Π²ΡΠ΅Ρ Π²ΠΈΠ΄ΠΎΠ² ΡΡΠ΅Π΄ ΠΈ JS-ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ², ΠΈ Π² ΠΏΠ»Π°Π½Π°Ρ Π΅ΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅! ΠΡ Π΄Π°ΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΡΠΊΡΡΡΡ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² StackBlitz ΠΈ ΠΎΡΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅.
- Starter β ΡΡΡΠ»ΠΊΠΈ CDN Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ CSS ΠΈ JS
- Sass & JS β ΠΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ Sass, Autoprefixer, Stylelint ΠΈ Π½Π°Ρ ΠΏΠ°ΠΊΠ΅Ρ JS ΡΠ΅ΡΠ΅Π· npm
- Sass ΠΈ ESM JS β ΠΈΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ Sass, Autoprefixer ΠΈ Stylelint ΡΠ΅ΡΠ΅Π· npm, Π° Π·Π°ΡΠ΅ΠΌ Π·Π°Π³ΡΡΠ·ΠΈΡΠ΅ Π½Π°Ρ ESM JS Ρ ΠΏΡΠΎΠΊΠ»Π°Π΄ΠΊΠΎΠΉ
- Webpack β ΠΠΌΠΏΠΎΡΡ ΠΈ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΠ΅ Sass ΠΈ JS Ρ Webpack
- Parcel - Sass, JS ΡΠ΅ΡΠ΅Π· Parcel
- Vite β Sass, JS ΡΠ΅ΡΠ΅Π· Vite
- Π¨ΡΠΈΡΡ Bootstrap Icons β ΠΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ ΠΈ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΡΠΉΡΠ΅ Sass, Stylelint, PurgeCSS ΠΈ Π½Π°Ρ ΠΈΠΊΠΎΠ½ΠΎΡΠ½ΡΠΉ ΡΡΠΈΡΡ
ΠΡΡΡ ΠΈΠ΄Π΅Ρ Π΄Π»Ρ Π½ΠΎΠ²ΠΎΠ³ΠΎ Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°? ΠΠ΅ ΡΡΠ΅ΡΠ½ΡΠΉΡΠ΅ΡΡ ΠΎΡΠΊΡΡΠ²Π°ΡΡ ΡΠΈΠΊΠ΅ΡΡ ΠΈΠ»ΠΈ ΠΏΡΠ»ΡΠ΅ΠΊΠ²Π΅ΡΡΡ!
Π‘ΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΡΠΎΠ΅ΠΊΡ v4
ΠΡ Π²ΡΠΏΡΡΡΠΈΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ v2.
0.0 Π΄Π»Ρ ΠΏΡΠΎΠ΅ΠΊΡΠ° twbs/bootstrap-npm-starter. ΠΡΠΎΡ Π²ΡΠΏΡΡΠΊ Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ Bootstrap v4.6.2, Bootstrap Icons v1.9.1, Π½ΠΎΠ²ΡΡ ΡΡΠ½ΠΊΡΠΈΡ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠ²Π½ΠΎΠΉ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠ·ΠΊΠΈ Π΄Π»Ρ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠΉ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ. ΠΡΠΎΡ ΠΏΡΠΎΠ΅ΠΊΡ ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΡΠ²ΡΡΠ΅Π½ Bootstrap 4, Π² ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π½Π°Ρ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ twbs/examples Π±ΡΠ΄Π΅Ρ ΠΏΠΎΡΠ²ΡΡΠ΅Π½ v5 ΠΈ Π±ΡΠ΄ΡΡΠΈΠΌ ΠΎΡΠ½ΠΎΠ²Π½ΡΠΌ Π²ΡΠΏΡΡΠΊΠ°ΠΌ.
ΠΠΎΠ»ΡΡΠΈΡΡ Π²ΡΠΏΡΡΠΊ
ΠΠ΅ΡΠ΅ΠΉΠ΄ΠΈΡΠ΅ Π½Π° https://getbootstrap.com, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡ ΠΏΠΎΡΠ»Π΅Π΄Π½ΡΡ Π²Π΅ΡΡΠΈΡ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ» ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ Π² npm:
Π½ΠΏΠΌ Π² Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠΉ Π·Π°Π³ΡΡΠ·ΠΊΠ΅ @v5.2.1
ΠΡΠΎΡΡΠΈΡΠ΅ ΠΆΡΡΠ½Π°Π» ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ GitHub v5.2.1, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² ΡΡΠΎΠΌ Π²ΡΠΏΡΡΠΊΠ΅.
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΡΠ΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρ
ΠΠΎΡΠ΅ΡΠΈΡΠ΅ Π½Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Open Collective ΠΈΠ»ΠΈ ΠΏΡΠΎΡΠΈΠ»ΠΈ ΡΠ»Π΅Π½ΠΎΠ² Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π½Π° GitHub, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠ°ΡΡ ΡΠ΅Ρ , ΠΊΡΠΎ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΎΠΉ Bootstrap.
ΠΠ°ΡΠ°Π»ΡΠ½Π°Ρ Π·Π°Π³ΡΡΠ·ΠΊΠ° 5.2.1 | ΠΠ»ΠΎΠ³ Bootstrap
@ΠΌΠ΄ΠΎ
07 ΡΠ΅Π½ΡΡΠ±ΡΡ 2022 Π³.
Bootstrap v5.2.1 Π·Π΄Π΅ΡΡ Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΈΠ· Π½Π°ΡΠ΅Π³ΠΎ ΠΏΠΎΡΠ»Π΅Π΄Π½Π΅Π³ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠΏΡΡΠΊΠ°, v5.2. Π Π²ΠΈΠ΄Π΅ Π²ΡΠΏΡΡΠΊΠ° ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΉ ΡΡΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡΠΌΠΈ ΠΎΡΠΈΠ±ΠΎΠΊ, ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΈ Π½Π΅ΠΊΠΎΡΠΎΡΡΠΌΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡΠΌΠΈ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ.
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΠ»ΠΈ ΡΠ°Π±ΠΎΡΡ Π½Π°Π΄ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌΠΈ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°ΠΌΠΈ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠΌΠΎΡΡ Π»ΡΠ΄ΡΠΌ Π½Π°ΡΠ°ΡΡ ΡΠ°Π±ΠΎΡΡ Ρ Bootstrap Ρ npm, Π΄ΡΡΠ³ΠΈΠΌΠΈ JS-ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠ°ΠΌΠΈ ΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ°ΠΌΠΈ ΡΠ±ΠΎΡΠΊΠΈ. ΠΡΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡΠ΅ ΡΠΈΡΠ°ΡΡ, ΡΡΠΎΠ±Ρ ΡΠ·Π½Π°ΡΡ Π±ΠΎΠ»ΡΡΠ΅.
ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ
ΠΡ ΠΎΠ±Π½ΠΎΠ²ΠΈΠ»ΠΈ Π½Π°ΡΠΈ ΡΡΠ½ΠΊΡΠΈΠΈ calc() , ΡΡΠΎΠ±Ρ ΠΎΠ±ΠΎΠΉΡΠΈ ΠΎΡΠ΅Π²ΠΈΠ΄Π½ΡΡ ΠΎΡΠΈΠ±ΠΊΡ Π² postcss-values-parser , ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΡΠ΅ΠΏΡΡΡΡΠ²ΠΎΠ²Π°Π»Π° ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠΉ ΠΊΠΎΠΌΠΏΠΈΠ»ΡΡΠΈΠΈ Π½Π°ΡΠΈΡ
ΠΈΡΡ
ΠΎΠ΄Π½ΡΡ
ΡΠ°ΠΉΠ»ΠΎΠ² Sass ΠΏΡΠΈ ΡΠ±ΠΎΡΠΊΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ React ΠΈ PostCSS. ΠΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ»ΠΎ Π² ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ Π½Π°ΡΠ΅Π³ΠΎ ΡΠΌΠ½ΠΎΠΆΠ΅Π½ΠΈΡ Π²Π½ΡΡΡΠΈ 9.0015 calc() ΡΡΠ½ΠΊΡΠΈΠΉ. ΠΠΌΠ΅ΠΉΡΠ΅ Π² Π²ΠΈΠ΄Ρ, ΡΡΠΎ Π²Π°ΠΌ ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΡΡΠ΅Π±ΠΎΠ²Π°ΡΡΡΡ Π²Π½Π΅ΡΡΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ Π²Π°ΡΠΈΡ
ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ
Π½Π°ΡΡΡΠΎΠ΅ΠΊ.
ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΡΠ΅ΡΠΈΠ»ΠΈ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π΄Π°Π²Π½ΠΈΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ, ΡΠ²ΡΠ·Π°Π½Π½ΡΠ΅ Ρ ΡΠΎΠΊΡΡΠΎΠΌ ΠΊΠ½ΠΎΠΏΠΎΠΊ ΠΈ Π°ΠΊΡΠΈΠ²Π½ΡΠΌ ΡΡΠΈΠ»Π΅ΠΌ, Π² ΡΠ°ΡΡΠ½ΠΎΡΡΠΈ, Ρ ΡΠ»Π°ΠΆΠΊΠ°ΠΌΠΈ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»ΡΠΌΠΈ.
ΠΠ° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ
ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ
ΠΊΠ½ΠΎΠΏΠΊΠΈ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π²Π²ΠΎΠ΄Π° ΠΈΠΌΠ΅ΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ ΡΠΎ ΡΠ±ΡΠΎΡΠΎΠΌ ΡΡΠΈΠ»Π΅ΠΉ ΡΠΎΠΊΡΡΠ°. ΠΡΠΎ Π±ΡΠ»ΠΎ ΡΠ΅ΡΠ΅Π½ΠΎ Π² v5.2.1 Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ΠΌ :focus Π½Π° :focus-visible Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ .btn s. Π’Π΅ΠΏΠ΅ΡΡ ΡΠ»Π°ΠΆΠΊΠΈ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΠ΅Π»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΠΌΠ΅Π½ΡΡΡ ΡΠ²ΠΎΠΈ background-color Π½Π° :focus-visible , ΠΈ ΠΎΠ½ΠΈ Π½Π΅ ΠΏΠΎΠ»ΡΡΠ°ΡΡ ΡΡΠΈΠ»Ρ :hover . ΠΠ±ΡΡΠ½ΡΠ΅ .btn ΠΏΠΎ-ΠΏΡΠ΅ΠΆΠ½Π΅ΠΌΡ ΠΈΠΌΠ΅ΡΡ Π·Π½Π°ΠΊΠΎΠΌΡΠ΅ ΡΡΠΈΠ»ΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ ΡΠΎΠΊΡΡΠΈΡΠΎΠ²ΠΊΠΈ.
ΠΡ ΠΎΠ±ΡΡΠΆΠ΄Π°Π»ΠΈ, ΡΡΠΎ Π½Π΅ ΡΠ»Π΅Π΄ΡΠ΅Ρ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΡΠΎΠΊΡΡΠ° ΠΊΠ½ΠΎΠΏΠΊΠΈ Π² v5.2.1, Π½ΠΎ ΡΠΎΡΠ»ΠΈ ΡΡΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π²Π°ΠΆΠ½ΡΠΌ, ΡΡΠΎΠ±Ρ Π·Π°ΠΊΡΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΡΠΈΠ±ΠΎΠΊ. ΠΠ°ΠΉΡΠ΅ Π½Π°ΠΌ Π·Π½Π°ΡΡ, ΡΡΠΎ Π²Ρ Π΄ΡΠΌΠ°Π΅ΡΠ΅, ΠΈ ΠΌΡ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΠΌ ΡΠΎΠ²Π΅ΡΡΠ΅Π½ΡΡΠ²ΠΎΠ²Π°ΡΡ Π½Π°ΡΡ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ.
Highlights
Π Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΊ Π²ΡΡΠ΅ΡΠΊΠ°Π·Π°Π½Π½ΡΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡΠΌ ΠΌΡ ΠΈΡΠΏΡΠ°Π²ΠΈΠ»ΠΈ ΠΎΡΠΈΠ±ΠΊΠΈ Π² Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°Ρ :
- ΠΠΊΠΊΠΎΡΠ΄Π΅ΠΎΠ½
- ΠΠ±Π½ΠΎΠ²ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
color, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ Sass$accordion-button-colorΠ²ΠΌΠ΅ΡΡΠΎ Π½Π°ΡΠ΅ΠΉ ΡΡΠ½ΠΊΡΠΈΠΈ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΡΠ°ΡΡΠ°
- ΠΠ±Π½ΠΎΠ²ΠΈΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
- ΠΠ½ΠΎΠΏΠΊΠΈ
- ΠΠΎΠ±Π°Π²Π»Π΅Π½Π° ββ
ΠΏΡΠΎΠ·ΡΠ°ΡΠ½Π°ΡΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½Π°Ρ CSS ΡΠ²Π΅ΡΠ° ΡΠ°ΠΌΠΊΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΡ ΡΠ΅Π³ΡΠ΅ΡΡΠΈΡ -
.Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π³ΡΠ°Π΄ΠΈΠ΅Π½ΡΠ°, ΠΊΠΎΠ³Π΄Π° Π΄Π»Ρ
btn-link $enable-gradientsΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅true
- ΠΠΎΠ±Π°Π²Π»Π΅Π½Π° ββ
- Π€ΠΎΡΠΌΡ
- ΠΡΡΠΏΠΏΡ Π²Π²ΠΎΠ΄Π° ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ
Π·Π½Π°ΡΠ΅Π½ΠΈΡ z-indexΠ΄Π»Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΠ³ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΎΠ²Π΅ΡΠ΅Π½Π½ΡΡ ΠΏΠΎΠ»Π΅ΠΉ ΡΠΎΡΠΌΡ - ΠΠ»Π°Π²Π°ΡΡΠΈΠ΅ ΠΌΠ΅ΡΠΊΠΈ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠ±ΡΠ°ΡΡΠ²Π°ΡΡ
text-alignΠ΄Π»Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠ΅Π½ΠΈΡ ΡΠΎΠ³Π»Π°ΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΡΠΈΠ»Ρ
- ΠΡΡΠΏΠΏΡ Π²Π²ΠΎΠ΄Π° ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ
- ΠΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠΎΠ²
- ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠ΅ Π³ΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠ° ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΎΠ΄Π½ΠΈΠΌ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΉ ΡΠ°Π΄ΠΈΡΡ Π³ΡΠ°Π½ΠΈΡΡ
- ΠΠ·ΠΌΠ΅Π½Π΅Π½Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ
list-group-itemΠ΄Π»Ρ Π»ΡΡΡΠ΅ΠΉ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠΈ Π²Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠΌΠΏΠΎΡΡΠ° CSS 9 Bootstrap.0064
- ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΠ΅ Π³ΡΡΠΏΠΏΡ ΡΠΏΠΈΡΠΊΠ° ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΎΠ΄Π½ΠΈΠΌ Π΄ΠΎΡΠ΅ΡΠ½ΠΈΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΡΠ΅ΠΏΠ΅ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΉ ΡΠ°Π΄ΠΈΡΡ Π³ΡΠ°Π½ΠΈΡΡ
- ΠΠΎΠ΄Π°Π»Ρ
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΠ΅Π»ΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ, ΡΡΠΎΠ±Ρ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ΅Π»ΡΠΊΠΈ ΠΏΠΎ ΡΠ΅Π»ΡΠΊΠ°ΠΌ ΠΏΠΎΠ»ΠΎΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ, ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ Π²Π½ΡΡΡΠΈ
.modal-dialog, Π½ΠΎ Π·Π°ΠΊΠ°Π½ΡΠΈΠ²Π°ΡΡΡΡ Π·Π° Π΅Π³ΠΎ ΠΏΡΠ΅Π΄Π΅Π»Π°ΠΌΠΈ, ΠΈ ΡΠ΅Π°Π³ΠΈΡΡΡΡ Π½Π° ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ ΠΈ Π·Π°ΠΊΠ°Π½ΡΠΈΠ²Π°ΡΡΡΡ Π·Π° ΠΏΡΠ΅Π΄Π΅Π»Π°ΠΌΠΈ.
modal-dialog
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΡΠΎΡΠ»ΡΡΠΈΠ²Π°ΡΠ΅Π»ΠΈ ΡΠΎΠ±ΡΡΠΈΠΉ, ΡΡΠΎΠ±Ρ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠ΅Π»ΡΠΊΠΈ ΠΏΠΎ ΡΠ΅Π»ΡΠΊΠ°ΠΌ ΠΏΠΎΠ»ΠΎΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ, ΡΠ΅Π»ΡΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ Π²Π½ΡΡΡΠΈ
- ΠΠ°Π³ΠΈΠ½Π°ΡΠΈΡ
- ΠΡΠΏΡΠ°Π²Π»Π΅Π½Ρ Π½Π΅Π²Π΅ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ
border-radiusΠ²Π½ΡΡΡΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΠΏΠ°Π³ΠΈΠ½Π°ΡΠΈΠΈ
- ΠΡΠΏΡΠ°Π²Π»Π΅Π½Ρ Π½Π΅Π²Π΅ΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ
- Π¨ΠΏΠΈΠΎΠ½ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ
- ΠΠΏΡΠΈΡ ΠΏΠΎΡΠΎΠ³ΠΎΠ²ΠΎΠ³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΡ Scrollspy ΡΠ΅ΠΏΠ΅ΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΡΡΡ
- ΠΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠ΅ ΠΎΠΊΠ½Π°
- ΠΡΠΌΠ΅Π½Π΅Π½Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ
ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠΎΠΌ
, Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΠΌ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ ΠΈ ΡΠ΄Π°Π»Π΅Π½Π½ΡΠΌΠΈ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΠΌΠΈ ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠ°ΠΌΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° - Π€ΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΡΠΈΠ³Π³Π΅Ρ
: Β«ΡΡΡΠ½ΠΎΠΉΒ»ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎΠ΅ ΡΠΊΡΡΡΠΈΠ΅ ΠΏΡΠΈ Π²ΡΠ·ΠΎΠ²Π΅toggle()
- ΠΡΠΌΠ΅Π½Π΅Π½Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°Π΅ΠΌΡΡ
ΠΌΠΎΠ΄ΡΠ»Π΅ΠΉ Π²ΡΠΏΠ»ΡΠ²Π°ΡΡΠΈΡ
ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΎΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΠΎΠΌ
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ
- ΠΠ±Π½ΠΎΠ²Π»Π΅Π½ Autoprefixer Π΄Π»Ρ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΠΉ ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π΅
color-adjust(ΡΠΏΠ°ΡΠΈΠ±ΠΎ @julien-deramond ΠΈΠ· Π½Π°ΡΠ΅ΠΉ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Π·Π° ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠ΅ Π²Π²Π΅ΡΡ ΠΏΠΎ ΡΠ΅ΡΠ΅Π½ΠΈΡ Π·Π΄Π΅ΡΡ)
ΠΠΎΠΊΡΠΌΠ΅Π½ΡΡ
- Π£Π»ΡΡΡΠ΅Π½ ΠΏΠΎΠΈΡΠΊ Π½Π°ΡΠΈΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ² Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΡ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ : ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° ΡΠ΅ΠΏΠ΅ΡΡ Π²ΡΠ΅Π³Π΄Π° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΡΡ ΡΠ·ΠΊΠΈΡ ΠΎΠΊΠ½Π°Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°
- Π£Π΄Π°Π»Π΅Π½Ρ ΡΡΡΠ»ΠΊΠΈ ΠΈ ΡΠΏΠΎΠΌΠΈΠ½Π°Π½ΠΈΡ Slack ΠΈΠ· ΠΊΠΎΠ΄ΠΎΠ²ΠΎΠΉ Π±Π°Π·Ρ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΌΡ Π½Π°ΠΌΠ΅ΡΠ΅Π½Ρ Π·Π°ΠΊΡΡΡΡ Slack Π² ΠΏΠΎΠ»ΡΠ·Ρ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΠΉ Π½Π° GitHub
- ΠΠ½ΠΎΠ²Ρ Π²Π²Π΅Π΄Π΅Π½Ρ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΠΈΠ»ΠΈ
ΡΡΡΡΠΊΡΡΡΡΠ΄Π»Ρ ΠΎΠ±ΡΠ°Π·ΡΠΎΠ² ΠΊΠΎΠ΄Π° ΠΈ ΠΊΠ½ΠΎΠΏΠΎΠΊ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ², ΠΊΠΎΠ³Π΄Π°:not(:focus-visible)
ΠΡΠΎΡΠ°ΠΉ, Π‘Π»ΡΠΊ!
ΠΠ°ΠΊ ΡΠΏΠΎΠΌΠΈΠ½Π°Π»ΠΎΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΌΠ΅ΡΡΡΠ° Π½Π°Π·Π°Π΄, ΠΌΡ ΠΏΡΠΈΠ½ΡΠ»ΠΈ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π·Π°ΠΊΡΡΡΡ Π½Π°Ρ Slack-ΠΊΠ°Π½Π°Π» ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π°.
Slack Π½Π΅ ΠΎΡΠ΅Π½Ρ Ρ
ΠΎΡΠΎΡ Π² ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠΈ Π±ΠΎΠ»ΡΡΠΈΠΌ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎΠΌ, ΠΈ ΡΡΠΎ Π½Π΅ΠΏΠΎΠΌΠ΅ΡΠ½ΠΎ Π΄ΠΎΡΠΎΠ³ΠΎ Π΄Π»Ρ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° ΡΠ°ΠΊΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°, ΠΊΠ°ΠΊ Π½Π°ΡΠ΅ (Π² Slack Π±ΡΠ»ΠΎ Π±ΠΎΠ»Π΅Π΅ 45 000 ΡΠ΅Π»ΠΎΠ²Π΅ΠΊ!). ΠΠΌΠ΅ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Slack ΠΈΠ»ΠΈ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎΠ³ΠΎ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ° ΠΌΡ ΠΏΡΠΈΠ·ΡΠ²Π°Π΅ΠΌ Π»ΡΠ΄Π΅ΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½Π°ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΡ Β«ΠΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡΒ» Π½Π° GitHub.
ΠΡΡΠ»Π΅Π΄ΡΠΉΡΠ΅ ΠΎΠ±ΡΡΠΆΠ΄Π΅Π½ΠΈΡ Bootstrap
Π Π΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ²
ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ ΠΏΡΠΎΠ²Π΅ΡΠΈΡΡ (ΠΊΠ°Π»Π°ΠΌΠ±ΡΡ!) Π½Π°Ρ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ ΠΏΡΠΎΠ΅ΠΊΡ, ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ twbs/examples! ΠΡΠΎΠ΅ΠΊΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Π² ΡΠ΅Π±Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠ΅ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ Π΄Π»Ρ Π²ΡΠ΅Ρ Π²ΠΈΠ΄ΠΎΠ² ΡΡΠ΅Π΄ ΠΈ JS-ΡΡΠ΅ΠΉΠΌΠ²ΠΎΡΠΊΠΎΠ², ΠΈ Π² ΠΏΠ»Π°Π½Π°Ρ Π΅ΡΠ΅ Π±ΠΎΠ»ΡΡΠ΅! ΠΡ Π΄Π°ΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΡΠΊΡΡΡΡ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² StackBlitz ΠΈ ΠΎΡΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅.
- Starter β ΡΡΡΠ»ΠΊΠΈ CDN Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ CSS ΠΈ JS
- Sass & JS β ΠΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ Sass, Autoprefixer, Stylelint ΠΈ Π½Π°Ρ ΠΏΠ°ΠΊΠ΅Ρ JS ΡΠ΅ΡΠ΅Π· npm
- Sass ΠΈ ESM JS β ΠΈΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ Sass, Autoprefixer ΠΈ Stylelint ΡΠ΅ΡΠ΅Π· npm, Π° Π·Π°ΡΠ΅ΠΌ Π·Π°Π³ΡΡΠ·ΠΈΡΠ΅ Π½Π°Ρ ESM JS Ρ ΠΏΡΠΎΠΊΠ»Π°Π΄ΠΊΠΎΠΉ
- Webpack β ΠΠΌΠΏΠΎΡΡ ΠΈ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΠ΅ Sass ΠΈ JS Ρ Webpack
- Parcel — Sass, JS ΡΠ΅ΡΠ΅Π· Parcel
- Vite β Sass, JS ΡΠ΅ΡΠ΅Π· Vite
- Π¨ΡΠΈΡΡ Bootstrap Icons β ΠΠΌΠΏΠΎΡΡΠΈΡΡΠΉΡΠ΅ ΠΈ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΡΠΉΡΠ΅ Sass, Stylelint, PurgeCSS ΠΈ Π½Π°Ρ ΠΈΠΊΠΎΠ½ΠΎΡΠ½ΡΠΉ ΡΡΠΈΡΡ
ΠΡΡΡ ΠΈΠ΄Π΅Ρ Π΄Π»Ρ Π½ΠΎΠ²ΠΎΠ³ΠΎ Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°? ΠΠ΅ ΡΡΠ΅ΡΠ½ΡΠΉΡΠ΅ΡΡ ΠΎΡΠΊΡΡΠ²Π°ΡΡ ΡΠΈΠΊΠ΅ΡΡ ΠΈΠ»ΠΈ ΠΏΡΠ»ΡΠ΅ΠΊΠ²Π΅ΡΡΡ!
Π‘ΡΠ°ΡΡΠΎΠ²ΡΠΉ ΠΏΡΠΎΠ΅ΠΊΡ v4
ΠΡ Π²ΡΠΏΡΡΡΠΈΠ»ΠΈ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ v2.


3.0-Π°Π»ΡΡΠ°1
2.2