ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ html β Telegraph
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ htmlΠ‘ΠΊΠ°ΡΠ°ΡΡ ΡΠ°ΠΉΠ» — ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ html
ΠΡΠ»ΠΈ Π²Π°Ρ Π²Π΅Π±-ΡΠ°ΠΉΡ Π½Π΅ ΠΎΠ³ΡΠ°Π½ΠΈΡΠΈΠ²Π°Π΅ΡΡΡ ΠΎΠ΄Π½ΠΎΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ΠΉ, ΡΠΎ ΡΡΠΎΠΈΡ ΠΏΠΎΠ΄ΡΠΌΠ°ΡΡ ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠΈ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ ΠΌΠ΅Π½Ρ. ΠΠ΅Π½Ρ — ΡΠ°Π·Π΄Π΅Π» Π²Π΅Π±-ΡΠ°ΠΉΡΠ°, ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Π½ΡΠΉ ΠΏΠΎΠΌΠΎΠ³Π°ΡΡ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ ΠΏΠΎ ΡΠ°ΠΉΡΡ. ΠΡΠ±ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΡΠΏΠΈΡΠΎΠΊ ΡΡΡΠ»ΠΎΠΊ, Π²Π΅Π΄ΡΡΠΈΡ
Π½Π° Π²Π½ΡΡΡΠ΅Π½Π½ΠΈΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ°ΠΉΡΠ°. Π‘Π°ΠΌΡΠΌ ΠΏΡΠΎΡΡΡΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π½Π° ΡΠ°ΠΉΡ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS ΠΈ HTML. ΠΠ΅ΡΠ²ΡΠΌ ΡΠ°Π³ΠΎΠΌ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ°ΡΠΊΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ°. Π’Π°ΠΊΠΆΠ΅ Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΡΠ΄Π΅Ρ ΠΈΠΌΠ΅ΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠΏΠΈΡΠΎΠΊ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΌΡ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΊ Π½Π΅ΠΌΡ Π°ΡΡΠΈΠ±ΡΡ id Ρ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠΌ ‘navbar’. ΠΠ°ΡΠ° ΡΠ»Π΅Π΄ΡΡΡΠ°Ρ Π·Π°Π΄Π°ΡΠ° Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠ±ΡΠΎΡΠ΅ ΡΡΠΈΠ»Π΅ΠΉ ΡΠΏΠΈΡΠΊΠ°, ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΡ
ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. ΠΠ°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠ±ΡΠ°ΡΡ Π²Π½Π΅ΡΠ½ΠΈΠ΅ ΠΈ Π²Π½ΡΡΡΠ΅Π½Π½ΠΈΠ΅ ΠΎΡΡΡΡΠΏΡ Ρ ΡΠ°ΠΌΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ° ΠΈ ΠΌΠ°ΡΠΊΠ΅ΡΡ Ρ ΠΏΡΠ½ΠΊΡΠΎΠ² ΡΠΏΠΈΡΠΊΠ°. ΠΠ°ΡΠ΅ΠΌ Π·Π°Π΄Π°Π΄ΠΈΠΌ Π½ΡΠΆΠ½ΡΡ ΡΠΈΡΠΈΠ½Ρ:. Π’Π΅ΠΏΠ΅ΡΡ ΠΏΡΠΈΡΠ»ΠΎ Π²ΡΠ΅ΠΌΡ ΡΡΠΈΠ»ΠΈΠ·ΠΎΠ²Π°ΡΡ ΡΠ°ΠΌΠΈ ΡΡΡΠ»ΠΊΠΈ.
ΠΡ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΊ Π½ΠΈΠΌ ΡΠΎΠ½ΠΎΠ²ΡΠΉ ΡΠ²Π΅Ρ, ΠΈΠ·ΠΌΠ΅Π½ΠΈΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΡΠ΅ΠΊΡΡΠ°: ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ Π±ΡΠ»ΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Ρ Π»Π΅Π²Π°Ρ ΠΈ Π½ΠΈΠΆΠ½ΡΡ ΡΠ°ΠΌΠΊΠΈ ΠΊ ΠΏΡΠ½ΠΊΡΠ°ΠΌ ΡΠΏΠΈΡΠΊΠ°. Π‘Π°ΠΌΠΎΠΉ Π²Π°ΠΆΠ½ΠΎΠΉ ΡΠ°ΡΡΡΡ Π½Π°ΡΠΈΡ
ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΡΡΡΠΎΡΠ½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² Π½Π° Π±Π»ΠΎΡΠ½ΡΠ΅. Π’Π΅ΠΏΠ΅ΡΡ Π½Π°ΡΠΈ ΡΡΡΠ»ΠΊΠΈ Π·Π°Π½ΠΈΠΌΠ°ΡΡ Π²ΡΠ΅ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ ΠΏΡΠ½ΠΊΡΠΎΠ² ΡΠΏΠΈΡΠΊΠ°, ΡΠΎ Π΅ΡΡΡ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° ΠΏΠΎ ΡΡΡΠ»ΠΊΠ΅ Π½Π°ΠΌ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ Π½ΡΠΆΠ½ΠΎ Π½Π°Π²ΠΎΠ΄ΠΈΡΡ ΠΊΡΡΡΠΎΡ ΡΠΎΡΠ½ΠΎ Π½Π° ΡΠ΅ΠΊΡΡ. ΠΡ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΠΈΠ»ΠΈ Π²Π΅ΡΡ ΠΊΠΎΠ΄, ΠΎΠΏΠΈΡΠ°Π½Π½ΡΠΉ Π²ΡΡΠ΅, Π² ΠΎΠ΄ΠΈΠ½ ΠΏΡΠΈΠΌΠ΅Ρ, ΡΠ΅ΠΏΠ΅ΡΡ, Π½Π°ΠΆΠ°Π² Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΠΏΠΎΠΏΡΠΎΠ±ΠΎΠ²Π°ΡΡ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ Ρ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠΌ ΠΈ ΡΠ²ΠΈΠ΄Π΅ΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ:. ΠΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ Π½Π° ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ Π΅Π³ΠΎ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΌΠΎΠΆΠ΅Ρ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡΡΡ, ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°Ρ ΠΊ ΡΠ΅Π±Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ. Π‘ΠΎΠ·Π΄Π°ΡΡ ΡΠ°ΠΊΠΎΠΉ ΡΡΡΠ΅ΠΊΡ ΠΌΠΎΠΆΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΡΠ΅Π²Π΄ΠΎ-ΠΊΠ»Π°ΡΡΠ°: ΠΠ΅ΡΠ½Π΅ΠΌΡΡ ΠΊ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π½Π½ΠΎΠΌΡ ΡΠ°Π½Π΅Π΅ ΠΏΡΠΈΠΌΠ΅ΡΡ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π² ΡΠ°Π±Π»ΠΈΡΡ ΡΡΠΈΠ»Π΅ΠΉ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ:. Π ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π»ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΡ ΡΠ°ΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΡΡΠ΅ΡΠΈΡΡ Π½Π° ΡΠ°ΠΉΡΠ°Ρ
ΡΠ»Π΅Π²Π° ΠΈΠ»ΠΈ ΡΠΏΡΠ°Π²Π° ΠΎΡ ΠΎΠ±Π»Π°ΡΡΠΈ Ρ ΠΎΡΠ½ΠΎΠ²Π½ΡΠΌ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ. ΠΠ΄Π½Π°ΠΊΠΎ ΠΌΠ΅Π½Ρ Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΠΌΠΈ ΡΡΡΠ»ΠΊΠ°ΠΌΠΈ ΡΠ°ΠΊΠΆΠ΅ ΡΠ°ΡΡΠΎ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΠΈ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ Π² Π²Π΅ΡΡ
Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°ΡΡ ΠΏΡΡΠ΅ΠΌ ΡΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΠΈ ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ°. ΠΠ°ΠΏΠΈΡΠ΅ΠΌ Π΄Π»Ρ Π½Π°ΡΠ΅Π³ΠΎ ΡΠΏΠΈΡΠΊΠ° ΠΏΠ°ΡΡ ΠΏΡΠ°Π²ΠΈΠ», ΡΠ±ΡΠ°ΡΡΠ²Π°ΡΡΠΈΡ
ΡΡΠΈΠ»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ Π΄Π»Ρ ΡΠΏΠΈΡΠΊΠΎΠ² ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΈ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΠΌ ΠΏΡΠ½ΠΊΡΡ ΡΠΏΠΈΡΠΊΠ° Ρ Π±Π»ΠΎΡΠ½ΡΡ
Π½Π° ΡΡΡΠΎΡΠ½ΡΠ΅:. ΠΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ, Π±ΡΠ΄Π΅Ρ ΠΈΠΌΠ΅ΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ, ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΡΠ΅ Π² Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΠΈ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ΄ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΠΎΡΠ»Π΅ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ Π½Π° ΡΠΎΡ ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ, ΠΊ ΠΊΠΎΡΠΎΡΠΎΠΌΡ ΡΡΠΈ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΡ ΠΎΡΠ½ΠΎΡΡΡΡΡ. Π‘Π½Π°ΡΠ°Π»Π° Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°ΡΡ HTML-ΡΡΡΡΠΊΡΡΡΡ Π½Π°ΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ. ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ ΠΌΡ ΠΏΠΎΠΌΠ΅ΡΡΠΈΠΌ Π² ΠΌΠ°ΡΠΊΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ:. Π’Π΅ΠΏΠ΅ΡΡ ΠΌΡ ΠΈΠΌΠ΅Π΅ΠΌ ΡΠ΅ΡΠΊΡΡ ΡΡΡΡΠΊΡΡΡΡ Π½Π°ΡΠ΅ΠΉ Π±ΡΠ΄ΡΡΠ΅ΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ:. Π’Π΅ΠΏΠ΅ΡΡ ΠΏΡΠΈΡΡΡΠΏΠΈΠΌ ΠΊ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ CSS ΠΊΠΎΠ΄Π°. ΠΠ»Ρ Π½Π°ΡΠ°Π»Π° Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΡΡΡΡ ΡΠΏΠΈΡΠΎΠΊ Ρ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΠ°ΠΌΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΎΠ±ΡΡΠ²Π»Π΅Π½ΠΈΡ display: Π£Π±ΠΈΡΠ°Π΅ΠΌ Ρ ΠΎΠ±ΠΎΠΈΡ
ΡΠΏΠΈΡΠΊΠΎΠ² ΠΎΡΡΡΡΠΏΡ ΠΈ ΠΌΠ°ΡΠΊΠ΅ΡΡ, ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. ΠΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΠΈΡΠΊΠ° Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΡΠΌΠΈ ΡΡΡΠ»ΠΊΠ°ΠΌΠΈ Π΄Π΅Π»Π°Π΅ΠΌ ΠΏΠ»Π°Π²Π°ΡΡΠΈΠΌΠΈ, ΡΠΎΡΠΌΠΈΡΡΡ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, Π½ΠΎ Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΠΏΠΈΡΠΊΠ°, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΡ
ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΡ Π·Π°Π΄Π°Π΅ΠΌ float: ΠΠ°ΡΠ΅ΠΌ Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ Π½Π°ΡΠ΅ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ ΠΏΠΎΠ΄ΠΌΠ΅Π½Ρ Π½Π΅ ΡΠΌΠ΅ΡΠ°Π»ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½Ρ, ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΡΠΉ ΠΏΠΎΠ΄ ΠΏΠ°Π½Π΅Π»ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, Π²Π½ΠΈΠ·.
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΌΡ Π·Π°Π΄Π°Π΄ΠΈΠΌ ΠΏΡΠ½ΠΊΡΠ°ΠΌ ΡΠΏΠΈΡΠΊΠ° position: ΠΡΡΠΎΡΠ° Π΄Π»Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠΏΠΈΡΠΊΠ° Π±ΡΠ»Π° Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π° ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ Π±ΡΠ°ΡΠ·Π΅ΡΡ Π½Π΅ ΡΡΠΈΡΡΠ²Π°ΡΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΏΠ»Π°Π²Π°ΡΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ, ΡΠΎ Π±Π΅Π· Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ Π²ΡΡΠΎΡΡ Π½Π°Ρ ΡΠΏΠΈΡΠΎΠΊ Π±ΡΠ΄Π΅Ρ ΠΏΡΠΎΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°Π½ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ ΠΈ ΠΊΠΎΠ½ΡΠ΅Π½Ρ, ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ Π·Π° ΡΠΏΠΈΡΠΊΠΎΠΌ, Π±ΡΠ΄Π΅Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°ΡΡ Π½Π°ΡΠ΅ ΠΌΠ΅Π½Ρ. ΠΠ»Π°Π²Π½Π°Ρ HTML CSS JavaScript PHP. Π‘Π°ΠΌΠΎΡΡΠΈΡΠ΅Π»Ρ CSS Π‘ΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ CSS Π‘Π΅Π»Π΅ΠΊΡΠΎΡΡ Π‘ΡΠΈΠ»ΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π¦Π²Π΅ΡΠ° CSS ΠΠ΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ. ΠΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ Π² CSS ΠΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ CSS ΠΊ HTML. ΠΠΎΠΏΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»ΠΎΠ² Ρ Π΄Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ°ΠΉΡΠ° Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΡΠΎΠ»ΡΠΊΠΎ Ρ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΡ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΈΠΈ ΡΠ°ΠΉΡΠ° ΠΈ ΠΏΡΠΈ ΡΠΊΠ°Π·Π°Π½ΠΈΠΈ ΠΏΡΡΠΌΠΎΠΉ Π°ΠΊΡΠΈΠ²Π½ΠΎΠΉ ΡΡΡΠ»ΠΊΠΈ Π½Π° ΠΈΡΡΠΎΡΠ½ΠΈΠΊ.
38 Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ CSS Π½Π°ΡΠ°Π±ΠΎΡΠΎΠΊ Π²ΡΠΏΠ°Π΄Π°ΡΡΠΈΡ ΠΌΠ΅Π½Ρ
ΠΠ°ΠΊ ΡΠΎΠ·Π΄Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠ°ΠΉΡΠ°
Π Π°ΡΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΡΠ°ΠΌΠ°ΡΠ° ΡΠΎΠ»ΡΡΡΡΠΈ
ΠΠ°ΠΊ ΠΎΡΠΊΠΎΡΠΈΡΡ ΠΎΡ Π°ΡΠΌΠΈΠΈ 2017 Π΅ΡΠ»ΠΈ Π·Π΄ΠΎΡΠΎΠ²
ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠ°ΠΉΡΠ° Π½Π° HTML+CSS
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ CSS ΠΊΠΎΠ΄ ΠΌΠ΅Π½Ρ. CSS ΠΈ HTML Π²Π΅ΡΡΡΠΊΠ° ΠΠ°ΠΊ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠ²ΠΎΠΉ ΡΠ°ΠΉΡ Π‘Π°ΠΉΡ Π² ΠΈΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅ ΠΡΠΎΠ΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅ ΡΠ°ΠΉΡΠ° Π£ΡΠΎΠΊΠΈ ΠΏΠΎ HTML HTML 5 ΡΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ Π£ΡΠΎΠΊΠΈ ΠΏΠΎ CSS ΠΠ»ΠΎΠ³ΠΈ Π½Π° WordPress Π‘Π°ΠΉΡΡ Π½Π° Joomla Π£ΡΠΎΠΊΠΈ ΠΏΠΎ Drupal ΠΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅.
CSS Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΡΠ°ΡΠΈΠ²ΠΎΠ΅ CSS ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠ°ΠΉΡΠ°. ΠΠ»Π°Π²Π½Π°Ρ HTML ΡΡΠΎΠΊΠΈ CSS ΡΡΠΎΠΊΠΈ CSS ΠΌΠ΅Π½Ρ Π‘ΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ. ΠΠ»Π°Π²Π½Π°Ρ CSS ΡΡΠΎΠΊΠΈ CSS ΠΌΠ΅Π½Ρ Π‘ΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ. ΠΠ»Π°Π²Π½Π°Ρ Π Π½Π°ΡΠ΅ΠΌ ΠΏΡΠΎΠ΅ΠΊΡΠ΅ Π‘ΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ CSS ΡΠΏΡΠ°Π²ΠΎΡΠ½ΠΈΠΊ CSS ΡΡΠΎΠΊΠΈ ΠΠ»Ρ Π½Π°ΡΠΈΠ½Π°ΡΡΠΈΡ
CSS ΠΌΠ΅Π½Ρ Π‘ΠΎΠ·Π΄Π°Π΅ΠΌ ΠΌΠ΅Π½Ρ. Π‘ΠΎΡ
ΡΠ°Π½ΠΈΡΡ Π² ΡΠ΅ΡΠ²ΠΈΡΡ ΠΈ Π·Π°ΠΊΠ»Π°Π΄ΠΊΠΈ. ΠΠΎ Π²ΡΠ΅ΠΌ Π²ΠΎΠΏΡΠΎΡΠ°ΠΌ ΠΎΠ±ΡΠ°ΡΠ°ΠΉΡΠ΅ΡΡ Π² ΠΌΠΎΠΉ Π½ΠΎΠ²ΡΠΉ ΠΠ»ΠΎΠ³ Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ CSS ΠΌΠ΅Π½Ρ?
ΠΡΠ°ΠΏ ΡΠΏΠΈΡΠΊΠΈ Π·Π°ΡΠΈΡΠ»Π΅Π½Π½ΡΡ 2016
ΠΠ·Π³ΠΎΡΠΎΠ²Π»Π΅Π½ΠΈΠ΅ ΡΠ΅ΠΏΠ΅ΠΉ ΠΏΡΠΎΡΠΈΠ²ΠΎΡΠΊΠΎΠ»ΡΠΆΠ΅Π½ΠΈΡ ΡΠ²ΠΎΠΈΠΌΠΈ ΡΡΠΊΠ°ΠΌΠΈ Π²ΠΈΠ΄Π΅ΠΎ
ΠΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠ°ΠΉΡΠ°
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΏΠ»Π°ΡΡ
ΠΠ΅ΡΠ΅Π²ΠΎΠ΄ ΠΏΠΎΠ³ΠΎΠ½Π½ΡΡ ΠΌΠ΅ΡΡΠΎΠ² Π² ΡΠΎΠ½Π½Ρ
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° ΡΠΈΡΡΠΎΠΌ CSS3
Π‘Π²Π΅ΡΠΈ Π΄Π΅ΠΊΠΎΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΠ²ΠΎΠΈΠΌΠΈ ΡΡΠΊΠ°ΠΌΠΈ
Π’Π°Π±Π»ΠΈΡΠ° Π΄Π΅ΡΡΠΊΠΈΡ Π²Π΅Π»ΠΎΡΠΈΠΏΠ΅Π΄ΠΎΠ² ΠΏΠΎ ΡΠΎΡΡΡ
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ
ΠΡΠ»ΠΈ ΠΡ Π·Π°Π½ΠΈΠΌΠ°Π΅ΡΠ΅ΡΡ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠΌ Π»ΠΈΠ±ΠΎ Ρ ΠΠ°Ρ Π΅ΡΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΡΠ°ΠΉΡ (Π±Π»ΠΎΠ³), ΡΠΎ ΠΡ Π·Π½Π°ΠΊΠΎΠΌΡ Ρ ΡΠ΅ΠΌ, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Π΅ΡΡΡ ΠΌΠ΅Π½Ρ ΠΈ ΠΏΡΠ½ΠΊΡΡ Π² Π½Π΅ΠΌ. ΠΡΠ»ΠΈ ΠΌΡ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°Π΅ΠΌ ΠΊΠ°ΠΊΡΡ-Π»ΠΈΠ±ΠΎ ΡΠΈΡΡΠ΅ΠΌΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠ°ΠΉΡΠΎΠΌ (CMS), ΡΠΎ ΡΠ°ΠΌ Π²ΡΡΡΠ½ΡΡ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ Π½Π΅ Π½Π°Π΄ΠΎ β Π²ΡΡ Π΄Π΅Π»Π°Π΅ΡΡΡ Π½Π° Π°Π²ΡΠΎΠΌΠ°ΡΠ΅.
ΠΡΠΎ Ρ ΠΎΠ΄Π½ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ Ρ
ΠΎΡΠΎΡΠΎ, Π° Ρ Π΄ΡΡΠ³ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ ΠΏΠ»ΠΎΡ
ΠΎβ¦
ΠΠ²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΎΡΠΎΡΠΎ ΡΠΎΠ³Π΄Π°, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π²ΠΎΠΎΠ±ΡΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ ΡΠ°ΠΊΠΎΠ΅ HTML, PHP, CSS, JavaScript. Π CMS Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π²Π²Π΅ΡΡΠΈ Π½Π°Π·Π²Π°Π½ΠΈΡ ΡΡΡΠ°Π½ΠΈΡ, ΡΡΠ±ΡΠΈΠΊ ΠΈ Ρ.ΠΏ. ΠΈ ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΡΡΠΎΡΠΌΠΈΡΠΎΠ²Π°Π½ΠΎ. Π Π²ΠΎΡ ΠΏΠ»ΠΎΡ ΡΠ°ΠΊΠΎΠΉ ΡΠ΅ΠΆΠΈΠΌ Π΅Π³ΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΠ΅ΠΌ, ΡΡΠΎ Π΅ΡΠ»ΠΈ ΠΠ°ΠΌ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π²Π½Π΅ΡΡΠΈ ΠΊΠ°ΠΊΠΈΠ΅-ΡΠΎ ΠΏΡΠ°Π²ΠΊΠΈ Π² ΡΡΡΡΠΊΡΡΡΡ ΠΌΠ΅Π½Ρ, ΡΠΎ ΡΡΡ Π±Π΅Π· ΡΠΏΠ΅ΡΠΈΠ°Π»ΠΈΡΡΠ° ΡΠΆΠ΅ Π½Π΅ ΠΎΠ±ΠΎΠΉΡΠΈΡΡ. ΠΠΎΠ»Π΅Π΅ ΡΠΎΠ³ΠΎ, Π΄Π°ΠΆΠ΅ ΡΠΏΠ΅ΡΠΈΠ°Π»ΠΈΡΡΡ Π·Π°ΡΠ°ΡΡΡΡ Π²ΡΠ½ΡΠΆΠ΄Π΅Π½Ρ ΠΊΠΎΡΠ΅Π½Π½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΏΠ΅ΡΠ΅ΠΏΠΈΡΡΠ²Π°ΡΡ ΠΊΠΎΠ΄ Π²ΡΠ²ΠΎΠ΄Π° ΠΌΠ΅Π½Ρ CMS, ΡΡΠΎΠ±Ρ ΡΠ΄ΠΎΠ²Π»Π΅ΡΠ²ΠΎΡΠΈΡΡ ΠΆΠ΅Π»Π°Π½ΠΈΡ Π·Π°ΠΊΠ°Π·ΡΠΈΠΊΠ° (ΠΊΡΡΠ°ΡΠΈ ΠΈΡΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»Π΅ΠΉ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΡ ΠΈΡΠΊΠ°ΡΡ Π·Π΄Π΅ΡΡ).
Π‘ΠΊΠ°ΠΆΡ Π±ΠΎΠ»ΡΡΠ΅: Π΅ΡΠ»ΠΈ ΠΌΡ Π²ΠΎΠ·ΡΠΌΠ΅ΠΌ ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ Π½Π° ΡΠ΅Π³ΠΎΠ΄Π½ΡΡΠ½ΠΈΠΉ Π΄Π΅Π½Ρ CMS β WordPress, ΡΠΎ Π½Π°Π·Π²Π°Π½ΠΈΡ ΡΡΠ±ΡΠΈΠΊ Π² ΡΠ°ΠΉΠ΄Π±Π°ΡΠ΅ ΡΠΎΡΡΠΈΡΡΡΡΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠΎ Π°Π»ΡΠ°Π²ΠΈΡΡ. ΠΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ ΠΈΡ Π²ΡΠ²ΠΎΠ΄Π° Π±Π΅Π· ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΡΠΈΠ»Π°ΠΌΠΈ ΡΠ°ΠΌΠΎΠΉ CMS Π½Π΅Π»ΡΠ·Ρβ¦
ΠΡΠ»ΠΈ ΠΡ Ρ
ΠΎΡΠΎΡΠΎ Π·Π½Π°Π΅ΡΠ΅ HTML, JavaScript, ΡΠΎ ΡΠΎΠ·Π΄Π°ΡΡ ΠΌΠ΅Π½Ρ Π»ΡΠ±ΠΎΠ³ΠΎ Π²ΠΈΠ΄Π° Π΄Π»Ρ ΠΠ°Ρ Π½Π΅ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ Π½ΠΈΠΊΠ°ΠΊΠΎΠΉ ΡΠ»ΠΎΠΆΠ½ΠΎΡΡΠΈ.
Π Π²ΠΎΡ Π΅ΡΠ»ΠΈ ΡΡΠΈ ΡΠ·ΡΠΊΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΡ Π·Π½Π°Π΅ΡΠ΅ Π»ΠΈΡΡ ΠΏΠΎΠ²Π΅ΡΡ
Π½ΠΎΡΡΠ½ΠΎ ΠΈΠ»ΠΈ Π²ΠΎΠ²ΡΠ΅ ΠΎ Π½ΠΈΡ
ΡΠ»ΡΡΠΈΡΠ΅ Π²ΠΏΠ΅ΡΠ²ΡΠ΅, ΡΠΎ Π·Π°Π΄Π°ΡΠ° ΠΎΠΊΠ°ΠΆΠ΅ΡΡΡ Π΄Π»Ρ ΠΠ°Ρ ΡΠΊΠΎΡΠ΅Π΅ Π²ΡΠ΅Π³ΠΎ Π½Π΅ΠΏΠΎΠ΄ΡΠ΅ΠΌΠ½ΠΎΠΉ, ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ Π΅ΡΠ»ΠΈ Π΄Π΅Π»ΠΎ ΠΊΠ°ΡΠ°Π΅ΡΡΡ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ.
Pure CSS Menu β ΠΎΠ½Π»Π°ΠΉΠ½ Π³Π΅Π½Π΅ΡΠ°ΡΠΎΡ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠ°ΠΉΡΠ°. Π‘ Π΅Π³ΠΎ ΠΏΠΎΠΌΠΎΡΡΡ ΠΡ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ Π»ΠΈΠ±ΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠΌ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎΠΌ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΠΎΠ².
ΠΡΠΈΠΌΠ΅Ρ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎΠ³ΠΎ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ
ΠΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ Π² Π΄Π°Π½Π½ΠΎΠΌ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅ ΡΠΎΠ·Π΄Π°Π΅ΡΡΡ Π½Π° ΡΠΈΡΡΠΎΠΌ HTML ΠΈ CSS Π±Π΅Π· ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ JavaScript. ΠΡΠΎ Π½Π΅ΡΠΎΠΌΠ½Π΅Π½Π½ΡΠΉ ΠΏΠ»ΡΡ, Ρ.ΠΊ. Π·Π°ΡΠ°ΡΡΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ°Ρ ΠΎΡΠΊΠ»ΡΡΠ΅Π½ JavaScript, ΠΈ ΡΠΎΠ³Π΄Π° ΠΠ°ΡΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΏΠΎΡΠ΅ΡΠΈΡΠ΅Π»Π΅ΠΉ Π½Π΅ Π±ΡΠ΄Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ.
ΠΠΎΠΌΡ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΏΠΎΠ»Π΅Π·Π΅Π½ ΡΠ΅ΡΠ²ΠΈΡ
- Π²Π΅Π±-ΠΌΠ°ΡΡΠ΅ΡΠ°ΠΌ, Ρ ΠΎΡΠΎΡΠΎ Π·Π½Π°ΡΡΠΈΠΌΒ ΡΠ·ΡΠΊΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ, Ρ.ΠΊ. ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ ΠΈΠΌ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠΎΠΊΡΠ°ΡΠΈΡΡ Π²ΡΠ΅ΠΌΡ Π½Π° ΡΡΡΠΈΠ½Π½ΠΎΠΉ ΠΎΠΏΠ΅ΡΠ°ΡΠΈΠΈ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ ΠΊΠΎΠ΄Π° ΠΌΠ΅Π½Ρ;
- Π²Π»Π°Π΄Π΅Π»ΡΡΠ°ΠΌ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΡΠ°ΠΉΡΠΎΠ² ΠΈΠ»ΠΈ Π±Π»ΠΎΠ³ΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΠΎΡΡΡ ΡΠΎΠ·Π΄Π°ΡΡ ΠΌΠ΅Π½Ρ, Π½ΠΎ Π½Π΅ Π·Π½Π°ΡΡ, ΠΊΠ°ΠΊ ΡΡΠΎ Π΄Π΅Π»Π°Π΅ΡΡΡ.
ΠΠ°ΠΊ ΡΠΎΠ·Π΄Π°ΡΡ ΠΌΠ΅Π½Ρ
Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΠΌΠ΅Π½Ρ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΡΠ΅ΡΠ²ΠΈΡΠ° Pure CSS Menu ΠΏΡΠΎΠΈΡΡ
ΠΎΠ΄ΠΈΡ Π² Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠΌ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅.
ΠΠ»Ρ Π½Π°ΡΠ°Π»Π° Π½Π° Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Β«TemplatesΒ» Π²ΡΠ±Π΅ΡΠΈΡΠ΅ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΡΠΉ ΡΠ°Π±Π»ΠΎΠ½ ΠΌΠ΅Π½Ρ ΠΈΠ· Π²ΠΎΡΡΠΌΠΈ Π΄ΠΎΡΡΡΠΏΠ½ΡΡ
. ΠΠ΅ ΠΎΠ±ΡΠ°ΡΠ°ΠΉΡΠ΅ ΠΏΠΎΠΊΠ° Π²Π½ΠΈΠΌΠ°Π½ΠΈΡ Π½Π° ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΏΡΠ½ΠΊΡΠΎΠ² ΠΈ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΠΎΠ² ΠΌΠ΅Π½Ρ, ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠΈΡΡΠ°, ΡΠ²Π΅Ρ ΠΈ ΠΏΡ. β Π²ΡΡ ΡΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ, ΠΏΠ΅ΡΠ΅ΠΉΠ΄Ρ Π² Π·Π°ΠΊΠ»Π°Π΄ΠΊΡ Β«ParametersΒ».
ΠΡΠ±ΠΎΡ ΡΠ°Π±Π»ΠΎΠ½Π° ΠΌΠ΅Π½Ρ
ΠΠ°ΡΡΡΠΎΠΉΠΊΠ° ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² ΠΌΠ΅Π½Ρ
ΠΡΠ½ΠΊΡΡ ΠΈ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ, ΠΈΡ Π½Π°Π·Π²Π°Π½ΠΈΡ, ΠΏΠΎΡΡΠ΄ΠΎΠΊ ΡΠ»Π΅Π΄ΠΎΠ²Π°Π½ΠΈΡ, ΡΡΡΠ»ΠΊΠΈ ΠΈ ΠΏΡ. ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡΡΡΡ Π² Π½Π°ΡΡΡΠΎΠΉΠΊΠ°Ρ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ, ΠΏΠ΅ΡΠ΅ΠΉΠ΄Ρ ΠΏΠΎ Π·Π°ΠΊΠ»Π°Π΄ΠΊΠ΅ Β«ItemsΒ». Π’.ΠΊ. ΠΌΠ½ΠΎΠ³ΠΈΠ΅ Π½Π΅ Π·Π½Π°ΡΡ Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΎΠ³ΠΎ, ΠΎΠ±ΡΡΡΠ½Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ½ΠΎΠΏΠΎΠΊ ΡΡΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°.
ΠΠ°ΡΡΡΠΎΠΉΠΊΠ° ΠΏΡΠ½ΠΊΡΠΎΠ² ΠΌΠ΅Π½Ρ
1 β Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ Π² ΠΊΠΎΠ½Π΅Ρ Π²ΡΠ΅Π³ΠΎ ΡΠΏΠΈΡΠΊΠ°
2 β Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ ΡΡΠ°Π·Ρ Π·Π° Π°ΠΊΡΠΈΠ²Π½ΡΠΌ (Π²ΡΠ΄Π΅Π»Π΅Π½ΡΠΌ) Π² ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅ ΠΏΡΠ½ΠΊΡΠΎΠΌ
3 β Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡ Π² Π°ΠΊΡΠΈΠ²Π½ΡΠΉ (Π²ΡΠ΄Π΅Π»Π΅Π½ΡΠΉ) ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ
4 β ΡΠ΄Π°Π»ΠΈΡΡ ΠΏΡΠ½ΠΊΡ (ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡ) ΠΌΠ΅Π½Ρ
5 β ΡΠ΄Π°Π»ΠΈΡΡ Π²ΡΠ΅ ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ Ρ ΠΏΠΎΠ΄ΠΏΡΠ½ΠΊΡΠ°ΠΌ
ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ ΡΠΊΠ°Π·Π°ΡΡ ΡΡΡΠ»ΠΊΠΈ Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΏΡΠ½ΠΊΡΠ° ΠΌΠ΅Π½Ρ, ΠΏΠΎΠ΄ΡΠΊΠ°Π·ΠΊΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΈ ΡΠΏΠΎΡΠΎΠ± ΠΎΡΠΊΡΡΡΠΈΡ ΡΡΡΠ»ΠΎΠΊ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΡ ΠΏΠΎΠ»ΡΡ ΠΏΠΎΠ΄ ΠΎΠ±Π»Π°ΡΡΡΡ ΠΏΡΠ΅Π΄ΠΏΡΠΎΡΠΌΠΎΡΡΠ° ΠΌΠ΅Π½Ρ!
Π‘Π²ΠΎΠΉΡΡΠ²Π° ΠΏΡΠ½ΠΊΡΠΎΠ² ΠΌΠ΅Π½Ρ
ΠΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΡ ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΠ΅ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΈ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ ΠΠ°ΡΠ΅Π³ΠΎ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ, Π½Π°ΠΆΠΈΠΌΠ°ΠΉΡΠ΅ ΠΊΠ½ΠΎΠΏΠΊΡ Β«DownloadΒ» ΠΈ ΡΠΎΡ
ΡΠ°Π½ΡΠΉΡΠ΅ Π½Π° ΡΠ²ΠΎΠ΅ΠΌ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ΅ Π°ΡΡ
ΠΈΠ² ΡΠΎ Π²ΡΠ΅ΠΌ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΡΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ (Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ Π·Π°ΡΠ΅Π³ΠΈΡΡΡΠΈΡΠΎΠ²Π°ΡΡΡΡ).
ΠΠ½ΡΡΡΠΈ Π°ΡΡ ΠΈΠ²Π° ΠΡ Π½Π°ΠΉΠ΄Π΅ΡΠ΅ ΠΏΠ°ΠΏΠΊΡ Β«imagesΒ»Β Ρ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ Π² ΠΌΠ΅Π½Ρ, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠ°ΠΉΠ» Β«purecssmenu.htmlΒ» ΡΠΎ ΡΠ³Π΅Π½Π΅ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ. ΠΠ°Π³ΡΡΠΆΠ°ΠΉΡΠ΅ ΠΏΠ°ΠΏΠΊΡ Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°ΠΌΠΈ Π² Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ ΠΠ°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°, Π²ΡΡΠ°Π²Π»ΡΠΉΡΠ΅ ΠΊΠΎΠ΄ ΠΌΠ΅Π½Ρ Π² Π½ΡΠΆΠ½ΠΎΠ΅ ΠΌΠ΅ΡΡΠΎ ΠΈ Π½Π°ΡΠ»Π°ΠΆΠ΄Π°ΠΉΡΠ΅ΡΡ ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ Π²ΡΠΏΠ°Π΄Π°ΡΡΠΈΠΌ ΠΌΠ΅Π½Ρ, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΠΎΠΌ Π½Π° ΠΏΡΠΎΡΡΠΎΠΌ HTML + CSS.
ΠΠΈΠ΄Π΅ΠΎΡΡΠΎΠΊ ΠΏΠΎ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ:
ΠΡΡΠ·ΡΡ, ΠΏΠΎΠ½ΡΠ°Π²ΠΈΠ»ΡΡ Π»ΠΈ ΠΠ°ΠΌ Π΄Π°Π½Π½ΡΠΉ ΡΠ΅ΡΠ²ΠΈΡ? ΠΠ½Π°Π΅ΡΠ΅ Π»ΠΈ ΠΡ Π±ΠΎΠ»Π΅Π΅ ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠ΅ Π°Π½Π°Π»ΠΎΠ³ΠΈ? ΠΠ΅Π»ΠΈΡΠ΅ΡΡ ΡΠ²ΠΎΠΈΠΌΠΈ Π²ΠΏΠ΅ΡΠ°ΡΠ»Π΅Π½ΠΈΡΠΌΠΈ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ .
22 ΠΊΡΡΡΡΡ ΠΏΡΠΈΠΌΠ΅ΡΠ° Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΌΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ CSS (ΠΠΠ‘ΠΠΠΠ’ΠΠ«Π Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΠΈ)
ΠΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ
Π€ΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° ΠΏΡΠΎΡΡΠΎΠ³ΠΎ Π±ΠΎΠΊΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ Ρ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ ΠΎΡΠΊΡΡΡΠΈΡ/Π·Π°ΠΊΡΡΡΠΈΡ, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΉ Ρ ΠΏΠΎΠΌΠΎΡΡΡ β€οΈ Π΄Π»Ρ Frontend planet.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎ
SVG Π»ΠΈΠΏΠΊΠΎΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ°
ΠΡΠΎΡ ΠΏΡΠΈΠΌΠ΅Ρ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΈΠΌΠ΅Π΅Ρ ΠΏΡΠΈΡΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ ΠΆΠΈΠ΄ΠΊΠΎΡΡΠΈ, ΠΊΠΎΠ³Π΄Π° Π²Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΠ΅ ΠΊΡΡΡΠΎΡ Π±Π»ΠΈΠ·ΠΊΠΎ ΠΊ Π·Π½Π°ΡΠΊΡ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ°.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π‘ΠΊΠΎΠ»ΡΠ·ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ°
ΠΡΠΎΡ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ ΠΈΠ·ΡΡΠ½ΠΎΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΡΠΌ ΡΡΠ΅Ρ ΠΌΠ΅ΡΠ½ΡΠΌ ΡΡΡΠ΅ΠΊΡΠΎΠΌ ΡΠ°ΡΠΊΡΡΡΠΈΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΡΠ°ΡΠ°ΡΡΠ°ΡΡΡ 3D-Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ
ΠΠ»Π°ΡΡΠ½ΠΎΠ΅ Π²ΡΠ°ΡΠ°ΡΡΠ΅Π΅ΡΡ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ HTML/CSS Ρ 3D-ΡΡΡΠ΅ΠΊΡΠΎΠΌ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ 3D-ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅
ΠΡΠΎΡ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΈΠ·ΡΡΠ½ΡΠΌ ΠΈ ΠΊΡΠ°ΡΠΈΠ²ΡΠΌ ΡΡΡΠ΅ΠΊΡΠΎΠΌ 3D-ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
JS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
SCSS
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ Π±ΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½Π°Ρ ΠΏΡΠ°Π²Π°Ρ Π±ΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Ρ ΠΏΠ»Π°Π²Π½ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ ΠΎΡΠΊΡΡΡΠΈΡ/Π·Π°ΠΊΡΡΡΠΈΡ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
JS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΡΠ΄Π΅Π»Π°Π½Π½ΠΎΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Bootstrap, Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΡ ΡΠΊΡΡΠ²Π°ΡΡ ΠΈ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡ Π΅Π³ΠΎ, Π° ΡΠ°ΠΊΠΆΠ΅ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠΉ ΠΌΠ½ΠΎΠ³ΠΎΡΠ²Π΅ΡΠ½ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° Π½Π° ΡΠ°Π·Π½ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
JS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
Bootstrap
Animate CSS
Tether
Popper JS
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ°Π²ΠΈΠ³Π°ΡΠΈΡ Π½Π° Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, Π²ΡΠΏΠΎΠ»Π½Π΅Π½Π½Π°Ρ Π½Π° ΡΠΈΡΡΠΎΠΌ CSS
Π€ΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° ΠΌΠ½ΠΎΠ³ΠΎΡΡΠΎΠ²Π½Π΅Π²ΠΎΠ³ΠΎ Π±ΠΎΠΊΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ, ΡΠΎΠ·Π΄Π°Π½Π½ΡΠΉ ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠΈΡΡΠΎΠ³ΠΎ CSS ΠΈ HTML.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ
ΠΡΠΎΡ Codepen ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π½Π°Π±ΠΎΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ
ΡΠΊΠΎΠ»ΡΠ·ΡΡΠΈΡ
ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄ΠΎΠ² Π΄Π»Ρ ΠΌΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, ΠΏΠΎΠ»Π΅Π·Π½ΡΡ
Π΄Π»Ρ Π²Π΄ΠΎΡ
Π½ΠΎΠ²Π΅Π½ΠΈΡ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅ΡΠ΅ΠΊΡΠ΅ΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ
ΠΠ΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ ΠΏΠΎΠΏΠ΅ΡΠ΅ΡΠ½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ, ΠΊΡΠ°ΡΠΈΠ²ΠΎ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠΈ ΠΎΡΠΊΡΡΡΠΈΠΈ ΠΈ Π·Π°ΠΊΡΡΡΠΈΠΈ Π½Π°ΠΆΠ°ΡΠΈΠ΅ΠΌ ΠΊΠ½ΠΎΠΏΠΊΠΈ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ°.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ»Π°ΡΡΠΈΡΠ½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»ΠΎΠ² Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ SVG
ΠΡΠΈΠΌΠ΅Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Ρ ΡΠΏΡΡΠ³ΠΎΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠ΅ΠΉ SVG ΠΏΡΠΈ ΠΎΡΠΊΡΡΡΠΈΠΈ
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
SCSS
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π€ΠΈΠΎΠ»Π΅ΡΠΎΠ²ΠΎΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ
Π‘ΡΠ°ΡΠΈΡΠ½ΠΎΠ΅ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΡΠΈΠΎΠ»Π΅ΡΠΎΠ²ΠΎΠΉ ΡΠ΅ΠΌΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Π±Π΅Π· Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π° Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ, Π½ΠΎ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΡΠ΅Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΠΎΠΊΠ°Π·Π°ΡΡ/ΡΠΊΡΡΡΡ CSS
ΠΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΏΠΎΠ»Π½ΡΡ Π²Π΅ΡΡΠΈΡ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ Π½Π° ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π¨Π°Π±Π»ΠΎΠ½ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Pro
ΠΡΠΎΡ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠΎΠ±ΠΎΠΉ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΊΡΠ°ΡΠΈΠ²ΡΠΌ ΡΠΎΠ½ΠΎΠΌ, ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΡΠΌΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ Π²Π½ΡΡΡΠΈ ΠΌΠ΅Π½Ρ ΠΈ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΠΌΠΎΠΉ Π²Π΅ΡΡΠΈΠ΅ΠΉ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° Π·Π½Π°ΡΠΎΠΊ ΠΌΠ΅Π½Ρ-Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ°.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ Easy Ionic
ΠΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΡΠ²Π΅ΡΠ½ΡΠΌΠΈ Π·Π½Π°ΡΠΊΠ°ΠΌΠΈ Π΄Π»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΏΡΠ½ΠΊΡΠ° ΠΌΠ΅Π½Ρ, ΡΠΎΠ·Π΄Π°Π½Π½ΠΎΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Ionic, ΠΈ Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ ΡΡΡΠ΅ΠΊΡΠ°ΠΌΠΈ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π° Π²Π²ΠΎΠ΄Π°.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
Haml
SCSS
JQuery
Code Demoic and ImonicI
ΠΠΎΠΊΠΎΠ²ΠΎΠ΅ ΡΠΊΠΎΠ»ΡΠ·ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ CSS
ΠΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π½Π° ΡΠΈΡΡΠΎΠΌ CSS Ρ ΡΡΡΠ΅ΠΊΡΠΎΠΌ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ° ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Awesome Bootstrap 3 ΠΠ°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΠΎ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ
ΠΡΠ° Π±ΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ ΡΠ΄Π΅Π»Π°Π½Π° Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΈΠ·Π²Π΅ΡΡΠ½ΠΎΠΉ CSS-ΠΈΠ½ΡΡΠ°ΡΡΡΡΠΊΡΡΡΡ Bootstrap.
ΠΠΌΠ΅Π΅Ρ ΡΡΡΠ΅ΠΊΡ ΡΠΊΠΎΠ»ΡΠΆΠ΅Π½ΠΈΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΌΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΈ ΡΠΊΡΡΠ²Π°Π΅Ρ/ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΌΠ΅Π½Ρ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠ΅Π½ΡΡΠ΅
Bootstrap
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π‘ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ
Π€ΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ Π±ΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ, ΡΠ΄Π΅Π»Π°Π½Π½Π°Ρ ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS ΠΈ HTML, ΠΎΠ½Π° ΠΈΠΌΠ΅Π΅Ρ Π·Π°ΠΊΡΡΠ³Π»Π΅Π½Π½ΡΠΉ ΡΡΡΠ΅ΠΊΡ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ, ΠΈΠ³ΡΠ°ΡΡΠΈΠΉ Ρ ΠΊΠΎΠ½ΡΡΠ°ΡΡΠΎΠΌ ΡΠΎΠ½Π°.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π±Π΅Π· Javascript, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΈΠΌΠ΅Π΅Ρ ΠΊΡΠ°ΡΠΈΠ²ΡΠΉ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ ΠΏΡΠΈ ΠΎΡΠΊΡΡΡΠΈΠΈ ΠΈ Π½Π΅Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π½Π΅ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΠΈ ΡΠΎΠ½Π° ΠΏΡΠΈ ΠΎΡΠΊΡΡΡΠΈΠΈ ΠΌΠ΅Π½Ρ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΠΎΠΊΠΎΠ²ΡΠ΅ ΠΌΠ΅Π½Ρ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ° Ρ ΠΏΠΎΠΌΠΎΡΡΡ Tailwind CSS
Codepen Π½Π΅ΠΊΠΎΡΠΎΡΡΡ
Π±ΠΎΠΊΠΎΠ²ΡΡ
ΠΌΠ΅Π½Ρ Π°Π΄ΠΌΠΈΠ½ΠΈΡΡΡΠ°ΡΠΎΡΠ°, ΡΠΎΠ·Π΄Π°Π½Π½ΡΡ
ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ HTML ΠΈ Tailwind CSS, Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π±ΠΎΠ½ΡΡΠ° Ρ Π²Π°Ρ Π΅ΡΡΡ ΡΠ΅ΠΌΠ½ΡΠΉ ΡΠ΅ΠΆΠΈΠΌ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΈΠ· Π½ΠΈΡ
.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
Tailwind
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
ΠΡΠΏΡΠ°Π²Π»Π΅Π½Π° ββΠ½Π°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ
ΠΡΠΏΡΠ°Π²Π»Π΅Π½Π° ββΠ½Π°Π²ΠΈΠ³Π°ΡΠΈΡ Ρ ΡΡΡΠ΅ΠΊΡΠΎΠΌ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ, ΠΎΡΠΊΡΡΠ²Π°ΡΡΠ°Ρ ΠΏΠΎΠ»Π½ΡΡ Π²Π΅ΡΡΠΈΡ, ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΈΠΌΠ΅ΡΡ ΡΡΡΠ΅ΠΊΡ Π³ΡΠ°Π΄ΠΈΠ΅Π½ΡΠ° Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
Π‘Π²ΠΎΡΠ°ΡΠΈΠ²Π°ΡΡΠ΅Π΅ΡΡ Π±ΠΎΠΊΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ
Π€ΡΠ°Π³ΠΌΠ΅Π½Ρ ΠΊΠΎΠ΄Π° Π±ΠΎΠΊΠΎΠ²ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΡΡΡ ΠΈ ΡΠ°Π·Π²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅ΡΡΡ Π² ΠΌΠ΅Π½Ρ-Π³Π°ΠΌΠ±ΡΡΠ³Π΅Ρ.
Π‘Π΄Π΅Π»Π°Π½ΠΎ Ρ:
HTML
CSS
Javascript
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ:
SCSS
JQuery
ΠΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΊΠΎΠ΄ ΠΈ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ
17 ΠΊΡΠ°ΡΠΈΠ²ΡΡ ΠΌΠ΅Π½Ρ JavaScript, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Π°ΠΌ ΠΏΠΎΠ½ΡΠ°Π²ΡΡΡΡ [ΠΏΡΠΈΠΌΠ΅ΡΡ]
ΠΠ°Π²ΠΈΠ³Π°ΡΠΈΡ ΠΏΠΎ Π²Π΅Π±-ΡΠ°ΠΉΡΡ ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ½Π° ΠΏΡΠΈ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ΅ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°. ΠΡΠΎ Π³Π»Π°Π²Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ° ΠΈ, Π²Π΅ΡΠΎΡΡΠ½ΠΎ, ΡΠΎΡ, Ρ ΠΊΠΎΡΠΎΡΡΠΌ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΡΡΡ.
ΠΠ΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠΎ, ΡΡΠΎ ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠΎΠ·Π΄Π°ΡΡ ΠΏΡΠΎΡΡΠΎΠ΅ ΠΈ ΡΠΈΡΡΠΎΠ΅ ΠΌΠ΅Π½Ρ HTML ΠΈ CSS, ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ JavaScript ΠΌΠΎΠΆΠ΅Ρ ΠΏΠΎΠΌΠΎΡΡ ΠΏΠΎΠ²ΡΡΠΈΡΡ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΠΎΡΡΡ ΠΈ ΡΠ»ΡΡΡΠΈΡΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ Π² ΡΠ΅Π»ΠΎΠΌ.![]()
JavaScript-ΠΌΠ΅Π½Ρ β ΡΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΡΠ΄Π΅Π»ΠΈΡΡ ΠΌΠ΅Π½Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, Π° Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½Π°Ρ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎΡΡΡ Π΄Π΅Π»Π°Π΅Ρ Π²ΡΠ΅ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠΌ.
ΠΡΠ»ΠΈ Π²Ρ ΠΏΠΎΠΏΠ°Π»ΠΈ ΡΡΠ΄Π° Π² ΠΏΠΎΠΈΡΠΊΠ°Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ Π³Π°ΠΌΠ±ΡΡΠ³Π΅Ρ-ΠΌΠ΅Π½Ρ, Π²Π°ΠΌ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΏΡΠΎΠ²Π΅ΡΠΈΡΡ ΡΡΠΈ Π³Π°ΠΌΠ±ΡΡΠ³Π΅Ρ-ΠΌΠ΅Π½Ρ Π½Π° ΡΠΈΡΡΠΎΠΌ CSS!
ΠΠ΅Π½Ρ JavaScript ΠΈΠ·Π²Π΅ΡΡΠ½ΠΎ ΠΊΠ°ΠΊ Π±ΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ, Π½Π°Π²ΠΈΠ³Π°ΡΠΈΡ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ΅ ΠΈΠ»ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ. JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΊΡΠ°ΡΠΈΠ²ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΉ ΠΈΠ»ΠΈ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° ΠΌΠ΅Π½Ρ.
ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ JavaScript, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ ΠΌΠ΅Π½Ρ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΌ ΠΈ ΡΠ²ΠΎΡΡΠ΅ΡΠΊΠΈΠΌ β Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠΎΠ±ΡΡΠΈΡΠΌΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ ΡΠ΅Π»ΡΠΊΠ° ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΠ΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½Π° ΡΠΎΠ»ΡΠΊΠΎ Π½Π° ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌ ΡΡΠΎΠ²Π½Π΅ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΠΎΠ»ΡΠΊΠΎ CSS.
JavaScript Π΄Π°Π΅Ρ Π²Π°ΠΌ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ Π½Π΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠ»ΡΡΠΈΡΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΠΎΠ»ΡΠΊΠΎ HTML ΠΈ CSS.
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π±Π΅Π· ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ JavaScript, Π½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°ΡΡ ΡΡΠΎ-ΡΠΎ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠ΅ ΠΈ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΠ΅.
ΠΠΎ Π²ΡΠ΅Ρ
ΡΡΠΈΡ
ΠΏΡΠΈΠΌΠ΅ΡΠ°Ρ
JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΡ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ.
1. ΠΠ΅Π½Ρ JavaScript Π΄Π»Ρ Π½Π°ΠΊΠ»ΠΎΠ½Π° ΡΡΡΠ°Π½ΠΈΡΡ
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
Π£Π½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ ΡΡΡΠ΅ΠΊΡ Π½Π°ΠΊΠ»ΠΎΠ½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠ΅Π½Ρ ΡΠ»Π΅Π²Π°. Π©Π΅Π»ΡΠΎΠΊ ΠΏΠΎ Π·Π½Π°ΡΠΊΡ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ° Π°ΠΊΡΠΈΠ²ΠΈΡΡΠ΅Ρ ΠΌΠ΅Π½Ρ ΠΈ ΡΠ΄Π²ΠΈΠ³Π°Π΅Ρ Π²Π΅ΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΉ ΠΊΠΎΡΠΏΡΡ Π²ΠΏΡΠ°Π²ΠΎ ΠΏΠΎΠ΄ Π½Π°ΠΊΠ»ΠΎΠ½ΠΎΠΌ.
ΠΡΠΎΠ²Π΅ΡΡΡΠ΅ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΡ CSS ΠΌΠ΅Π½Ρ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠΎΠ² Π΄Π»Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Ρ ΡΡΠΈΠΌ ΠΌΠ΅Π½Ρ JavaScript.
ΠΠ»Π°Π²Π½Π°Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΠΈ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΉ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄, ΠΌΠ΅Π½Ρ ΠΈΠΌΠ΅Π΅Ρ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ Π·Π°ΠΊΡΡΡΠΈΡ, Π° Π·Π½Π°ΡΠΎΠΊ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ° ΡΠ΄ΠΎΠ±Π½ΠΎ ΡΠΊΠΎΠ»ΡΠ·ΠΈΡ Π½Π°Π΄ ΡΠΊΡΠ°Π½ΠΎΠΌ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΠΎ ΠΊΠ»Π°ΡΡΠ½ΠΎΠ΅ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π΅ ΠΌΠ΅Π½Ρ JavaScript β ΡΠ°Π½ΡΠ°ΡΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΠΌΠ½ΠΎΠ³ΠΎΡΠ΅Π»Π΅Π²ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΏΠΈΡΠ°ΡΡ Π² ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½.
ΠΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠΈΡ ΡΡ ΠΌΠ΅Π½Ρ ΠΈΠΌΠ΅ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ ΡΡΠΎΠ²Π΅Π½Ρ, Π½ΠΎ ΡΡΠΎ ΡΠ°ΡΠΊΡΡΠ²Π°ΡΡΠ΅Π΅ΡΡ ΠΌΠ΅Π½Ρ JavaScript ΠΈΠΌΠ΅Π΅Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠΎΠ²Π½Π΅ΠΉ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΡΠ±ΡΠ°ΡΡ ΠΏΠΎΠ΄ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΡ ΠΈ ΠΎΡΠΊΡΡΡΡ Π½ΠΎΠ²ΠΎΠ΅ ΠΌΠ΅Π½Ρ β Π·Π°ΡΠ΅ΠΌ Π²Ρ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΆΠ°ΡΡ Β«ΠΠ°Π·Π°Π΄Β», ΡΡΠΎΠ±Ρ ΠΏΠ΅ΡΠ΅ΠΉΡΠΈ ΡΡΠ΄Π°, Π³Π΄Π΅ Π²Ρ Π±ΡΠ»ΠΈ.
ΠΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ°ΡΡΠΈΡΠ΅Π½Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ, Π° Π²Π½ΡΡΡΠΈ CSS Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΡΡΠ½ΡΡ ΠΈ ΠΏΡΠΎΡΡΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ , ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ Π΄Π»Ρ ΡΠ΅Π΄Π°ΠΊΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΡΠΈΠ»Ρ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΡΡΠΎΠ΅ ΠΈ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ JavaScript, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°ΡΡ Π² Π»ΡΠ±ΠΎΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°, ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ²Π΅ΡΠ° ΠΌΠ΅Π½Ρ, ΡΡΠΈΠ»Ρ ΡΡΠΈΡΡΠ° ΠΈ ΡΠ²Π΅ΡΠ° ΡΠΎΠ½Π° Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ Π²Π°ΡΠΈΠΌ Π±ΡΠ΅Π½Π΄ΠΎΠΌ Π² CSS β ΠΏΡΠΎΡΡΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΠ΅, ΡΠΆΠ΅ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»Π΅Π½Π½ΡΠ΅ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ.
Π‘ΡΡΡΠΊΡΡΡΠ° HTML ΠΏΡΠΎΡΡΠ° Π΄Π»Ρ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΡ ΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ, Π° JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΌΠ΅Π½Ρ ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΡ ΠΊΠ»Π°ΡΡΠΎΠ² ΠΏΡΠΈ ΡΠ΅Π»ΡΠΊΠ΅.
Π‘ΠΌ.
ΠΏΠ΅ΡΠΎ
Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠ΅Π½Ρ JavaScript Π±ΡΠ²Π°ΡΡ Π²ΡΠ΅Ρ ΡΠΎΡΠΌ ΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ², ΠΈ Ρ ΠΎΡΡ ΡΡΠΎ ΠΌΠ΅Π½Ρ Π±ΠΎΠ»ΡΡΠ΅ ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΎ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΡΡΠΎΠΉΡΡΠ²Π°, Π²Ρ Π²ΡΠ΅ ΡΠ°Π²Π½ΠΎ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ΅.
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²Π½Π΅Π΄ΡΠΈΡΡ ΡΡΠΎΡ Π΄ΠΈΠ·Π°ΠΉΠ½ Π² ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ Π²Π΅Π±-ΡΠ°ΠΉΡ, ΠΊΠ°ΠΊ Ρ ΠΎΡΠΈΡΠ΅, ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΌΠ΅Π½Ρ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠ² ΠΈΠ»ΠΈ ΠΊΠ°ΠΊ ΠΌΠ΅Π½Ρ, ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠ΅ ΡΡΡΡΠΎΠΉΡΡΠ²Π°.
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»ΡΠ½Π°, Π° JavaScript ΠΌΠΈΠ½ΠΈΠΌΠ°Π»Π΅Π½, ΠΈ ΠΎΠ½ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π²Π°ΠΌ, ΠΊΠ°ΠΊ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ JavaScript, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΠΈΠ»ΠΈ CSS Π±ΠΎΠ»Π΅Π΅ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ½ΡΠΌΠΈ ΠΈ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΡΠΌΠΈ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΠ΅Π°ΡΠΈΠ²Π½ΠΎΠ΅ ΠΈ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ JavaScript, ΠΊΠΎΡΠΎΡΡΠΌ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΈΡΡΠ½ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ. Π©Π΅Π»ΡΠΎΠΊ ΠΏΠΎ Π·Π½Π°ΡΠΊΡ ΠΌΠ΅Π½Ρ ΠΏΠ»Π°Π²Π½ΠΎ ΡΠ΄Π²ΠΈΠ³Π°Π΅Ρ Π΅Π³ΠΎ Π² ΡΠ΅Π½ΡΡ ΠΈ ΠΎΡΠΊΡΡΠ²Π°Π΅Ρ ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅Ρ
ΠΎΠ΄Π° Π½Π° Π΄ΡΡΠ³ΠΈΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ.
Π©Π΅Π»ΡΠΎΠΊ ΠΏΠΎ Π·Π½Π°ΡΠΊΡ ΠΌΠ΅Π½Ρ ΠΎΠ±Π΅ΡΠΏΠ΅ΡΠΈΠ²Π°Π΅Ρ ΠΏΠ»Π°Π²Π½ΡΠΉ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ Π½Π° Π½ΠΎΠ²ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈ Π²ΡΠ΅ Π·Π°Π³ΡΡΠΆΠ°Π΅ΡΡΡ ΠΊΠ°ΠΊ ΠΎΠ΄Π½ΠΎΡΡΡΠ°Π½ΠΈΡΠ½ΠΎΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅. ΠΠ½Π°ΡΠΎΠΊ ΠΌΠ΅Π½Ρ ΠΎΡΡΠ°Π΅ΡΡΡ Π½Π° ΡΠΎΠΌ ΠΆΠ΅ ΠΌΠ΅ΡΡΠ΅, ΡΡΠΎ ΡΠΏΡΠΎΡΠ°Π΅Ρ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ Π² Π΄ΡΡΠ³ΠΎΠ΅ ΠΌΠ΅ΡΡΠΎ.
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΠΎΡΠ΅Π½Ρ ΠΏΠ»Π°Π²Π½Π°Ρ ΠΈ Π½Π΅ ΠΏΠ΅ΡΠ΅Π½Π°ΡΡΡΠ΅Π½Π½Π°Ρ, Π² ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π΅ΡΡΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΎΠΏΡΡ.
ΠΠ°ΡΠ»Π°ΠΆΠ΄Π°ΡΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π°ΠΌΠΈ ΡΡΡΠ°Π½ΠΈΡ Π² ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅, ΠΌΡ Π½Π°ΠΏΠΈΡΠ°Π»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΠΎ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΡΠ΄ΠΈΠ²ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄Π°Ρ ΡΡΡΠ°Π½ΠΈΡ JavaScript
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡ ΡΠ°ΠΊ ΠΏΡΠΈΠ²ΡΠΊΠ»ΠΈ ΠΊ ΡΡΠ°Π΄ΠΈΡΠΈΠΎΠ½Π½ΡΠΌ ΠΏΠ°Π½Π΅Π»ΡΠΌ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°Ρ , ΠΊΠ°ΠΊ ΡΡΠ°, ΠΈ ΠΎΠ½ΠΈ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΠ°ΠΊ Ρ ΠΎΡΠΎΡΠΎ β ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΠΈ Π·Π½Π°ΠΊΠΎΠΌΡ Ρ ΡΡΠΈΠΌ ΡΡΠΈΠ»Π΅ΠΌ, ΠΈ ΠΈΡ Π»Π΅Π³ΠΊΠΎ ΠΏΠΎΠ½ΡΡΡ.
ΠΠ΄Π΅ΡΡ Π½Π° ΠΏΠΎΠΌΠΎΡΡ ΠΏΡΠΈΡ
ΠΎΠ΄ΠΈΡ JavaScript, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΠΌΠ΅Π½Ρ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΌ ΠΈ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΡΠΌ. ΠΠ΅Π½Ρ JavaScript ΠΏΡΠ΅ΠΊΡΠ°ΡΠ½ΠΎ ΠΏΠΎΠ΄Ρ
ΠΎΠ΄ΡΡ Π΄Π»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΠΎΡΡΡ ΠΌΠ΅Π½Ρ ΠΈ ΡΠ΄Π΅Π»Π°ΡΡ Π΅Π³ΠΎ Π±ΠΎΠ»Π΅Π΅ Π·Π°ΠΌΠ΅ΡΠ½ΡΠΌ.
JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π·Π΄Π΅ΡΡ Π΄Π»Ρ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ CSS, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ ΠΌΠ΅Π½Ρ JavaScript Π±ΠΎΠ»Π΅Π΅ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΡΠΌ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΠ»ΠΈ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ Π±ΠΎΠΊΠΎΠ²ΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π±ΠΎΠ»Π΅Π΅ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠΉ ΠΈ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΠΎΠΉ, ΡΡΠΎΡ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΠΏΠΎΠ΄ΠΎΠΉΠ΄Π΅Ρ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ.
ΠΠ°Π²Π΅Π΄ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ ΠΌΡΡΠΈ ΠΈ Π½Π°ΠΆΠΌΠΈΡΠ΅ Π½Π° ΡΡΡΠ»ΠΊΠΈ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅, ΠΊΠ°ΠΊ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ, Π²ΡΠ΅ ΠΎΠ½ΠΈ ΠΏΠ»Π°Π²Π½ΡΠ΅ ΠΈ Π°Π΄Π°ΠΏΡΠΈΡΠΎΠ²Π°Π½Ρ ΠΊ ΡΠ°ΠΌΠΎΠΉ ΠΈΠΊΠΎΠ½ΠΊΠ΅.
JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ, ΡΡΠΎΠ±Ρ ΡΠ²ΡΠ·Π°ΡΡ Π²ΡΠ΅ Π²ΠΎΠ΅Π΄ΠΈΠ½ΠΎ ΠΈ ΡΠ»ΡΡΡΠΈΡΡ ΡΡΠΈΠ»Ρ CSS, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ Π΅Π³ΠΎ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ½ΡΠΌ ΠΈ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΌ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΡΠΎΠΊΠΎΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΠ΅Π»ΡΠ½Π°Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ ΡΠΎ ΡΠΊΠΎΡΠΎΡΡΡΡ 60 ΠΊΠ°Π΄ΡΠΎΠ² Π² ΡΠ΅ΠΊΡΠ½Π΄Ρ, ΠΊΠΎΠ³Π΄Π° ΠΌΠ΅Π½Ρ ΠΏΡΠ΅Π²ΡΠ°ΡΠ°Π΅ΡΡΡ Π² ΠΏΠΎΠ»Π½ΠΎΡΠΊΡΠ°Π½Π½ΠΎΠ΅ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ.
ΠΡΠ΅ ΡΡΡΠ»ΠΊΠΈ ΠΌΠ΅Π½Ρ ΠΈΠΌΠ΅ΡΡ ΡΠΎΠ½ΠΊΠΈΠΉ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΡΡΡΠ΅ΠΊΡ ΠΏΡΠΈ ΠΎΡΠΊΡΡΡΠΈΠΈ ΠΈ Π·Π°ΠΊΡΡΡΠΈΠΈ ΠΌΠ΅Π½Ρ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠ΅Π½Ρ Π² ΡΡΠΈΠ»Π΅ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ°, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²ΡΠ΄Π²ΠΈΠ³Π°Π΅ΡΡΡ ΠΈ ΡΠ°ΡΡΠΈΡΡΠ΅ΡΡΡ Π΄ΠΎ Π·Π½Π°ΡΠΊΠΎΠ², Π½Π° ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΆΠΈΠΌΠ°ΡΡ. ΠΠ³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΊΠ°ΠΊ ΠΎΡΠ»ΠΈΡΠ½ΠΎΠ΅ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΈΠ»ΠΈ ΠΊΠ°ΠΊ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π½Π°ΡΡΡΠΎΠ΅ΠΊ.
ΠΡΠ»ΠΈ Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ»Π°ΠΉΠ΄-ΠΌΠ΅Π½Ρ, Π²Π°ΠΌ ΠΏΠΎΠ½ΡΠ°Π²ΠΈΡΡΡ Π½Π°ΡΠ° ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ ΡΠ»Π°ΠΉΠ΄-ΠΌΠ΅Π½Ρ!
ΠΠ·ΠΌΠ΅Π½ΠΈΡΠ΅ ΡΠ²Π΅ΡΠ° ΠΈ Π·Π½Π°ΡΠΊΠΈ, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΡΡΠΎ ΠΌΠ΅Π½Ρ JavaScript ΡΠ²ΠΎΠΈΠΌ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΌ ΠΈ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°ΡΡ ΡΡΠΈΠ»Ρ ΠΈ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡΠ°Π»ΡΠ½ΠΎΡΡΠΈ Π²Π°ΡΠ΅Π³ΠΎ Π±ΡΠ΅Π½Π΄Π°.
JavaScript Π² ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π°ΠΊΡΠΈΠ²Π°ΡΠΈΠΈ ΡΡΠΈΠ»Π΅ΠΉ CSS ΠΈ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠ°Π·ΠΎΠ²ΠΎΠ΅ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ JavaScript , ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ ΠΏΡΠΈ ΡΠ΅Π»ΡΠΊΠ΅ ΠΏΡΠ°Π²ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΎΠΉ ΠΌΡΡΠΈ Π² Π»ΡΠ±ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ.
Π‘ΡΠΈΠ»Ρ ΠΎΡΠ΅Π½Ρ ΠΏΡΠΎΡΡΠΎΠΉ, ΠΏΠΎΡΡΠΎΠΌΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π°ΡΡΡΠΎΠΈΡΡ Π΅Π³ΠΎ ΠΏΠΎΠ΄ ΡΠ²ΠΎΠΈ Π½ΡΠΆΠ΄Ρ.
ΠΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΠ°ΠΊΠΎΠ³ΠΎ ΠΏΡΠΎΡΡΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Ρ Π² ΡΠΎΠΌ, ΡΡΠΎ ΠΎΠ½ΠΎ ΠΊΠ°ΠΆΠ΅ΡΡΡ ΠΎΡΠ΅Π½Ρ Π΅ΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΠΌ. ΠΠ°ΠΊ Π΅ΡΠ»ΠΈ Π±Ρ ΡΡΠΎ Π±ΡΠ»ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΠΏΠΎΡΡΡΠΏΠ°ΡΡΠ΅Π΅ ΠΏΡΡΠΌΠΎ ΠΈΠ· Π±ΡΠ°ΡΠ·Π΅ΡΠ°.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΎΠ½Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ½ΡΠ΅Π³ΡΠΈΡΠΎΠ²Π°ΡΡ Π² ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°, ΠΈΠΌΠ΅Π΅Ρ ΠΎΡΠ΅Π½Ρ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»ΠΈΡΡΠΈΡΠ½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΈ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ Π·Π½Π°ΡΠΊΠΎΠ².
Π’Π΅ΠΊΡΡ Π·Π½Π°ΡΠΊΠ° ΠΏΠ»Π°Π²Π½ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²Ρ Π½Π°ΠΆΠΈΠΌΠ°Π΅ΡΠ΅ Π½Π° ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΌΠ΅Π½Ρ ΠΈ ΠΏΡΠΎΡΠΊΠ°Π»ΡΠ·ΡΠ²Π°Π΅Ρ Π² ΠΏΠΎΠ»Π΅ Π·ΡΠ΅Π½ΠΈΡ.
JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π±ΠΎΠ»Π΅Π΅ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ½ΠΎΠΉ Π°ΠΊΡΠΈΠ²Π°ΡΠΈΠΈ ΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ CSS ΠΏΡΠΈ ΠΊΠ»ΠΈΠΊΠ°Ρ .
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ
Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΠ»ΠΈ Π²Ρ ΠΈΡΠ΅ΡΠ΅ ΠΌΠ΅Π½Ρ JavaScript, ΠΎΡΠΈΠ΅Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ ΡΠΎΠ»ΡΠΊΠΎ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΡΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½, ΡΡΠΎ Π΄Π»Ρ Π²Π°Ρ.
Π Π½Π΅ΠΌ Π΅ΡΡΡ ΠΌΠ°ΠΊΠ΅Ρ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, Π½ΠΎ ΠΌΠ΅Π½Ρ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½ΠΈΡΡΠ΅Ρ. ΠΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Π½Π° ΠΌΠ΅Π½Ρ Π³Π°ΠΌΠ±ΡΡΠ³Π΅ΡΠ° ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ.
ΠΠ½ΠΈΠΌΠ°ΡΠΈΡ ΡΠΎΠ½ΠΊΠ°Ρ ΠΈ ΠΏΠ»Π°Π²Π½Π°Ρ, Π° ΠΌΠ΅Π½Ρ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ Π²Π΅ΡΡ ΡΠΊΡΠ°Π½ ΠΈ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π»Π΅Π³ΠΊΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΎ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΎΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΠΎΠ±ΡΡΠ½ΡΠ΅ HTML-ΡΡΡΠ»ΠΊΠΈ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠΎΠ»Π½ΠΎΡΡΡΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π½Π° Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ. ΠΡΠΎΡ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠ΅Π½Ρ Ρ ΠΎΡΠΎΡ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΎΡΠΏΡΠ°Π²Π½ΠΎΠΉ ΡΠΎΡΠΊΠΈ Π΄Π»Ρ ΡΠ²ΠΎΠ΅Π³ΠΎ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π³ΠΎ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
Π ΠΌΠ΅Π½Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΡΡΠ΄Π»ΠΈΠ²ΡΡ Π·Π½Π°ΡΠΊΠΎΠ² ΠΈ ΠΏΠ»Π°Π²Π½Π°Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠΊΠΎΠ»ΡΠ·ΠΈΡ Π²Π½ΠΈΠ· ΠΏΠΎ ΠΏΡΠ½ΠΊΡΠ°ΠΌ ΠΌΠ΅Π½Ρ, ΡΡΠΎΠ±Ρ ΡΠ°ΡΡΠΈΡΠΈΡΡ Π΅Π³ΠΎ.
JavaScript ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΈ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ ΠΏΡΠΈ Π²Π·Π°ΠΈΠΌΠΎΠ΄Π΅ΠΉΡΡΠ²ΠΈΠΈ Ρ ΠΌΠ΅Π½Ρ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΎΠ½ ΠΏΠΎΠ²ΡΡΠ°Π΅Ρ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΡΡΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠΎΠ³ΠΎ, Π½Π° ΡΡΠΎ ΡΠ΅Π»ΠΊΠ°Π΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ, ΠΈ Π΄ΠΈΠ½Π°ΠΌΠΈΡΠ΅ΡΠΊΠΈΡ
ΠΊΠ»Π°ΡΡΠΎΠ² CSS.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΡΠΈΠΌΠ΅Ρ, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΡΠ΅Π·Π²ΡΡΠ°ΠΉΠ½ΠΎ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠΌ ΠΈ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠ΅ΠΌ, ΡΡΠΎ Π²Ρ ΠΈΡΠ΅ΡΠ΅, ΠΎΡΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΡΠΌ ΠΈ ΠΊΡΠ΅Π°ΡΠΈΠ²Π½ΡΠΌ — ΠΎΠ½ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ΄Π΅Π»Π°ΡΡ Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ JavaScript.
ΠΡΡΠ³Π»ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎΠΌ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΉ ΠΈ ΡΡΡΠ΅ΠΊΡΠΎΠ². ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°Π²Π΅ΡΡΠΈ ΠΊΡΡΡΠΎΡ Π½Π° ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΠΌΠ΅Π½ΡΡΠΈΠ΅ ΠΊΡΡΠ³ΠΈ, ΡΡΠΎΠ±Ρ ΠΏΡΠΎΡΠΌΠΎΡΡΠ΅ΡΡ ΠΈΡ , ΠΈ ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ ΠΎΠ½ΠΈ Π±ΡΠ΄ΡΡ ΡΡΠΈΡΠ°ΡΡΡΡ Π²ΡΠ±ΡΠ°Π½Π½ΡΠΌΠΈ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠΎΠ»Π½ΠΎΡΡΡΡ ΡΡΠ½ΠΊΡΠΈΠΎΠ½ΠΈΡΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Ρ Π°ΠΊΡΠ΅Π½ΡΠΎΠΌ Π½Π° ΠΌΠ΅Π½Ρ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Π·Π°ΡΠ²ΠΎΡΠ°, Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΡΠΌΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ½Π° ΠΈ ΡΠ΅ΠΊΡΡΠΎΠΌ, ΡΠΊΠ°Π·ΡΠ²Π°ΡΡΠΈΠΌ, ΠΊ ΠΊΠ°ΠΊΠΎΠΉ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈ ΠΏΡΠ½ΠΊΡΠΎΠ² ΠΌΠ΅Π½Ρ ΠΎΠ½ ΠΎΡΠ½ΠΎΡΠΈΡΡΡ.
ΠΠ°Π²Π΅Π΄ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ ΠΌΡΡΠΈ Π½Π° ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΡΡΠΎΠ±Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΈ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΡΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ, ΡΠ΅Π»ΠΊΠ½ΡΠ² ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, Π²Ρ ΠΏΠ΅ΡΠ΅ΠΉΠ΄Π΅ΡΠ΅ Π½Π° ΡΡΡ ΡΡΡΠ°Π½ΠΈΡΡ.
Π ΡΡΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π΄Π°ΠΆΠ΅ Π΅ΡΡΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΠ΅ ΠΌΠΎΠ±ΠΈΠ»ΡΠ½ΠΎΠ΅ Π³Π°ΠΌΠ±ΡΡΠ³Π΅Ρ-ΠΌΠ΅Π½Ρ.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠΎΡ Π΅ΡΠ΅ ΠΎΠ΄Π½ΠΎ ΠΊΡΠ°ΡΠΈΠ²ΠΎΠ΅ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ HTML, CSS ΠΈ JavaScript.
Π ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΠΊΡΠ°ΡΠΈΠ²ΠΎ, ΡΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ ΠΈ Ρ Π·Π°ΠΊΡΡΠ³Π»Π΅Π½Π½ΡΠΌΠΈ ΡΠ³Π»Π°ΠΌΠΈ. ΠΡΠΎ Π΄Π°ΠΆΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π·Π½Π°ΡΠΊΠΈ!
ΠΠ»Π°Π³ΠΎΠ΄Π°ΡΡ JavaScript ΡΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΡΡΠ»Π΅ΠΆΠΈΠ²Π°ΡΡ ΡΠΎΠ±ΡΡΠΈΡ ΠΊΠ»ΠΈΠΊΠΎΠ², ΡΠ΄Π΅Π»Π°Π½Π½ΡΠ΅ Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ· Π΅Π³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π΅Π³ΠΎ ΠΈΠ΄Π΅Π°Π»ΡΠ½ΡΠΌ Π΄Π»Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ Π½Π΅ΠΌΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΡΡΠ½ΠΊΡΠΈΠΉ.
ΠΡΠΎΠ²Π΅ΡΡΡΠ΅ ΡΡΠΎ ΡΠ°ΠΌΠΈ, Π½Π°ΠΆΠ°Π² Π½Π° ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅, ΠΊΠ°ΠΊ Π·Π°ΠΏΡΡΠΊΠ°ΡΡΡΡ ΠΎΠ±ΡΠ°ΡΠ½ΡΠ΅ Π²ΡΠ·ΠΎΠ²Ρ JavaScript.
Π‘ΠΌ. ΠΏΠ΅ΡΠΎ Π½Π° ΠΠΎΠ΄ΠΠ΅Π½Π΅.
ΠΡΠΊΡΡΡΡ CodePen
ΠΠ°Π²Π΅Π΄ΠΈΡΠ΅ ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ ΠΌΡΡΠΈ Π½Π° ΠΏΡΠ½ΠΊΡΡ ΠΌΠ΅Π½Ρ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅, ΠΊΠ°ΠΊ Π·Π½Π°ΡΠΎΠΊ ΠΈΠ½Π΄ΠΈΠΊΠ°ΡΠΎΡΠ° ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΠΌΠ΅ΠΆΠ΄Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΡΡΡΠ»ΠΊΠΎΠΉ β Π²ΡΠ΅ ΡΠΏΡΠ°Π²Π»ΡΠ΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ JavaScript.
