ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ Π³ΠΈΡ Π² Ρ ΡΠΌΠ»
ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ GIF Π² HTML-ΠΏΠΈΡΡΠΌΠΎ
ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ Π³ΠΈΡΠΊΠΈ ΡΠΈΡΠΎΠΊΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ Π² email-ΠΌΠ°ΡΠΊΠ΅ΡΠΈΠ½Π³Π΅, Π° ΠΈΡ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²Π° ΠΎΡΠ΅Π²ΠΈΠ΄Π½Ρ. ΠΠΎ-ΠΏΠ΅ΡΠ²ΡΡ , ΠΎΠ½ΠΈ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Π²ΡΠ·ΡΠ²Π°ΡΡ ΠΈΠ½ΡΠ΅ΡΠ΅Ρ, ΠΈ ΠΏΠΎΠΌΠΎΠ³Π°ΡΡ Π½Π°Π»Π°Π΄ΠΈΡΡ ΡΠΌΠΎΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΡ ΡΠ²ΡΠ·Ρ Ρ Π°ΡΠ΄ΠΈΡΠΎΡΠΈΠ΅ΠΉ. ΠΠΎ-Π²ΡΠΎΡΡΡ , Π³ΠΈΡΠΊΠΈ β ΡΡΠΎ ΠΎΡΠ»ΠΈΡΠ½ΡΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΠΈΠ·ΡΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ ΠΈ ΡΠ°Π·Π±Π°Π²ΠΈΡΡ ΡΡΡ ΠΎΠΉ ΡΠ΅ΠΊΡΡ ΠΊΠ°ΠΏΠ»Π΅ΠΉ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π°. Π‘ ΠΈΡ ΠΏΠΎΠΌΠΎΡΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΠ±ΡΡΡΠ½ΠΈΡΡ ΡΠ»ΠΎΠΆΠ½ΡΠ΅ Π²Π΅ΡΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π²Π°ΠΌ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΡΠΎΠ΄Π΅ΠΌΠΎΠ½ΡΡΡΠΈΡΠΎΠ²Π°ΡΡ Π½ΠΎΠ²ΡΠΉ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ.
ΠΠΎΠΌΠΈΠΌΠΎ ΡΡΠΎΠ³ΠΎ, Π³ΠΈΡΠΊΠΈ ΡΠ²Π»ΡΡΡΡΡ ΠΎΡΠ»ΠΈΡΠ½ΠΎΠΉ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²ΠΎΠΉ Π²ΠΈΠ΄Π΅ΠΎ. ΠΠΎ ΡΡΠ°Π²Π½Π΅Π½ΠΈΡ Ρ Π²ΠΈΠ΄Π΅ΠΎ Π³ΠΈΡΠΊΠΈ Π·Π°Π½ΠΈΠΌΠ°ΡΡ Π·Π°Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΌΠ΅Π½ΡΡΠ΅ ΠΌΠ΅ΡΡΠ° Π½Π° ΡΡΡΡΠΎΠΉΡΡΠ²Π΅ ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»Ρ. Π£Π²Ρ, Π½Π΅ ΠΊΠ°ΠΆΠ΄ΡΠΉ Π΅ΠΌΠ΅ΠΉΠ» ΠΊΠ»ΠΈΠ΅Π½Ρ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅ Π²ΠΈΠ΄Π΅ΠΎ, Π² ΡΠΎ Π²ΡΠ΅ΠΌΡ ΠΊΠ°ΠΊ Π³ΠΈΡΠΊΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎ Π² Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ ΠΈ Π½Π° Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²Π΅ ΡΡΡΡΠΎΠΉΡΡΠ².
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅: ΡΠ°ΠΊΠΈΠ΅ ΠΏΠΎΡΡΠΎΠ²ΡΠ΅ ΠΊΠ»ΠΈΠ΅Π½ΡΡ ΠΊΠ°ΠΊ Outlook (2007-2016) ΠΈ Windows Phone 7 ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΠ΅ΡΠ²ΡΠΉ ΠΊΠ°Π΄Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ. ΠΠ΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ ΠΎΠ± ΡΡΠΎΠΌ, ΠΊΠΎΠ³Π΄Π° Π±ΡΠ΄Π΅ΡΠ΅ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π³ΠΈΡΠΊΡ, ΠΈ Π²ΡΠ±Π΅ΡΠΈΡΠ΅ ΡΠ΅Π»Π΅Π²Π°Π½ΡΠ½ΡΠΉ ΠΊΠ°Π΄Ρ Π΄Π»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, Π²Π°ΡΠΈ ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»ΠΈ Π½Π΅ ΡΠΏΡΡΡΡΡ ΠΎΡΠ½ΠΎΠ²Π½ΡΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΈ ΠΏΠΎΠΉΠΌΡΡ, ΡΡΠΎ ΠΎΠ½ΠΈ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠ΄Π΅Π»Π°ΡΡ. ΠΡ ΡΠΎΠ²Π΅ΡΡΠ΅ΠΌ Π²ΡΠ±ΡΠ°ΡΡ ΡΠ°ΠΌΡΡ Π²Π°ΠΆΠ½ΡΡ ΡΠ°ΡΡΡ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΠΊΠ°Π΄ΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΠΈΠ·ΡΠ² ΠΊ Π΄Π΅ΠΉΡΡΠ²ΠΈΡ (CTA).
ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ Π³ΠΈΡΠΊΠΈ Π² HTML-ΠΏΠΈΡΡΠΌΠΎ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΡ ΠΎΠΆΠ΅ Π½Π° Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠΎΡ, ΠΊΠ°ΠΊ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΠΎ ΡΠ΄Π΅Π»Π°ΡΡ:
Π¨Π°Π³ 1. ΠΡΠΈΠ³ΠΎΡΠΎΠ²ΡΡΠ΅ Π³ΠΈΡΠΊΡ, ΠΊΠΎΡΠΎΡΡΡ Π²Ρ Ρ ΠΎΡΠ΅Π»ΠΈ Π±Ρ ΠΎΡΠΏΡΠ°Π²ΠΈΡΡ ΡΠ²ΠΎΠΈΠΌ ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»ΡΠΌ.
ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΉΡΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π³ΠΈΡΠΊΠΈ Π½Π° Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΡΠ΅ΡΡΡΡΠ°Ρ Π»ΠΈΠ±ΠΎ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠ²ΠΎΡ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Adobe Photoshop, Giphy, PhotoScape ΠΈΠ»ΠΈ Π»ΡΠ±ΠΎΠΉ Π΄ΡΡΠ³ΠΎΠΉ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠΉ ΡΠ΅ΡΠ²ΠΈΡ.
Π¨Π°Π³ 2. Π£Π±Π΅Π΄ΠΈΡΠ΅ΡΡ, ΡΡΠΎ Π³ΠΈΡΠΊΠ° ΠΎΠΏΡΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π°.
ΠΠΈΡΠΊΠΈ ΠΌΠΎΠ³ΡΡ ΠΎΡΠ΅Π½Ρ Π΄ΠΎΠ»Π³ΠΎ Π³ΡΡΠ·ΠΈΡΡΡΡ ΠΈΠ·-Π·Π° ΡΠ²ΠΎΠ΅Π³ΠΎ Π±ΠΎΠ»ΡΡΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ°. ΠΡΠΎ ΠΌΠΎΠΆΠ΅Ρ ΡΠ°Π·Π΄ΡΠ°ΠΆΠ°ΡΡ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΌΡ ΡΠΎΠ²Π΅ΡΡΠ΅ΠΌ ΡΠΆΠ°ΡΡ ΡΠ°ΠΉΠ» ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΏΡΠ°Π²ΠΊΠΎΠΉ. Π‘Π°ΠΌΡΠΉ ΠΎΠΏΡΠΈΠΌΠ°Π»ΡΠ½ΡΠΉ ΡΠ°Π·ΠΌΠ΅Ρ Π³ΠΈΡΠΊΠΈ β ΠΎΡ 500 ΠΠ±Π°ΠΉΡ Π΄ΠΎ 1 ΠΠ±Π°ΠΉΡ. Π’Π°ΠΊΠΆΠ΅ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΡΡ ΠΎΠ³ΡΠ°Π½ΠΈΡΠΈΡΡ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΡΠ²Π΅ΡΠΎΠ² ΠΈ ΠΊΠ°Π΄ΡΠΎΠ² ΠΈ Π½Π΅ ΠΏΡΠ΅Π²ΡΡΠ°ΡΡ 600 px Π² ΡΠΈΡΠΈΠ½Ρ. ΠΡΠΎ ΡΡΠ°Π½Π΄Π°ΡΡΠ½Π°Ρ ΡΠΈΡΠΈΠ½Π° HTML-Π΅ΠΌΠ΅ΠΉΠ»Π°.
Π¨Π°Π³ 3. ΠΡΡΠ°Π²ΡΡΠ΅ Π³ΠΈΡΠΊΡ Π² ΠΏΠΈΡΡΠΌΠΎ.
ΠΡΡΠ°Π²ΡΡΠ΅ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ Π² ΠΊΠΎΠ΄ ΡΠ²ΠΎΠ΅Π³ΠΎ HTML-ΠΏΠΈΡΡΠΌΠ°.
ΠΠ»Ρ ΠΎΠ±ΡΠ°ΡΠ΅Π½ΠΈΡ ΠΊ ΠΏΠΎΠ»Π½ΠΎΠΉ ΡΡΡΠ»ΠΊΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΊΠΎΠ΄ HTML Β«img srcΒ»:
Activity β Insert animated GIF to HTML

Π¨Π°Π³ 4. ΠΡΠΎΡΠ΅ΡΡΠΈΡΡΠΉΡΠ΅ HTML-ΠΏΠΈΡΡΠΌΠΎ ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΏΡΠ°Π²ΠΊΠΎΠΉ.
ΠΠ°ΡΠ°Π½Π΅Π΅ ΠΏΡΠΎΠ²Π΅ΡΡΡΠ΅ ΡΠ²ΠΎΠ΅ ΠΏΠΈΡΡΠΌΠΎ ΠΏΠ΅ΡΠ΅Π΄ ΠΎΡΠΏΡΠ°Π²ΠΊΠΎΠΉ. Π£Π±Π΅Π΄ΠΈΡΠ΅ΡΡ, ΡΡΠΎ Π³ΠΈΡΠΊΠ° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ ΠΊΠΎΡΡΠ΅ΠΊΡΠ½ΠΎ, ΠΈ Π½ΠΈ Ρ ΠΊΠΎΠ³ΠΎ ΠΈΠ· Π²Π°ΡΠΈΡ ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅Π»Π΅ΠΉ Π½Π΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ½Π΅Ρ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Ρ Π΅Π΅ ΠΏΡΠΎΡΠΌΠΎΡΡΠΎΠΌ.
Π ΡΠ°ΠΌΠΎΠ΅ Π³Π»Π°Π²Π½ΠΎΠ΅: Π½Π΅ Π·Π»ΠΎΡΠΏΠΎΡΡΠ΅Π±Π»ΡΠΉΡΠ΅ Π³ΠΈΡΠΊΠ°ΠΌΠΈ. ΠΠ΄Π½ΠΎΠΉ ΠΈΠ»ΠΈ Π΄Π²ΡΡ Π² ΠΏΡΠ΅Π΄Π΅Π»Π°Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΠΈΡΡΠΌΠ° Π±ΡΠ΄Π΅Ρ Π²ΠΏΠΎΠ»Π½Π΅ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ. Π ΠΏΡΠΎΡΠΈΠ²Π½ΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΡΡΠΈΡΡ Π²ΠΏΠ΅ΡΠ°ΡΠ»Π΅Π½ΠΈΠ΅ ΠΎ ΡΠ΅Π±Π΅, ΠΊΠ°ΠΊ ΠΎ ΠΏΡΠΎΡΠ΅ΡΡΠΈΠΎΠ½Π°Π»Π΅.
Π Π°Π±ΠΎΡΠ° Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°ΠΌΠΈ Π² HTML ΠΈ CSS
ΠΡΠΎΡ ΡΡΠΎΠΊ ΠΏΠΎΡΠ²ΡΡΠ΅Π½ ΡΠ΅ΠΌΠ΅ ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML ΠΈ ΠΊΠ°ΠΊΠΈΠ΅ ΡΡΠΈΠ»ΠΈ CSS Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΡΠ°ΡΡΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΠ΄Π΅ΡΡ ΠΌΡ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π²ΡΠ΅ ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅ Π²ΠΎΠΏΡΠΎΡΡ ΠΊΠ°ΡΠ°Π΅ΠΌΠΎ Π²ΡΡΠ°Π²ΠΊΠΈ ΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² Π²Π΅Π±-Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ΅. Π ΡΠ°ΠΊΠΆΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΏΡΠΈΡΠΈΠ½Ρ ΠΏΠΎΡΠ΅ΠΌΡ Ρ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΉ Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π² HTML.
Π‘ΠΎΠ΄Π΅ΡΠΆΠ°Π½ΠΈΠ΅:
ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML
ΠΡΡ ΠΎΠ΄Π½ΠΈΠΌ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΌ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΡΠ²Π»ΡΠ΅ΡΡΡ alt. ΠΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π½Π° ΡΠΎΡ ΡΠ»ΡΡΠ°ΠΉ, Π΅ΡΠ»ΠΈ ΠΏΠΎ ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ ΠΏΡΠΈΡΠΈΠ½Π΅, Π±ΡΠ°ΡΠ·Π΅Ρ Π½Π΅ ΡΠΌΠΎΠΆΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ. ΠΡΠΈ Π΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ, Π² ΠΌΠ΅ΡΡΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π½Π° ΡΠΊΡΠ°Π½ Π±ΡΠ΄Π΅Ρ Π²ΡΠ²Π΅Π΄Π΅Π½ ΡΠΊΠ°Π·Π°Π½Π½ΡΠΉ Π²Π°ΠΌΠΈ ΡΠ΅ΠΊΡΡ.
Π’Π°Π±Π»ΠΈΡΠ°. ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°
| ΠΡΡΠΈΠ±ΡΡ | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ | ΠΡΠΈΠΌΠ΅Ρ |
| alt | ΠΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΠΉ ΡΠ΅ΠΊΡΡ Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠΎΡ ΡΠ΅ΠΊΡΡ Π²ΡΠ²ΠΎΠ΄ΠΈΡΡΡ Π² ΠΌΠ΅ΡΡΠ΅ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄ΠΎ Π΅Π³ΠΎ Π·Π°Π³ΡΡΠ·ΠΊΠΈ, ΠΈΠ»ΠΈ Π΅ΡΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π·Π°Π³ΡΡΠΆΠ΅Π½Π° (ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΏΡΠΈ ΠΎΡΠΊΠ»ΡΡΠ΅Π½Π½ΠΎΠΉ Π³ΡΠ°ΡΠΈΠΊΠ΅, ΠΈΠ»ΠΈ ΡΠΊΠ°Π·Π°Π½ Π½Π΅Π²Π΅ΡΠ½ΡΠΉ ΠΏΡΡΡ ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ). | ![]() |
| height | ΠΡΡΠΎΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ (px). ΠΡΠ»ΠΈ Π·Π°Π΄Π°ΡΡ Π²ΡΡΠΎΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ ΠΏΡΠΈ ΡΡΠΎΠΌ Π½Π΅ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΡΠΈΡΠΈΠ½Ρ, ΡΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΡΠΆΠ°ΡΠ° ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ. | ![]() |
| src | ΠΠ°Π΄Π°Π΅Ρ ΠΏΡΡΡ ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. | ![]() |
| sizes | ΠΠ°Π΄Π°ΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ (ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄Π»Ρ ΡΠ°Π·Π½ΡΡ
ΠΌΠ°ΠΊΠ΅ΡΠΎΠ² ΡΡΡΠ°Π½ΠΈΡΡ). Π Π°Π±ΠΎΡΠ°Π΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈ Π·Π°Π΄Π°Π½Π½ΠΎΠΌ Π°ΡΡΠΈΠ±ΡΡΠ΅ srcset. ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ Π°ΡΡΠΈΠ±ΡΡΠ° ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ΄Π½Π° ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠΎΠΊ, ΡΠΊΠ°Π·Π°Π½Π½ΡΡ ΡΠ΅ΡΠ΅Π· Π·Π°ΠΏΡΡΡΡ. Π ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π΄ΠΈΠ½ΠΈΡΡ em, ex, ch, rem, vw, vh, vmin, vmax, cm, mm, q, in, pc, pt, px, Π½ΠΎ Π½Π΅ ΠΏΡΠΎΡΠ΅Π½ΡΡ. | sizes=» (max-width: 20em) 30vw, (max-width: 30em) 60vw, (max-width: 40em) 90vw» ΠΠ΄Π΅ΡΡ vw β ΡΡΠΎ ΡΠΈΡΠΈΠ½Π° Π² ΠΏΡΠΎΡΠ΅Π½ΡΠ°Ρ ΠΎΡ ΠΎΠ±Π»Π°ΡΡΠΈ ΠΏΡΠΎΡΠΌΠΎΡΡΠ°. |
| srcset | Π‘ΠΎΠ·Π΄Π°ΡΡ ΡΠΏΠΈΡΠΎΠΊ ΠΈΡΡΠΎΡΠ½ΠΈΠΊΠΎΠ² Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ΄ΡΡ Π²ΡΠ±ΡΠ°Π½Ρ, ΠΈΡΡ ΠΎΠ΄Ρ ΠΈΠ· ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΡ ΡΠΊΡΠ°Π½Π°. ΠΠΎΠΆΠ΅Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π²ΠΌΠ΅ΡΡΠ΅ Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ src, ΠΈΠ»ΠΈ Π²ΠΌΠ΅ΡΡΠΎ Π½Π΅Π³ΠΎ. ΠΠ½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΡΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΠ΄Π½Π° ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΡΠΎΠΊ, ΡΠ°Π·Π΄Π΅Π»Π΅Π½Π½ΡΡ Π·Π°ΠΏΡΡΠΎΠΉ. | |
| width | Π¨ΠΈΡΠΈΠ½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠ»ΠΈ Π·Π°Π΄Π°ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ ΠΏΡΠΈ ΡΡΠΎΠΌ Π½Π΅ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ Π²ΡΡΠΎΡΡ, ΡΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΡΠΆΠ°ΡΠ° ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ. | ![]() |
HTML ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°. ΠΡΠΈΠΌΠ΅ΡΡ
ΠΠ°ΠΊ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML?
ΠΠ°ΠΊ ΡΠΆΠ΅ Π³ΠΎΠ²ΠΎΡΠΈΠ»ΠΎΡΡ, ΡΡΠΎΠ±Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML Π½ΡΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ΅Π³ ΠΈ Π΅Π³ΠΎ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ src ΠΈ alt. Π’Π°ΠΊΠΆΠ΅, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΡΠ΅Π³ β ΡΡΠΎ ΡΡΡΠΎΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΡΠΎ Π΅Π³ΠΎ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΡΡΡ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡ Π²Π½ΡΡΡΠΈ ΠΊΠ°ΠΊΠΎΠ³ΠΎ-Π½ΠΈΠ±ΡΠ΄Ρ Π±Π»ΠΎΡΠ½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ,
ΠΠ°ΠΊ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² HTML?
Π§ΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π°ΡΡΠΈΠ±ΡΡΡ height (Π·Π°Π΄Π°ΡΡ Π²ΡΡΠΎΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ) ΠΈ width (Π·Π°Π΄Π°ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ). ΠΡΠΈ Π°ΡΡΠΈΠ±ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΠΊΠ°ΠΊ Π²ΠΌΠ΅ΡΡΠ΅, ΡΠ°ΠΊ ΠΈ ΠΏΠΎ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΡΡΠΈ.
ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ ΡΠΆΠ°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ, ΡΠΎ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ Π°ΡΡΠΈΠ±ΡΡ (height, ΠΈΠ»ΠΈ width). ΠΡΠ»ΠΈ ΠΆΠ΅ Π½ΡΠΆΠ½ΠΎ ΡΡΡΠΊΠΎ ΠΎΠ±ΠΎΠ·Π½Π°ΡΠΈΡΡ ΠΈ Π²ΡΡΠΎΡΡ, ΠΈ ΡΠΈΡΠΈΠ½Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ, ΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΠΎΠ±Π° Π°ΡΡΠΈΠ±ΡΡΠ° ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎ (height ΠΈ width).
ΠΠ°ΠΊ ΡΠΊΠ°Π·Π°ΡΡ ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² HTML?
ΠΠ΄ΡΠ΅Ρ ΡΡΡΠ»ΠΊΠΈ Π½Π° ΡΠ°ΠΉΠ» ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΠΌ ΠΈ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ.
ΠΠ±ΡΠΎΠ»ΡΡΠ½ΡΠΉ ΠΏΡΡΡ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠΎΡΠ½ΠΎΠ΅ ΠΌΠ΅ΡΡΠΎΠ½Π°Ρ ΠΎΠΆΠ΄Π΅Π½ΠΈΠ΅ ΡΠ°ΠΉΠ»Π°, Π° ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ Β«ΠΎΡΠΏΡΠ°Π²Π½ΠΎΠΉ ΡΠΎΡΠΊΠΈΒ».
ΠΡΠΈΠΌΠ΅ΡΡ:
https://site/img/D-Nik-Webmaster.jpg β ΡΡΠΎ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΠΉ Π°Π΄ΡΠ΅Ρ ΡΠ°ΠΉΠ»Π° D-Nik-Webmaster.jpg ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΏΡΡΡ ΠΊ Π½Π΅ΠΌΡ ΡΠΊΠ°Π·Π°Π½ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ.
/img/D-Nik-Webmaster.jpg β ΡΡΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΏΡΡΡ ΠΎΡ ΠΊΠΎΡΠ½Π΅Π²ΠΎΠ³ΠΎ ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π°. ΠΠ½Π°ΠΊ Β«/Β» Π² ΡΠ°ΠΌΠΎΠΌ Π½Π°ΡΠ°Π»Π΅ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π½Π° ΡΠΎ, ΡΡΠΎ ΡΡΠΎ ΠΊΠΎΡΠ΅Π½Ρ ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π° ΠΈ Π²ΡΡΠ΅ ΠΏΠΎ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ ΠΏΠΎΠ΄Π½ΠΈΠΌΠ°ΡΡΡΡ Π½Π΅Π»ΡΠ·Ρ. ΠΡΠ»ΠΈ ΡΠ°ΠΉΠ» index.html (HTML-Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ) Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π΅ site, ΡΠΎ ΡΡΠΎΡ ΠΊΠ°ΡΠ°Π»ΠΎΠ³ Π±ΡΠ΄Π΅Ρ ΠΊΠΎΡΠ½Π΅Π²ΡΠΌ (Β«ΠΎΡΠΏΡΠ°Π²Π½ΠΎΠΉ ΡΠΎΡΠΊΠΎΠΉΒ»).
../img/D-Nik-Webmaster.jpg β ΡΡΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ ΠΏΡΡΡ ΠΎΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°. ΠΠ²Π΅ ΡΠΎΡΠΊΠΈ Π² ΡΠ°ΠΌΠΎΠΌ Π½Π°ΡΠ°Π»Π΅ ΠΎΠ·Π½Π°ΡΠ°ΡΡ, ΡΡΠΎ Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΏΠΎΠ΄Π½ΡΡΡΡΡ Π½Π° ΠΎΠ΄ΠΈΠ½ ΠΊΠ°ΡΠ°Π»ΠΎΠ³ Π²Π²Π΅ΡΡ . Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, Π΅ΡΠ»ΠΈ ΡΠΌΠΎΡΡΠ΅ΡΡ Π½Π° Π½Π°Ρ ΠΏΡΠΈΠΌΠ΅Ρ, ΡΠΎ Π½ΡΠΆΠ½ΠΎ ΠΏΠΎΠ΄Π½ΡΡΡΡΡ Π½Π° 1 Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ Π²Π²Π΅ΡΡ , Π½Π°ΠΉΡΠΈ ΡΠ°ΠΌ ΠΏΠ°ΠΏΠΊΡ img, Π° Π² Π½Π΅ΠΉ Π½Π°ΠΉΡΠΈ ΡΠ°ΠΉΠ» D-Nik-Webmaster.jpg.
../../D-Nik-Webmaster.jpg β ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ, Π½ΠΎ ΡΠΎΠ»ΡΠΊΠΎ Ρ ΠΏΠΎΠ΄Π½ΡΡΠΈΠ΅ΠΌ Π½Π° 2 Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ Π²Π²Π΅ΡΡ .
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΡΡΡΠ»ΠΊΠΎΠΉ Π² HTML
ΠΠ°ΡΡΠΈΠ½ΠΊΠ° CSS. ΠΡΠΈΠΌΠ΅ΡΡ
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ CSS (ΠΊΠ°ΡΠΊΠ°Π΄Π½ΡΡ ΡΠ°Π±Π»ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ) Π΄Π°ΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π±ΠΎΠ»Π΅Π΅ Π³ΠΈΠ±ΠΊΠΎ, Π±ΠΎΠ»Π΅Π΅ ΡΠ΄ΠΎΠ±Π½ΠΎ ΠΈ ΡΡΡΠ΅ΠΊΡΠΈΠ²Π½ΠΎ, Π½Π°ΡΡΡΠ°ΠΈΠ²Π°ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅. ΠΠΎΡΡΠΎΠΌΡ Π΄Π°ΠΆΠ΅ Π΄Π»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ Π·Π°Π΄Π°ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΈ Π²ΡΡΠΎΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ Π²Π΅Π±-ΠΌΠ°ΡΡΠ΅ΡΠ° ΡΠ°ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΠΈΠΌΠ΅Π½Π½ΠΎ ΠΊΠ°ΡΠΊΠ°Π΄Π½ΡΠ΅ ΡΠ°Π±Π»ΠΈΡΡ ΡΡΠΈΠ»Π΅ΠΉ.
ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°ΠΌΡΡ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΠ½Π½ΡΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS.
ΠΠ°ΠΊ ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ Π½Π° ΡΠΎΠ½ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML?
Π§ΡΠΎΠ±Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ½Π° Π½ΡΠΆΠ½ΠΎ Π·Π°Π΄Π°ΡΡ ΡΠ΅Π»Π΅ΠΊΡΠΎΡΡ body ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ background, ΠΈΠ»ΠΈ background-image.
ΠΠ°ΠΊ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² CSS
Π§ΡΠΎΠ±Ρ Π·Π°Π΄Π°ΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² CSS Π½ΡΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° width (ΡΠΈΡΠΈΠ½Π°) ΠΈ height (Π²ΡΡΠΎΡΠ°). ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΠΈΡΠΈΠ½Π° ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π±ΡΠ΄Π΅Ρ ΡΠ°Π²Π½Π° 350px, Π° Π²ΡΡΠΎΡΠ° ΡΠΌΠ΅Π½ΡΡΠΈΡΡΡ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ. ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΈ Π²ΡΡΠΎΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ, ΡΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ height (ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, height:350px).
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π°Π΄Π°ΠΏΡΠΈΠ²Π½ΠΎΠΉ
ΠΠ΄Π°ΠΏΡΠΈΠ²Π½ΠΎΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ β ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π½Π° ΡΠ°Π·Π½ΡΡ ΡΠΈΠΏΠ°Ρ ΡΡΡΡΠΎΠΉΡΡΠ² Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠΌΠΈ Ρ Π°ΡΠ°ΠΊΡΠ΅ΡΠΈΡΡΠΈΠΊΠ°ΠΌΠΈ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π° ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ°Ρ Ρ ΡΠ°Π·Π½ΡΠΌ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ ΡΠΊΡΠ°Π½Π° ΠΌΠΎΠ½ΠΈΡΠΎΡΠ°, Π½ΠΎΡΡΠ±ΡΠΊΠ°Ρ Ρ ΡΠ°Π·Π½ΡΠΌ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ Π΄ΠΈΡΠΏΠ»Π΅Ρ, ΠΏΠ»Π°Π½ΡΠ΅ΡΠ°Ρ , ΡΠ΅Π»Π΅ΡΠΎΠ½Π°Ρ ΠΈ Ρ.Π΄.
Π‘Π°ΠΌΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠ΄Π΅Π»Π°ΡΡ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π½Π° Π²ΡΠ΅Ρ ΡΡΡΡΠΎΠΉΡΡΠ²Π°Ρ β ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΏΡΠ°Π²ΠΈΠ»Π°:
ΠΠ°ΠΊ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ΅ΠΊΡΡ Π½Π° ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅
ΠΠ°ΠΊ Π²ΡΡΠΎΠ²Π½ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ
Π‘ΠΏΠΎΡΠΎΠ± β1
Π‘Π°ΠΌΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΡΡΠΎΠ²Π½ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ β ΡΡΠΎ ΠΏΡΠΈΡΠ²ΠΎΠΈΡΡ Π΅ΠΉ ΠΊΠ»Π°ΡΡ, ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π±Π»ΠΎΠΊΠΎΠΌ ΠΈ Π·Π°Π΄Π°ΡΡ Π΅ΠΉ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ Ρ ΠΏΡΠ°Π²ΠΎΠΉ ΠΈ Π»Π΅Π²ΠΎΠΉ ΡΠ°ΡΡΠΈ.
Π‘ΠΏΠΎΡΠΎΠ± β2
ΠΠΎΠΌΠ΅ΡΠ°Π΅ΠΌ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² Π±Π»ΠΎΠΊ
, ΠΏΡΠΈΡΠ²Π°ΠΈΠ²Π°Π΅ΠΌ ΠΊΠ»Π°ΡΡ ΡΡΠΎΠΌΡ Π±Π»ΠΎΠΊΡ (ΠΈΠ»ΠΈ ΠΏΠ°ΡΠ°Π³ΡΠ°ΡΡ), ΠΈ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΏΠΎ ΡΠ΅Π½ΡΡΡ.
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΎΠ±ΡΠ΅ΠΊΠ°Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΡΠ΅ΠΊΡΡΠΎΠΌ
ΠΡΡΠΎΠ²Π½ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ, ΠΈΠ»ΠΈ ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ (ΠΈΠ»ΠΈ ΠΊΠ°ΠΊΠΎΠ³ΠΎ-Π½ΠΈΠ±ΡΠ΄Ρ Π±Π»ΠΎΠΊΠ°, ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°) ΠΌΠΎΠΆΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° float.
Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΠΎΠ±ΡΠ΅ΠΊΠ°Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΡΠ΅ΠΊΡΡΠΎΠΌ ΡΠ»Π΅Π²Π° ΠΈΠ»ΠΈ ΡΠΏΡΠ°Π²Π° Π½ΡΠΆΠ½ΠΎ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΏΡΠ°Π²ΠΈΠ»Π°:
ΠΠ°ΠΊ Π²ΡΡΡΡΠΎΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² ΡΡΠ΄
Π§ΡΠΎΠ±Ρ Π²ΡΡΡΡΠΎΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ Π² ΠΎΠ΄ΠΈΠ½ ΡΡΠ΄, Π½ΡΠΆΠ½ΠΎ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ ΠΈΡ Π² Π±Π»ΠΎΠΊ
, ΠΏΡΠΈΡΠ²ΠΎΠΈΡΡ ΠΊΠ»Π°ΡΡ ΡΡΠΎΠΌΡ Π±Π»ΠΎΠΊΡ (ΠΈΠ»ΠΈ ΠΏΠ°ΡΠ°Π³ΡΠ°ΡΡ), ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΏΡΠ°Π²ΠΈΠ»Π°:
ΠΠ΅ΡΡ ΠΊΠΎΠ΄ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ:
ΠΠ°ΠΊ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° Π½Π΅Ρ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°ΡΡ (ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅Ρ), Π²ΡΠ°ΡΠ°ΡΡ, ΡΠ΄Π²ΠΈΠ³Π°ΡΡ, ΠΈΠ»ΠΈ Π½Π°ΠΊΠ»ΠΎΠ½ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° transform. Π Π΄Π»Ρ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠΊΠΎΡΠΎΡΡΠΈ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ transition.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ, ΡΡΠΎΠ±Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°Π»Π°ΡΡ (ΠΈΠ»ΠΈ ΡΠΌΠ΅Π½ΡΡΠ°Π»Π°ΡΡ) ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ Π½Π° Π½Π΅Ρ ΠΊΡΡΡΠΎΡΠ° ΠΌΡΡΠΈ, ΡΠΎ Π½ΡΠΆΠ½ΠΎ ΡΠΎΠ·Π΄Π°ΡΡ ΠΊΠ»Π°ΡΡ, ΠΏΡΠΈΡΠ²ΠΎΠΈΡΡ Π΅Π³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΠΏΡΠ°Π²ΠΈΠ»Π° CSS:
ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΡΠ²Π΅Π»ΠΈΡΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Π½Π΅ ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°Ρ ΠΏΡΠΈ ΡΡΠΎΠΌ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ, ΡΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π½Π°Π΄ΠΎ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ Π² Π±Π»ΠΎΠΊ
ΠΠΎΡΠ΅ΠΌΡ Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π² HTML?
ΠΡΠΈΡΠΈΠ½ ΠΏΠΎΡΠ΅ΠΌΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ:
ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠΎΠ½ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ Π½Π° ΡΠΈΡΡΡΡ HTML ΠΈ CSS
Π₯ΠΎΡΠ΅ΡΡ Π·Π½Π°ΡΡ Π±ΠΎΠ»ΡΡΠ΅ ΠΏΡΠΎ Π²Π΅Π±?
ΠΠΎΠ΄ΠΏΠΈΡΠΈΡΡ Π½Π° Π½Π°Ρ ΡΠ΅Π»Π΅Π³ΡΠ°ΠΌ-ΠΊΠ°Π½Π°Π» TechRocks WEB-ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠ°?
ΠΠ΅ΡΠ΅Π²ΠΎΠ΄ ΡΡΠ°ΡΡΠΈ Β«Amazing Pure HTML and CSS background animationsΒ».
ΠΠ½ΠΈΠΌΠ°ΡΠΈΠΈ β ΡΡΠΎ ΠΊΡΡΡΠΎ, ΠΏΡΠ°Π²Π΄Π°? ΠΠ½ΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΈΠ·ΡΠΌΠΈΠ½ΠΊΡ Π½Π° ΡΠ°ΠΉΡ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ Π΅ΠΌΡ Π²ΡΠ΄Π΅Π»ΠΈΡΡΡΡ Π½Π° ΡΠΎΠ½Π΅ ΠΊΠΎΠ½ΠΊΡΡΠ΅Π½ΡΠΎΠ². ΠΠΎ Π±ΡΠ²Π°Π΅Ρ, ΡΡΠΎ Π²Ρ ΡΠ΅ΡΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°ΡΡ ΡΠ°ΠΉΡ ΠΈΡΠΊΠ»ΡΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π½Π° HTML ΠΈ CSS, ΠΈ ΡΡΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΎΠ³ΡΠ°Π½ΠΈΡΠΈΠ²Π°Π΅Ρ ΠΏΠΎΠ»Π΅Ρ Π²Π°ΡΠ΅ΠΉ ΡΠ°Π½ΡΠ°Π·ΠΈΠΈ. Π ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎ Π·ΡΡ! ΠΠ°ΠΆΠ΅ Π΅ΡΠ»ΠΈ Ρ Π²Π°Ρ Π² Π½Π°Π±ΠΎΡΠ΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΡΠΈ Π΄Π²Π° ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠ°, Π²Ρ Π²ΡΠ΅ ΡΠ°Π²Π½ΠΎ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΡΡΠΈΠ³Π½ΡΡΡ ΠΏΠΎΡΡΡΡΠ°ΡΡΠΈΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ². Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ Π²Ρ Π½Π°ΠΉΠ΄Π΅ΡΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠ΄Π΅ΠΉ, ΠΎΡ ΠΊΠΎΡΠΎΡΡΡ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΡΡΠ°Π»ΠΊΠΈΠ²Π°ΡΡΡΡ Π² Π΄Π°Π»ΡΠ½Π΅ΠΉΡΠ΅ΠΌ.
ΠΠΈΠ°Π³ΠΎΠ½Π°Π»ΡΠ½ΡΠΉ Π³ΡΠ°Π΄ΠΈΠ΅Π½Ρ
ΠΠ°ΠΏΠΈΡΠ°ΡΡ ΡΠ°ΠΊΠΎΠΉ ΠΊΠΎΠ΄ Π»Π΅Π³ΠΊΠΎ, Π° ΡΡΡΠ΅ΠΊΡ ΠΏΠΎΠ»ΡΡΠ°Π΅ΡΡΡ ΠΎΡΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠΉ.
Π‘ΠΊΠΎΠ»ΡΠΆΠ΅Π½ΠΈΠ΅ Π΄ΠΈΠ°Π³ΠΎΠ½Π°Π»Π΅ΠΉ
ΠΡΠ΅Π΄ΡΠ΄ΡΡΠΈΠΉ ΡΡΡΠ΅ΠΊΡ Π±ΡΠ» ΠΎΡΠ΅Π½Ρ Π½Π΅Π½Π°Π²ΡΠ·ΡΠΈΠ²ΡΠΌ, Π° ΡΡΠΎΡ Π³Π°ΡΠ°Π½ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°Π΅Ρ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅.
ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠΎΠ½
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Π½Π°ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΎΡΡ ΡΠ°ΠΌ Π±ΡΠΊΠ³ΡΠ°ΡΠ½Π΄ ΠΈ Π½Π°ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π΅Π³ΠΎ Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅ Π±Π»Π°Π³ΠΎΠ΄Π°ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
ΠΠ΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΡΠΉ ΠΏΠ°ΡΡΠ΅ΡΠ½
ΠΡΠ΄Π΅Π»ΡΠ½ΠΎΠ΅ ΡΠΏΠ°ΡΠΈΠ±ΠΎ @keyframes Π·Π° Π±Π΅ΡΠΊΠΎΠ½Π΅ΡΠ½ΡΡ ΠΏΡΠΎΠΊΡΡΡΠΊΡ!
ΠΡΠ΅ΠΊΡΠ°ΡΠ½ΡΠΉ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ Π±ΡΠΊΠ³ΡΠ°ΡΠ½Π΄
ΠΡΠΎΡΡΠΎ Π·Π°Π΄Π΅ΡΠΆΠΈΡΠ΅ΡΡ Π½Π° ΠΌΠ³Π½ΠΎΠ²Π΅Π½ΠΈΠ΅ ΠΈ Π½Π°ΡΠ»Π°Π΄ΠΈΡΠ΅ΡΡ ΡΠ΅ΠΌ, Π½Π°ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½Π° ΡΡΠ° Π°Π½ΠΈΠΌΠ°ΡΠΈΡ. Π’Π°ΠΊΠΎΠ΅ ΠΏΡΠΈΡΡΠ½ΠΎΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠ², Π° ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ΅ΠΌ ΠΎΠ½ΠΎ ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎ Π½Π΅ ΠΎΡΠ²Π»Π΅ΠΊΠ°Π΅Ρ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΎΡ Π½Π°Π·Π²Π°Π½ΠΈΡ Π½Π° ΠΏΠ΅ΡΠ΅Π΄Π½Π΅ΠΌ ΠΏΠ»Π°Π½Π΅.
ΠΠ½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ Β«Π»Π΅ΡΠ½ΠΎΠΉΒ» ΡΠΎΠ½
ΠΠ»Π°Π²Π°ΡΡΠΈΠ΅ ΠΊΠ²Π°Π΄ΡΠ°ΡΡ
See the Pen Pure Css Animated Background by Mohammad Abdul Mohaiman (@mohaiman) on CodePen.
Π‘Π½ΠΎΠ²Π° Π΄ΠΈΠ°Π³ΠΎΠ½Π°Π»ΡΠ½ΡΠ΅ Π»ΠΈΠ½ΠΈΠΈ
ΠΠ»ΡΠ²ΡΡΠΈΠ΅ ΠΎΠ±Π»Π°ΠΊΠ°
ΠΠ°, Π² Π½Π°Π·Π²Π°Π½ΠΈΠΈ Π·Π°ΡΠ²Π»Π΅Π½ΠΎ, ΡΡΠΎ Π²ΡΠ΅ Π½Π° ΡΠΈΡΡΠΎΠΌ Π‘SS, Π½ΠΎ ΠΊΠΎΠ³Π΄Π° Ρ ΡΠ²ΠΈΠ΄Π΅Π» ΡΡΠΎΡ ΡΠΎΠ½, Π½Π΅ ΡΠΌΠΎΠ³ Π½Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π΅Π³ΠΎ Π² ΠΊΠΎΠ»Π»Π΅ΠΊΡΠΈΡ, Π½Π΅ΡΠΌΠΎΡΡΡ Π½Π° ΡΠΎ, ΡΡΠΎ Π·Π΄Π΅ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ CSS(Less).
ΠΠ°Π΄Π΅ΡΡΡ, ΡΡΠΈ ΠΈΠ΄Π΅ΠΈ Π²Π΄ΠΎΡ Π½ΠΎΠ²ΡΡ Π²Π°Ρ Π½Π° ΡΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΡ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΡ ΡΡΡΠ΅ΠΊΡΠΎΠ². ΠΠΎΠΈΠ³ΡΠ°ΠΉΡΠ΅ΡΡ Ρ ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΡΠΌΠΈ CodePen-ΠΌΠΈ: Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΈ Ρ Π²Π°Ρ ΡΠΎΠ΄ΠΈΡΡΡ Π·Π°ΠΌΠ΅ΡΠ°ΡΠ΅Π»ΡΠ½Π°Ρ ΠΈΠ΄Π΅Ρ.
ΠΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° WEB-ΡΡΡΠ°Π½ΠΈΡΡ, Π° Π΅ΡΠ΅ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π°ΡΠ΄ΠΈΠΎ!
ΠΠ΄ΡΠ°Π²ΡΡΠ²ΡΠΉΡΠ΅ ΡΠ²Π°ΠΆΠ°Π΅ΠΌΡΠ΅ ΡΠΈΡΠ°ΡΠ΅Π»ΠΈ Π±Π»ΠΎΠ³Π°! Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ Π²Ρ ΡΠ·Π½Π°Π΅ΡΠ΅ Π²ΡΠ΅ ΠΎ ΡΠΎΠΌ ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° html ΡΡΡΠ°Π½ΠΈΡΡ. Π£ Π²Π°Ρ Π΅ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ Π½Π° ΡΠ²ΠΎΡ ΡΡΡΠ°Π½ΠΈΡΠΊΡ ΠΈΠ»ΠΈ Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ Π½Π° ΡΠ²ΠΎΠΉ ΡΠ°ΠΉΡ Π»ΠΎΠ³ΠΎΡΠΈΠΏ? ΠΡΠ΅ ΡΡΠΎ Π»Π΅Π³ΠΊΠΎ. ΠΡΠΎΡΠΈΡΠ°Π² ΡΡΡ ΡΡΠ°ΡΡΡ, Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ Π±Π΅Π· ΠΊΠ°ΠΊΠΈΡ -Π»ΠΈΠ±ΠΎ ΡΡΡΠ΄Π½ΠΎΡΡΠ΅ΠΉ Π²ΡΡΠ°Π²Π»ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π½Π° ΡΠ²ΠΎΠΈ html ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΌΡ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΠΏΠΎΠ³ΠΎΠ²ΠΎΡΠΈΠΌ ΠΎ ΡΠ΅Π³Π΅ img ΠΈ Π΅Π³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°Ρ , ΠΊΡΠ°ΡΠΊΠΎ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΡΠΎΡΠΌΠ°ΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ ΡΠ°ΠΉΠ»ΠΎΠ², ΡΠ°ΠΊΠΈΡ ΠΊΠ°ΠΊ gif, jpeg ΠΈ png, Π° ΡΠ°ΠΊΠΆΠ΅ ΠΏΠΎΡΠΌΠΎΡΡΠΈΠΌ Π½ΠΎΠ²ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ HTML5, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΏΡΠΎΡΠ°ΡΡ Π²ΡΡΠ°Π²ΠΊΡ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π°ΡΠ΄ΠΈΠΎ Π½Π° ΡΠ°ΠΉΡ.
ΠΠ·-Π·Π° ΡΠΎΠ³ΠΎ ΡΡΠΎ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ Π΄Π°Π½Π½ΡΠ΅ ΠΈ ΡΠ΅ΠΊΡΡ html Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΠΈΡΡ Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅, Π΄Π»Ρ ΠΈΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° ΡΠ°ΠΉΡΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π΄ΡΡΠ³ΠΎΠΉ ΠΏΠΎΠ΄Ρ ΠΎΠ΄, Π½Π΅ΠΆΠ΅Π»ΠΈ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ html-ΡΡΡΠ°Π½ΠΈΡ. ΠΡΠ΅ΠΆΠ΄Π΅ Π²ΡΠ΅Π³ΠΎ, Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π΄Π° ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠΉΠ½ΡΠ΅ Π΄Π°Π½Π½ΡΠ΅ Ρ ΡΠ°Π½ΡΡΡΡ Π² ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ ΡΠ°ΠΉΠ»Π°Ρ . Π Π΄Π»Ρ ΠΈΡ Π²Π½Π΅Π΄ΡΠ΅Π½ΠΈΡ Π² web-ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΠ΅ ΡΠ΅Π³ΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΠ΄Π΅ΡΠΆΠ°Ρ ΡΡΡΠ»ΠΊΠΈ Π½Π° ΡΡΠΈ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ ΡΠ°ΠΉΠ»Ρ. Π ΡΠ°ΡΡΠ½ΠΎΡΡΠΈ ΡΠ°ΠΊΠΈΠΌ ΡΠ΅Π³ΠΎΠΌ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ΅Π³ img. ΠΡΡΡΠ΅ΡΠΈΠ² ΡΠ°ΠΊΠΎΠΉ ΡΠ΅Π³ Ρ Π°Π΄ΡΠ΅ΡΠΎΠΌ, Π±ΡΠ°ΡΠ·Π΅Ρ ΡΠ½Π°ΡΠ°Π»Π° Π·Π°ΠΏΡΠ°ΡΠΈΠ²Π°Π΅Ρ Ρ Web-ΡΠ΅ΡΠ²Π΅ΡΠ° ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΉ ΡΠ°ΠΉΠ» Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ, Π°ΡΠ΄ΠΈΠΎ- ΠΈΠ»ΠΈ Π²ΠΈΠ΄Π΅ΠΎΡΠΎΠ»ΠΈΠΊΠΎΠΌ, Π° ΡΠΎΠ»ΡΠΊΠΎ Π·Π°ΡΠ΅ΠΌ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ Π΅Π³ΠΎ Π½Π° Web-ΡΡΡΠ°Π½ΠΈΡΠ΅.
ΠΡΠ΅ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈ Π²ΠΎΠΎΠ±ΡΠ΅ Π»ΡΠ±ΡΠ΅ Π΄Π°Π½Π½ΡΠ΅, ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΡΠ°Π½ΡΡΡΡ Π² ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ ΠΎΡ web-ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ°ΠΉΠ»Π°Ρ Π½Π°Π·ΡΠ²Π°ΡΡΡΡ Π²Π½Π΅Π΄ΡΠ΅Π½Π½ΡΠΌΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ Π²ΡΡΠ°Π²Π»ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΈ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ ΡΠ΅Π³ Β«imgΒ», ΡΡΠΎΠΈΡ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ·Π½Π°ΡΡ ΠΎ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ ΡΠΎΡΠΌΠ°ΡΠ°Ρ .
Π€ΠΎΡΠΌΠ°ΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ.
Π‘ΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ ΡΠΎΡΠΌΠ°ΡΠΎΠ², Π½ΠΎ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°ΡΡ Π»ΠΈΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ. Π Π°ΡΡΠΌΠΎΡΡΠΈΠΌ ΡΡΠΈ ΠΈΠ· Π½ΠΈΡ .
1. Π€ΠΎΡΠΌΠ°Ρ JPEG (Joint Photographic Experts Group). ΠΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΉ ΡΠΎΡΠΌΠ°Ρ, ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΠΌΡΠΉ Π΄Π»Ρ Ρ ΡΠ°Π½Π΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ 24-Π±ΠΈΡΠΎΠ²ΡΠΉ ΡΠ²Π΅Ρ ΠΈ ΡΠΎΡ ΡΠ°Π½ΡΠ΅Ρ Π²ΡΠ΅ ΠΏΠΎΠ»ΡΡΠΎΠ½Π° Π² ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡΡ Π½Π΅ΠΈΠ·ΠΌΠ΅Π½Π½ΡΠΌΠΈ. ΠΠΎ jpeg Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΡ ΠΈ ΠΈΡΠΊΠ°ΠΆΠ°Π΅Ρ ΠΌΠ΅Π»ΠΊΠΈΠ΅ Π΄Π΅ΡΠ°Π»ΠΈ ΠΈ ΡΠ΅ΠΊΡΡ Π² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΡ . JPEG ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π² ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΌ Π΄Π»Ρ Ρ ΡΠ°Π½Π΅Π½ΠΈΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ. Π€Π°ΠΉΠ»Ρ ΡΡΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠ° ΠΈΠΌΠ΅ΡΡ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΡ jpg, jpe, jpeg.
2. Π€ΠΎΡΠΌΠ°Ρ GIF (Graphics Interchange Format). ΠΠ»Π°Π²Π½ΠΎΠ΅ Π΄ΠΎΡΡΠΎΠΈΠ½ΡΡΠ²ΠΎ ΡΡΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠ° Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Ρ ΡΠ°Π½ΠΈΡΡ ΡΡΠ°Π·Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π² ΠΎΠ΄Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅. ΠΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠ΅Π»ΡΠΉ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΠΎΠ»ΠΈΠΊΠΈ. ΠΠΎ-Π²ΡΠΎΡΡΡ ΠΎΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΡ. ΠΠ»Π°Π²Π½ΡΠΉ Π½Π΅Π΄ΠΎΡΡΠ°ΡΠΎΠΊ ΡΡΠΎ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΊΠ° Π²ΡΠ΅Π³ΠΎ Π»ΠΈΡΡ 256-ΡΠ²Π΅ΡΠΎΠ², ΡΡΠΎ Π½ΠΈΠΊΡΠ΄Π° Π½Π΅ Π³ΠΎΠ΄ΠΈΡΡΡ Π΄Π»Ρ Ρ ΡΠ°Π½Π΅Π½ΠΈΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ. GIF Π² ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ Ρ ΡΠ°Π½Π΅Π½ΠΈΡ Π»ΠΎΠ³ΠΎΡΠΈΠΏΠΎΠ², Π±Π°Π½Π½Π΅ΡΠΎΠ², ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΡΠΌΠΈ ΡΡΠ°ΡΡΠΊΠ°ΠΌΠΈ ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΡ ΡΠ΅ΠΊΡΡ. Π€Π°ΠΉΠ»Ρ ΡΡΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠ° ΠΈΠΌΠ΅ΡΡ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ gif.
3. Π€ΠΎΡΠΌΠ°Ρ PNG (Portable Network Graphics). ΠΡΠΎ ΡΠΎΡΠΌΠ°Ρ Π±ΡΠ» ΡΠ°Π·ΡΠ°Π±ΠΎΡΠ°Π½ ΠΊΠ°ΠΊ Π·Π°ΠΌΠ΅Π½Π° ΡΡΡΠ°ΡΠ΅Π²ΡΠ΅ΠΌΡ GIF, Π° ΡΠ°ΠΊΠΆΠ΅, Π² Π½Π΅ΠΊΠΎΡΠΎΡΠΎΠΉ ΡΡΠ΅ΠΏΠ΅Π½ΠΈ, JPEG. ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΡ, Π½ΠΎ Π½Π΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ. ΠΠ°Π½Π½ΡΠΉ ΡΠΎΡΠΌΠ°Ρ ΠΈΠΌΠ΅Π΅Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ png.
ΠΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΡΠ°ΠΉΡΠΎΠ² ΠΎΠ±ΡΡΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² ΡΠΎΡΠΌΠ°ΡΠ΅ JPEG ΠΈΠ»ΠΈ GIF, Π½ΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ PNG. ΠΠ»Π°Π²Π½ΠΎΠ΅ ΡΠ°Π·ΠΎΠ±ΡΠ°ΡΡΡΡ Π² ΠΊΠ°ΠΊΠΈΡ ΡΠ»ΡΡΠ°ΡΡ ΠΊΠ°ΠΊΠΎΠΉ ΡΠΎΡΠΌΠ°Ρ Π»ΡΡΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ. ΠΡΠ»ΠΈ ΠΊΡΠ°ΡΠΊΠΎ, ΡΠΎ:
ΠΡΡΠ°Π²ΠΊΠ° ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ Π² html ΡΡΡΠ°Π½ΠΈΡΡ
ΠΡΠ°ΠΊ, ΠΊΠ°ΠΊ Π²ΡΠ΅ ΡΠ°ΠΊΠΈ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ? ΠΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΎΠ΄ΠΈΠ½Π°ΡΠ½ΡΠΉ ΡΠ΅Π³ img. ΠΡΠ°ΡΠ·Π΅Ρ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² ΡΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, Π³Π΄Π΅ Π²ΡΡΡΠ΅ΡΠΈΡ ΡΠ΅Π³ img.
ΠΠΎΠ΄ Π²ΡΡΠ°Π²ΠΊΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² html ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΠΌΠ΅Π΅Ρ ΡΠ°ΠΊΠΎΠΉ Π²ΠΈΠ΄:
ΠΠ°Π½Π½ΡΠΉ html-ΠΊΠΎΠ΄ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Ρ ΡΠ°Π½ΡΡΠ΅Π΅ΡΡ Π² ΡΠ°ΠΉΠ»Π΅ image.jpg, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΎΠ΄Π½ΠΎΠΉ ΠΈ ΡΠΎΠΉ ΠΆΠ΅ ΠΏΠ°ΠΏΠΊΠ΅ Ρ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ΠΉ. ΠΠ°ΠΊ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ Π·Π°ΠΌΠ΅ΡΠΈΡΡ Π°Π΄ΡΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Π² Π°ΡΡΠΈΠ±ΡΡΠ΅ src. Π§ΡΠΎ ΡΠ°ΠΊΠΎΠ΅ Π°ΡΡΠΈΠ±ΡΡ html-ΡΠ΅Π³Π° Ρ ΡΠΆΠ΅ ΡΠ°ΡΡΠΊΠ°Π·ΡΠ²Π°Π». Π’Π°ΠΊ Π²ΠΎΡ, Π°ΡΡΠΈΠ±ΡΡ src ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ»ΡΠΆΠΈΡ Π΄Π»Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΡ Π°Π΄ΡΠ΅ΡΠ° ΡΠ°ΠΉΠ»Π° Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ. ΠΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΠ° src ΡΠ΅Π³ img Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ ΡΠΌΡΡΠ»Π°.
ΠΡΠΈΠ²Π΅Π΄Ρ Π΅ΡΠ΅ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ² ΡΠΊΠ°Π·Π°Π½ΠΈΡ Π°Π΄ΡΠ΅ΡΠ° ΡΠ°ΠΉΠ»Π° Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ:
ΡΡΠΎΡ html-ΠΊΠΎΠ΄ Π²ΡΡΠ°Π²ΠΈΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Ρ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ image.jpg, ΠΊΠΎΡΠΎΡΠ°Ρ Ρ ΡΠ°Π½ΠΈΡΡΡ Π² ΠΏΠ°ΠΏΠΊΠ΅ images, ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΠΎΠΉ Π² ΠΊΠΎΡΠ½Π΅ Π²Π΅Π±-ΡΠ°ΠΉΡΠ°.
Π Π°ΡΡΠΈΠ±ΡΡΠ΅ src ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. Π’Π°ΠΊ ΠΊΠ°ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ ΡΠ°Π½ΡΡΡΡ Π² ΡΠ΅ΡΠΈ Π²ΠΌΠ΅ΡΡΠ΅ Ρ html-ΡΡΡΠ°Π½ΠΈΡΠ°ΠΌΠΈ, ΠΏΠΎΡΡΠΎΠΌΡ Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π° Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ Π΅ΡΡΡ ΡΠ²ΠΎΠΉ ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΡΠΉ url-Π°Π΄ΡΠ΅Ρ. ΠΠΎΡΡΠΎΠΌΡ Π² Π°ΡΡΠΈΠ±ΡΡ src ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΡΠ°Π²Π»ΡΡΡ url-Π°Π΄ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
ΠΠ°Π½Π½ΡΠΉ ΠΊΠΎΠ΄ Π²ΡΡΠ°Π²ΠΈΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Ρ ΡΠ°ΠΉΡΠ° mysite.ru. URL-aΠ΄pec ΠΎΠ±ΡΡΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ, Π΅ΡΠ»ΠΈ Π²Ρ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΠ΅ Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Π½Π°Ρ ΠΎΠ΄ΡΡΠ΅Π΅ΡΡ Π½Π° Π΄ΡΡΠ³ΠΎΠΌ ΡΠ°ΠΉΡΠ΅. ΠΠ»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Ρ ΡΠ°Π½ΡΡΠΈΡ ΡΡ Π½Π° Π²Π°ΡΠ΅ΠΌ ΡΠ°ΠΉΡΠ΅ Π»ΡΡΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ.
Π’Π΅Π³ img ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΡΡΠΎΡΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ, ΠΏΠΎΡΡΠΎΠΌΡ Π΅Π³ΠΎ Π»ΡΡΡΠ΅ ΠΏΠΎΠΌΠ΅ΡΠ°ΡΡ Π²Π½ΡΡΡΡ Π±Π»ΠΎΡΠ½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ Π²Π½ΡΡΡΡ ΡΠ΅Π³Π° Β«Π Β» β Π°Π±Π·Π°Ρ:
ΠΠ°Π²Π°ΠΉΡΠ΅ ΠΏΠΎΠΏΡΠ°ΠΊΡΠΈΠΊΡΠ΅ΠΌΡΡ ΠΈ Π²ΡΡΠ°Π²ΠΈΠΌ Π½Π° Π½Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΠ· ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΡ ΡΡΠ°ΡΠ΅ΠΉ ΠΎΠ± html ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. Π― ΡΠΎΠ·Π΄Π°ΠΌ ΡΡΠ΄ΠΎΠΌ Ρ html-ΡΠ°ΠΉΠ»ΠΎΠΌ ΡΠ²ΠΎΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ ΠΏΠ°ΠΏΠΊΡ Β«imagesΒ» ΠΈ ΠΏΠΎΠΌΠ΅ΡΡ ΡΡΠ΄Π° ΡΠ°ΠΉΠ» Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΎΠΉ Β«bmw.jpgΒ», ΠΊΠΎΡΠΎΡΡΠΉ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠ°ΠΊ:
Π’ΠΎΠ³Π΄Π° html-ΠΊΠΎΠ΄ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠΎ Π²ΡΡΠ°Π²Π»Π΅Π½Π½ΠΎΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΎΠΉ Π±ΡΠ΄Π΅Ρ ΡΠ°ΠΊΠΈΠΌ:
Π ΡΠΌΠΎΡΡΠΈΠΌ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅:
ΠΠ°ΠΊ ΠΌΡ Π²ΠΈΠ΄ΠΈΠΌ Π½ΠΈΡΠ΅Π³ΠΎ ΡΠ»ΠΎΠΆΠ½ΠΎΠ³ΠΎ Π² ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ°Ρ Π½Π΅Ρ. ΠΠ°Π»Π΅Π΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄ΡΡΠ³ΠΈΡ Π²Π°ΠΆΠ½ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² ΡΠ΅Π³Π° Β«imgΒ».
ΠΡΡΠΈΠ±ΡΡ alt β ΠΊΠ°ΠΊ Π·Π°ΠΏΠ°ΡΠ½ΠΎΠΉ Π²Π°ΡΠΈΠ°Π½Ρ
ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΡΠ°ΠΉΠ»Ρ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ Ρ ΡΠ°Π½ΡΡΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎ ΠΎΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡ, ΡΠΎ Π΄Π»Ρ ΠΈΡ ΠΏΠΎΠ»ΡΡΠ΅Π½ΠΈΡ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ Π΄Π΅Π»Π°ΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠ΅ Π·Π°ΠΏΡΠΎΡΡ. Π ΡΡΠΎ Π΅ΡΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠ΅Π½Ρ ΠΌΠ½ΠΎΠ³ΠΎ ΠΈ ΡΠΊΠΎΡΠΎΡΡΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΠΊ ΡΠ΅ΡΠΈ ΠΌΠ°Π»Π΅Π½ΡΠΊΠ°Ρ, ΡΠΎΠ³Π΄Π° Π½Π° Π·Π°Π³ΡΡΠ·ΠΊΡ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΠ°ΠΉΠ»ΠΎΠ² ΠΏΠΎΡΡΠ΅Π±ΡΠ΅ΡΡΡ Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π²ΡΠ΅ΠΌΡ. Π Π΅ΡΠ΅ Ρ ΡΠΆΠ΅ Π΅ΡΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π±ΡΠ»ΠΎ ΡΠ΄Π°Π»Π΅Π½ΠΎ Ρ ΡΠ΅ΡΠ²Π΅ΡΠ° Π±Π΅Π· Π²Π°ΡΠ΅Π³ΠΎ Π²Π΅Π΄ΠΎΠΌΠ°.
Π ΡΡΠΈΡ ΡΠ»ΡΡΠ°ΡΡ ΡΠ°ΠΌΠ° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ° Π±ΡΠ΄Π΅Ρ ΡΡΠΏΠ΅ΡΠ½ΠΎ Π·Π°Π³ΡΡΠΆΠ΅Π½Π°, ΡΠΎΠ»ΡΠΊΠΎ Π²ΠΌΠ΅ΡΡΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π±ΡΠ΄ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π±Π΅Π»ΡΠ΅ ΠΏΡΡΠΌΠΎΡΠ³ΠΎΠ»ΡΠ½ΠΈΠΊΠΈ. ΠΠΎΡΡΠΎΠΌΡ, ΡΡΠΎΠ±Ρ ΡΠΎΠΎΠ±ΡΠΈΡΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ, ΡΡΠΎ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΈΠ· ΡΠ΅Π±Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ Π°ΡΡΠΈΠ±ΡΡ alt. Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΡΠ°ΠΊ Π½Π°Π·ΡΠ²Π°Π΅ΠΌΡΠΉ ΡΠ΅ΠΊΡΡ Π·Π°ΠΌΠ΅Π½Ρ, ΠΊΠΎΡΠΎΡΡΠΉ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π² ΠΏΡΡΡΠΎΠΌ ΠΏΡΡΠΌΠΎΡΠ³ΠΎΠ»ΡΠ½ΠΈΠΊΠ΅ ΠΏΠΎΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡΡ:
Π ΠΏΡΠΈΠΌΠ΅ΡΠ½ΠΎ ΡΠ°ΠΊ ΡΡΠΎ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ:
ΠΠ°Π΄Π°Π΅ΠΌ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ
ΠΡΡΠ°Π»ΠΎΡΡ Π΅ΡΠ΅ ΠΏΠ°ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² ΡΠ΅Π³Π° img, ΠΎ ΠΊΠΎΡΠΎΡΡΡ Π²Π°ΠΌ ΡΠ»Π΅Π΄ΡΠ΅Ρ Π·Π½Π°ΡΡ. ΠΡΠΎ ΠΏΠ°ΡΠ° Π°ΡΡΠΈΠ±ΡΡΠΎΠ² width ΠΈ height. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΈΡ , ΡΡΠΎΠ±Ρ ΡΠΊΠ°Π·Π°ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ:
Π ΠΎΠ±ΠΎΠΈΡ Π°ΡΡΠΈΠ±ΡΡΠ°Ρ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΡΠ°Π·ΠΌΠ΅Ρ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ . ΠΡΡΠΈΠ±ΡΡ width ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π±ΡΠ°ΡΠ·Π΅ΡΡ ΠΊΠ°ΠΊΠΎΠΉ ΡΠΈΡΠΈΠ½Ρ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Π° Π°ΡΡΠΈΠ±ΡΡ height ΠΊΠ°ΠΊΠΎΠΉ Π²ΡΡΠΎΡΡ. ΠΡΠΈ Π΄Π²Π° Π°ΡΡΠΈΠ±ΡΡΠ° ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡ Π²ΠΌΠ΅ΡΡΠ΅ ΠΈ ΠΏΠΎ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΡΡΠΈ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π²Ρ ΡΠΊΠ°ΠΆΠΈΡΠ΅ ΡΠΎΠ»ΡΠΊΠΎ Π°ΡΡΠΈΠ±ΡΡ width, ΡΠΎ Π±ΡΠ°ΡΠ·Π΅Ρ ΠΏΠΎΠ΄Π±Π΅ΡΠ΅Ρ Π²ΡΡΠΎΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ ΡΠΈΡΠΈΠ½Π΅ ΠΈ ΡΠ°ΠΊΠΆΠ΅ Π² ΡΠ»ΡΡΠ°Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΠΎΠ»ΡΠΊΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° height. Π ΡΠ»ΡΡΠ°Π΅ Π΅ΡΠ»ΠΈ Π²Ρ Π½Π΅ ΡΠΊΠ°ΠΆΠΈΡΠ΅ ΡΡΠΈ Π°ΡΡΠΈΠ±ΡΡΡ Π²ΠΎΠ²ΡΠ΅, ΡΠΎ Π±ΡΠ°ΡΠ·Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅Π΄ Π²ΡΠ²ΠΎΠ΄ΠΎΠΌ Π΅Π³ΠΎ Π½Π° ΡΠΊΡΠ°Π½. Π‘ΡΠΎΠΈΡ ΡΠΎΠ»ΡΠΊΠΎ Π·Π°ΠΌΠ΅ΡΠΈΡΡ, ΡΡΠΎ ΡΠΊΠ°Π·ΡΠ²Π°Π½ΠΈΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΡΠΊΠΎΡΠΈΡ ΡΠ°Π±ΠΎΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΠΏΡΠΈ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠ° ΡΡΠΎΠΌ ΠΎ Π²ΡΡΠ°Π²ΠΊΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΏΠΎΠΊΠ° Π²ΡΠ΅, Π΄Π°Π»Π΅Π΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ Π°ΡΠ΄ΠΈΠΎ ΠΈΠ»ΠΈ Π²ΠΈΠ΄Π΅ΠΎ Π½Π° ΡΠ°ΠΉΡ.
ΠΡΡΠ°Π²Π»ΡΠ΅ΠΌ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π°ΡΠ΄ΠΈΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ HTML 5
Π Π½ΠΎΠ²ΠΎΠΉ ΡΠΏΠ΅ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ html5 ΠΏΠΎΡΠ²ΠΈΠ»ΠΎΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π½ΠΎΠ²ΡΡ ΡΠ΅Π³ΠΎΠ² Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠΎΡΠΎΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡΠ΅Π½Ρ Π»Π΅Π³ΠΊΠΎ Π²ΡΡΠ°Π²Π»ΡΡΡ ΡΠ°ΠΉΠ»Ρ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠ°. ΠΡΠΎ ΠΏΡΠ΅ΠΆΠ΄Π΅ Π²ΡΠ΅Π³ΠΎ ΠΊΠ°ΡΠ°Π΅ΡΡΡ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π°ΡΠ΄ΠΈΠΎ.
ΠΠ»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ Π°ΡΠ΄ΠΈΠΎ HTML5 ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΏΠ°ΡΠ½ΡΠΉ ΡΠ΅Π³ AUDIO. ΠΠ΄ΡΠ΅Ρ ΡΠ°ΠΉΠ»Π°, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ Ρ ΡΠ°Π½ΠΈΡΡΡ Π°ΡΠ΄ΠΈΠΎΡΠΎΠ»ΠΈΠΊ, ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΆΠ΅ Π·Π½Π°ΠΊΠΎΠΌΠΎΠ³ΠΎ Π½Π°ΠΌ Π°ΡΡΠΈΠ±ΡΡΠ° src:
Π’Π΅Π³ Β«audioΒ» ΡΠΎΠ·Π΄Π°Π΅Ρ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π±Π»ΠΎΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π±ΡΠ°ΡΠ·Π΅Ρ Π½Π΅ Π±ΡΠ΄Π΅Ρ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ Π°ΡΠ΄ΠΈΠΎΡΠΎΠ»ΠΈΠΊ. Π§ΡΠΎ Π±Ρ ΠΎΠ½ ΡΡΠΎ ΡΠ΄Π΅Π»Π°Π», Π² ΡΠ΅Π³Π΅ audio Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΠ°Π·Π°ΡΡ ΠΎΡΠΎΠ±ΡΠΉ Π°ΡΡΠΈΠ±ΡΡ autoplay. ΠΡΠΎΠ±ΡΠΉ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΎΠ½ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π·Π½Π°ΡΠ΅Π½ΠΈΡ. ΠΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΏΡΠΈΡΡΡΡΡΠ²ΠΈΡ ΡΡΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° Π² ΡΠ΅Π³Π΅, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π½Π°ΡΠ°Π» Π΄Π΅ΠΉΡΡΠ²ΠΎΠ²Π°ΡΡ.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π°ΡΠ΄ΠΈΠΎΡΠΎΠ»ΠΈΠΊ Π½ΠΈΠΊΠ°ΠΊ Π½Π΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π½Π° web-ΡΡΡΠ°Π½ΠΈΡΠ΅. ΠΠΎ Π΅ΡΠ»ΠΈ Π² ΡΠ΅Π³Π΅ Β«audioΒ» ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ Π°ΡΡΠΈΠ±ΡΡ Π±Π΅Π· Π·Π½Π°ΡΠ΅Π½ΠΈΡ controls, Π±ΡΠ°ΡΠ·Π΅Ρ Π²ΡΠ²Π΅Π΄Π΅Ρ Π² ΡΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, Π³Π΄Π΅ ΠΏΡΠΎΡΡΠ°Π²Π»Π΅Π½ ΡΠ΅Π³ audio, ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅ΠΌ Π°ΡΠ΄ΠΈΠΎΡΠΎΠ»ΠΈΠΊΠ°. ΠΠ½ΠΈ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ Π·Π°ΠΏΡΡΠΊΠ° ΠΈ ΠΏΡΠΈΠΎΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡ, ΡΠΊΠ°Π»Ρ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ ΡΠ΅Π³ΡΠ»ΡΡΠΎΡ Π³ΡΠΎΠΌΠΊΠΎΡΡΠΈ:
ΠΠ»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ Π²ΠΈΠ΄Π΅ΠΎΡΠΎΠ»ΠΈΠΊΠ° Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ ΠΏΠ°ΡΠ½ΡΠΉ ΡΠ΅Π³ video. Π‘ ΡΡΠΈΠΌ ΡΠ΅Π³ΠΎΠΌ Π²ΡΠ΅ ΡΠΎΠΆΠ΅ ΡΠ°ΠΌΠΎΠ΅, ΡΡΠΎ ΠΈ Ρ ΡΠ΅Π³ΠΎΠΌ audio β Π°Π΄ΡΠ΅Ρ Π²ΠΈΠ΄Π΅ΠΎΡΠ°ΠΉΠ»Π° ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° src, Π° Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² autoplay ΠΈ controls ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΏΡΡΡΠΈΡΡ Π°Π²ΡΠΎΠ²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΠ΅ ΡΠΎΠ»ΠΈΠΊΠ° ΠΈ Π²ΡΠ²Π΅ΡΡΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡ Π²ΠΈΠ΄Π΅ΠΎΡΠΎΠ»ΠΈΠΊΠ°.
ΠΠΎΠ»ΡΡΠ΅ ΡΠ°ΡΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΠΎ Π²ΡΡΠ°Π²ΠΊΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ ΠΈ ΠΌΡΠ»ΡΡΠΈΠΌΠ΅Π΄ΠΈΠ° Π½Π° html ΡΡΡΠ°Π½ΠΈΡΡ ΠΎΡΠΎΠ±ΠΎ Π½Π΅ΡΠ΅Π³ΠΎ. ΠΠ°Π΄Π΅ΡΡΡ Π½Π° Π²ΠΎΠΏΡΠΎΡ Β«ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² html ΡΡΡΠ°Π½ΠΈΡΡ?Β» Ρ Π²Π°ΠΌ ΠΎΡΠ²Π΅ΡΠΈΠ». ΠΏΠΎΡΡΠΎΠΌΡ ΠΏΡΠΎΡΡΠΎ ΠΏΠΎΠ΄Π²Π΅Π΄Ρ ΠΈΡΠΎΠ³ΠΈ :
ΠΡΠ»ΠΈ ΡΡΠΎ Π½Π΅ ΠΏΠΎΠ½ΡΡΠ½ΠΎ, ΡΠΏΡΠ°ΡΠΈΠ²Π°ΠΉΡΠ΅ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ ΠΈ Π½Π΅ Π·Π°Π±ΡΠ΄ΡΡΠ΅ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡΡΡ Π½Π° ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΡ ΠΌΠΎΠ΅Π³ΠΎ Π±Π»ΠΎΠ³Π°. ΠΠΎ Π²ΡΡΡΠ΅ΡΠΈ Π² ΡΠ»Π΅Π΄ΡΡΡΠΈΡ ΠΏΠΎΡΡΠ°Ρ !
HTML IMG. ΠΡΡΠ°Π²ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π²Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ
ΠΠ»Π°Π²Π½ΠΎΠ΅ ΠΌΠ΅Π½Ρ Β» ΠΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Β» PHP Β» HTML IMG. ΠΡΡΠ°Π²ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π²Π°ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ
Π’Π΅Π³ HTML
Π ΡΠ°ΠΌΠΎΠΌ Π½Π°ΡΠ°Π»Π΅ ΡΠ΅ΡΠΈ ΡΡΡΠ°Π½ΠΈΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠ°Π»ΠΈ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΠΊΡΡ ΠΈ ΡΡΡΠ»ΠΊΠΈ. ΠΡΠΎ ΡΠ΄Π΅Π»Π°Π»ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Π½ΡΠΌ ΠΈ ΠΎΠ΄Π½ΠΎΠΎΠ±ΡΠ°Π·Π½ΡΠΌ. Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ ΡΠ΅ΡΡΡΡΠΎΠ² Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ°Ρ Π½Π΅ Π·Π°Π½ΡΠ»ΠΎ ΠΌΠ½ΠΎΠ³ΠΎ Π²ΡΠ΅ΠΌΠ΅Π½ΠΈ.
ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π²Π°ΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΡΠ΅ΡΠΊΠ½ΡΡΡ, ΡΡΠΎ ΡΠ΅Π³ HTML img Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΡΠ΅Π³Π° ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΡΠ°Π±Π»ΠΎΠ½ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π²ΡΡΡΠΎΠ΅Π½Π½ΠΎΠ³ΠΎ Π±Π»ΠΎΠΊΠ° CSS. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π°ΠΌΠ΅ΡΠΈΡΡ, ΡΡΠΎ ΡΡΠ°Π½Π΄Π°ΡΡΠ½Π°Ρ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²ΠΊΠ° ΡΠΈΡΠΈΠ½Ρ ΠΈ Π²ΡΡΠΎΡΡ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ.
ΠΡΡΠ°Π²ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ HTML img
Π§ΡΠΎΠ±Ρ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² HTML, ΠΏΡΠΎΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠ΅Π³ img Ρ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ src. Π’ΠΎ Π΅ΡΡΡ: Π°ΡΡΠΈΠ±ΡΡ src ΠΈΠ»ΠΈ ΠΈΡΡΠΎΡΠ½ΠΈΠΊ Π±ΡΠ΄Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ URL-Π°Π΄ΡΠ΅Ρ Π²ΡΡΠ°Π²Π»ΡΠ΅ΠΌΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.
Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΡΠΉ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ Π±ΡΠ΄Π΅Ρ ΡΠ°ΠΊΠΈΠΌ:
Π§ΡΠΎΠ±Ρ Π²ΡΡΠ°Π²ΠΈΡΡ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ Π²ΠΊΠ»ΡΡΠΈΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΈΠΌΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ Π΅Π³ΠΎ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ΠΌ, ΠΊΠ°ΠΊ Π² ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π½ΠΈΠΆΠ΅:
ΠΡΠ»ΠΈ ΠΎΠ½ ΡΠΎΠ΄Π΅ΡΠΆΠΈΡΡΡ Π² Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎΠΉ ΠΏΠ°ΠΏΠΊΠ΅, ΠΌΡ ΡΠ°ΠΊΠΆΠ΅ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΡΡΠ»Π°ΡΡΡΡ Π½Π° ΡΡΡ ΠΏΠ°ΠΏΠΊΡ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ ΠΌΠΎΡ Π³Π»Π°Π²Π½Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ° ΡΠΎΠ΄Π΅ΡΠΆΠΈΡΡΡ Π² ΠΏΠ°ΠΏΠΊΠ΅ public_html ΠΈ Π²Π½ΡΡΡΠΈ Π½Π΅Π΅ Ρ Π½Π°Ρ Π΅ΡΡΡ ΠΏΠ°ΠΏΠΊΠ° Ρ ΠΈΠΌΠ΅Π½Π΅ΠΌ images, Π³Π΄Π΅ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π½Π°ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ URL:
Π‘ Π΄ΡΡΠ³ΠΎΠΉ ΡΡΠΎΡΠΎΠ½Ρ, ΠΌΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΠΌ Π²ΠΊΠ»ΡΡΠΈΡΡ ΠΏΠΎΠ»Π½ΡΠΉ URL-Π°Π΄ΡΠ΅Ρ Π½Π°ΡΠ΅Π³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠ΅Π΄ΠΏΠΎΠ»ΠΎΠΆΠΈΠΌ, ΡΡΠΎ Π½Π°Ρ Π΄ΠΎΠΌΠ΅Π½ https://mydomain.ru ΠΈ Π² ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄:
Π’Π΅ΠΏΠ΅ΡΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΊΠ»ΡΡΠ°ΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΎΠΊΠ°Π»ΡΠ½ΠΎ Π½Π° ΡΠ²ΠΎΡ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΡΠ½ΠΊΡΠΈΡ HTML img.
ΠΡΡΠ°Π²ΠΊΠ° Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ HTML img
Π’Π΅ΠΏΠ΅ΡΡ, ΠΊΠΎΠ³Π΄Π° ΠΌΡ ΠΈΠ·ΡΡΠΈΠ»ΠΈ Π±Π°Π·ΠΎΠ²ΡΠΉ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ HTML img ΠΈ ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²Π»ΡΡΡ Π»ΠΎΠΊΠ°Π»ΡΠ½ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π΄Π°Π²Π°ΠΉΡΠ΅ ΠΈΠ·ΡΡΠΈΠΌ, ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²Π»ΡΡΡ Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. ΠΠ»ΠΎΠ±Π°Π»ΡΠ½ΡΠΉ ΠΎΠ±ΡΠ°Π· ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΠΎΠ½ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π·Π° ΠΏΡΠ΅Π΄Π΅Π»Π°ΠΌΠΈ Π½Π°ΡΠ΅ΠΉ ΠΎΠ±Π»Π°ΡΡΠΈ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΏΡΠΎΡΡΠΎ Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΠΉ URL-Π°Π΄ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² Π°ΡΡΠΈΠ±ΡΡ src.
ΠΠΎΠΏΡΡΡΠΈΠΌ, Π²Ρ Ρ ΠΎΡΠΈΡΠ΅ Π²ΠΊΠ»ΡΡΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ ΠΏΠΎ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠΌΡ URL-Π°Π΄ΡΠ΅ΡΡ https://www.example.ru/pictures/picture_01.png. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΏΡΠΎΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄:
ΠΠ΄Π½Π°ΠΊΠΎ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ Π³Π»ΠΎΠ±Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΎΠ±ΡΠ°Π·Π°, ΡΠΎ Π΅ΡΡΡ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ, ΠΌΡ ΡΡΠ°Π»ΠΊΠΈΠ²Π°Π΅ΠΌΡΡ Ρ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠΎΠΉ. ΠΡΠΈ ΡΡΠΎΠΌ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π°Π²ΠΈΡΠ΅ΡΡ ΠΎΡ ΡΠΎΠ³ΠΎ, ΡΡΠΎ Π΄ΡΡΠ³ΠΎΠΉ Π΄ΠΎΠΌΠ΅Π½ Π²ΡΠ΅Π³Π΄Π° ΡΠ°Π±ΠΎΡΠ°Π΅Ρ. ΠΡΠΎ ΠΏΠΎΡΠΎΠΌΡ, ΡΡΠΎ Π΅ΡΠ»ΠΈ Π² ΠΊΠ°ΠΊΠΎΠΉ-ΡΠΎ ΠΌΠΎΠΌΠ΅Π½Ρ ΡΡΠΎΡ Π΄ΠΎΠΌΠ΅Π½ ΠΏΠ΅ΡΠ΅ΡΡΠ°Π½Π΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ, ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ Π±ΡΠ΄Π΅Ρ Π·Π°Π³ΡΡΠΆΠ΅Π½ΠΎ.
Π§ΡΠΎΠ±Ρ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Ρ Π²Π°ΡΠΈΠΌ HTML-ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ, ΠΌΡ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ ΠΈΠ·Π±Π΅Π³Π°ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π²Π½Π΅ΡΠ½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π΅ΡΠ΅ ΠΎΠ΄Π½ΠΎΠΉ ΡΠ΅ΡΡΠ΅Π·Π½ΠΎΠΉ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠΎΠΉ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΡ Π°Π²ΡΠΎΡΡΠΊΠΈΠ΅ ΠΏΡΠ°Π²Π°. ΠΠΎΡΡΠΎΠΌΡ Π²ΡΠ΅Π³Π΄Π° ΠΏΠΎΠΌΠ½ΠΈΡΠ΅ ΠΎΠ± ΡΡΠΈΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠ°Ρ ΠΈ ΠΏΡΠΈ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ Π½Π΅ Π·Π°Π±ΡΠ²Π°ΠΉΡΠ΅ ΠΎΠ±ΡΠ°ΡΠ°ΡΡΡΡ ΠΊ Π½ΠΈΠΌ Π΄ΠΎΠ»ΠΆΠ½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ.
ΠΡΡΠΈΠ±ΡΡΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°
ΠΠΎΠΌΠΈΠΌΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° src, ΡΠ΅Π³ ΠΈΠΌΠ΅Π΅Ρ Π΄ΡΡΠ³ΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ, Π΄ΠΎΠΏΠΎΠ»Π½ΡΡΡΠΈΠ΅ Π΅Π³ΠΎ ΡΡΡΡΠΊΡΡΡΡ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΠΊΠ»ΡΡΠΈΡΡ Π°ΡΡΠΈΠ±ΡΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠΎΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΎΠ³Π΄Π°, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π½Π°Π²ΠΎΠ΄ΠΈΡ ΠΊΡΡΡΠΎΡ Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. ΠΠΎΡΡΠΎΠΌΡ, ΡΡΠΎΠ±Ρ Π²ΠΊΠ»ΡΡΠΈΡΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΏΡΠΎΡΡΠΎ Π²ΡΠ·ΠΎΠ²ΠΈΡΠ΅ Π΅Π³ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° title=ββ¦β. ΠΠΎΡΠΌΠΎΡΡΠΈΠΌ Π½Π° ΠΏΡΠΈΠΌΠ΅Ρ Π½ΠΈΠΆΠ΅:
Π¨ΠΈΡΠΈΠ½Π° ΠΈ Π²ΡΡΠΎΡΠ° HTML img
Π’Π΅Π³ ΠΈΠΌΠ΅Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΡΡ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. Π‘Π»Π΅Π΄ΠΎΠ²Π°ΡΠ΅Π»ΡΠ½ΠΎ, ΠΏΡΠΈ Π΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ Π²ΠΊΠ»ΡΡΠ°ΡΡ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π±Π΅Π· ΠΈΡΠΊΠ°ΠΆΠ΅Π½ΠΈΠΉ. ΠΠ΄Π½Π°ΠΊΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠΏΡΠ°Π²Π»ΡΡΡ ΡΡΠΈΠΌΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΠΌΠΈ Π½Π°ΠΏΡΡΠΌΡΡ ΡΠ΅ΡΠ΅Π· CSS ΠΈΠ»ΠΈ ΡΠ΅ΡΠ΅Π· Π°ΡΡΠΈΠ±ΡΡΡ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ.
ΠΡΠ»ΠΈ ΠΌΡ Π±ΡΠ΄Π΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π½ΠΈΡ , Π΄ΡΡΠ³ΠΎΠΉ Π±ΡΠ΄Π΅Ρ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°ΡΡΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ, ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ, Π±Π΅Π· ΠΈΡΠΊΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΎΠ±Π°, ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ ΡΠΎΡΠ½ΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠ΅ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ, ΠΏΠΎΡΡΠΎΠΌΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΊΠ°Π·ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π΅ΡΠ»ΠΈ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ Π½ΠΈΠ·ΠΊΠΈΠΌ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ Π±ΠΎΠ»ΡΡΠ΅ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»Π°, ΠΎΠ½ΠΈ, ΡΠΊΠΎΡΠ΅Π΅ Π²ΡΠ΅Π³ΠΎ, ΡΠ°ΠΊΠΆΠ΅ Π±ΡΠ΄ΡΡ ΠΈΡΠΊΠ°ΠΆΠ΅Π½Ρ. ΠΠΎΡΡΠΎΠΌΡ ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ, ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΡΡΠΈΠΌ Π΄Π»Ρ Π²Π°ΡΠΈΡ ΡΡΡΠ°Π½ΠΈΡ, ΠΈΠ»ΠΈ Π² Π²Π΅ΠΊΡΠΎΡΠ½ΡΡ ΡΠΎΡΠΌΠ°ΡΠ°Ρ .
Π ΡΡΠΎΠΌ ΠΈΡΡ ΠΎΠ΄Π½ΠΎΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΠΎΠ΅ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ 250 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ Π² ΡΠΈΡΠΈΠ½Ρ ΠΈ 100 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ Π² Π²ΡΡΠΎΡΡ. ΠΠ΄Π½Π°ΠΊΠΎ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ Π΄Π»Ρ Π½Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅Ρ. ΠΡΠ°ΠΊ, Π΄Π°Π²Π°ΠΉΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ ΡΠΈΡΠΈΠ½Ρ 100 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ, ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΡΡΠΎ ΠΏΡΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ.
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ Π΄Π°ΠΆΠ΅ ΠΏΡΠΈ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²ΠΊΠ΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΈΡΠΈΠ½Ρ Π²ΡΡΠΎΡΠ° ΡΠ΅Π³ΡΠ»ΠΈΡΡΠ΅ΡΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ, Π±Π΅Π· ΠΈΡΠΊΠ°ΠΆΠ΅Π½ΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±ΠΈΡΡΡΡ ΡΠΎΠ³ΠΎ ΠΆΠ΅ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ°, ΠΎΡΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°Π² ΡΠΎΠ»ΡΠΊΠΎ Π²ΡΡΠΎΡΡ, ΡΡΠΎΠ±Ρ ΡΠΈΡΠΈΠ½Π° ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°Π»Π°ΡΡ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ.
ΠΠ»Π°Π²Π°ΡΡΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ
Π₯ΠΎΡΡ HTML img ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΈΠΌΠ΅Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΡ Π±Π»ΠΎΠΊΠΎΠ², Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°ΡΡΠΎ Π·Π°Ρ ΠΎΡΠ΅ΡΡ, ΡΡΠΎΠ±Ρ ΠΎΠ½ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π»ΡΡ Π² ΡΠ΅ΠΊΡΡΠ΅. ΠΡΠΎ Π΄Π΅Π»Π°Π΅ΡΡΡ Π΄Π»Ρ ΡΠΎΠ³ΠΎ, ΡΡΠΎΠ±Ρ ΡΠ΅ΠΊΡΡ ΠΌΠΎΠ³ Π°Π΄Π°ΠΏΡΠΈΡΠΎΠ²Π°ΡΡΡΡ ΠΊ ΡΠ²ΠΎΠ΅ΠΌΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π±Π΅Π· ΠΏΠΎΡΠ΅ΡΠΈ ΠΈΡΡ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
Π‘Π»Π΅Π΄ΠΎΠ²Π°ΡΠ΅Π»ΡΠ½ΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΏΠΎΠΏΠ»Π°Π²ΠΎΠΊ Π² ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΈ ΡΠ΅ΡΠ΅Π· CSS. ΠΠ°Π²Π°ΠΉΡΠ΅ ΠΏΠΎΡΠΌΠΎΡΡΠΈΠΌ Π½Π° ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΡΠΉ Π½ΠΈΠΆΠ΅ ΠΏΡΠΈΠΌΠ΅Ρ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΡ CSS Π² Π°ΡΡΠΈΠ±ΡΡΠ΅ style ΠΈ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ:
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡΡΡ Π² Π½ΡΠΆΠ½ΡΡ ΡΡΠΎΡΠΎΠ½Ρ, Π° ΡΠ΅ΠΊΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ Π°Π΄Π°ΠΏΡΠΈΡΡΠ΅ΡΡΡ ΠΊ Π½ΠΈΠΌ.
Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΠΈ Π΄Π»Ρ HTML img
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΠ³ΠΎ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²Π° Π²Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΡΡΠ°Π²Π»ΡΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° ΡΠ²ΠΎΠΈ HTML- ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΠΊΠΎΠ΄Ρ, ΠΎΠΏΠΈΡΠ°Π½Π½ΡΠ΅ Π² ΡΡΠΎΠΌ ΡΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²Π΅, ΠΏΠΎ ΡΠ²ΠΎΠ΅ΠΌΡ ΠΆΠ΅Π»Π°Π½ΠΈΡ. ΠΡ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ ΠΏΡΠΎΡΠΈΡΠ°ΡΡ ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½ΡΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ W3C ΠΎ ΡΠ΅Π³Π΅ ΠΈΠ»ΠΈ ΡΡΡ Π΄ΡΡΠ³ΡΡ ΡΡΠ°ΡΡΡ W3C, Π² ΠΊΠΎΡΠΎΡΠΎΠΉ ΠΎΠ±ΡΡΡΠ½ΡΡΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΡΡΠΈΠ»ΠΈΠ·Π°ΡΠΈΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ.
ΠΡΠ»ΠΈ Π²Ρ Π½Π°ΡΠ»ΠΈ ΠΎΡΠΈΠ±ΠΊΡ, ΠΏΠΎΠΆΠ°Π»ΡΠΉΡΡΠ°, Π²ΡΠ΄Π΅Π»ΠΈΡΠ΅ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ ΡΠ΅ΠΊΡΡΠ° ΠΈ Π½Π°ΠΆΠΌΠΈΡΠ΅ Ctrl+Enter.

















