ΠΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² HTML β ΡΠΏΠ°ΡΠ³Π°Π»ΠΊΠ° Π΄Π»Ρ Π½ΠΎΠ²ΠΈΡΠΊΠΎΠ²
42.8KΠΡΠ΅ΠΆΠ΄Π΅, ΡΠ΅ΠΌ ΠΎΡΠ²Π΅ΡΠΈΡΡ Π½Π° Π²ΠΎΠΏΡΠΎΡ Β«ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML?Β», ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΎΡΠΌΠ΅ΡΠΈΡΡ, ΡΡΠΎ ΠΏΠ΅ΡΠ΅Π³ΡΡΠΆΠ°ΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΎΠ³ΡΠΎΠΌΠ½ΡΠΌ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎΠΌ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»Π° Π½Π΅ ΡΡΠΎΠΈΡ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΡΡΠΎ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ ΡΠ»ΡΡΡΠΈΡ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎΠ΅ Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅ ΡΠ΅ΡΡΡΡΠ° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ, Π½ΠΎ ΠΈ ΡΠ²Π΅Π»ΠΈΡΠΈΡ Π²ΡΠ΅ΠΌΡ Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ Π²Π΅Π±-ΡΠ°ΠΉΡΠΎΠ² ΡΠ°ΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΠΎΡΠΌΠ°ΡΡ PNG, GIF ΠΈ JPEG, Π° Π΄Π»Ρ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΡΠΊΠΈΡ ΡΠ°Π±ΠΎΡ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ β Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΡΠ΅Π΄Π°ΠΊΡΠΎΡ Adobe Photoshop, ΠΎΠ±Π»Π°Π΄Π°ΡΡΠΈΠΉ Π±ΠΎΠ³Π°ΡΡΠΌΠΈ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΠΌΠΈ Π΄Π»Ρ ΡΠΆΠ°ΡΠΈΡ ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π±Π΅Π· ΠΏΠΎΡΠ΅ΡΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°, ΡΡΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π΅Π²Π΅ΡΠΎΡΡΠ½ΠΎ Π²Π°ΠΆΠ½ΡΠΌ Π΄Π»Ρ Π²Π΅Π±-ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ.
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° HTML-ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΠΎΠ΄ΠΈΠ½ΠΎΡΠ½ΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠ΅Π³:
Π³Π΄Π΅ xxx β Π°Π΄ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. Π ΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅, Π΅ΡΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΎΠ΄Π½ΠΎΠΉ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ ΡΠΎ ΡΡΡΠ°Π½ΠΈΡΠ΅ΠΉ, ΡΠ΅Π³ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΠΊΠ°ΠΊ:
<img src=βimage.pngβ>
ΠΠ΄Π½Π°ΠΊΠΎ ΡΠΊΠΎΡΠΎΡΡΠ½ΠΎΠΉ ΠΈ ΡΡΠ°Π±ΠΈΠ»ΡΠ½ΡΠΉ ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ Π΄ΠΎΠ±ΡΠ°Π»ΡΡ Π΅ΡΡ Π½Π΅ Π²ΠΎ Π²ΡΠ΅ ΡΠ³ΠΎΠ»ΠΊΠΈ Π·Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°ΡΠ°, ΠΈ Π±ΡΠ²Π°Π΅Ρ ΡΠ°ΠΊ, ΡΡΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° Π²Π΅Π±-ΡΠ°ΠΉΡΠ΅ ΠΏΠΎΠΏΡΠΎΡΡΡ Π½Π΅ Π·Π°Π³ΡΡΠΆΠ°Π΅ΡΡΡ. ΠΠ»Ρ ΡΠ°ΠΊΠΈΡ ΡΠ»ΡΡΠ°Π΅Π² ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΏΠΎΠ½ΡΡΠΈΠ΅ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ°.
ΠΠ½ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Π½Π° ΠΌΠ΅ΡΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² ΠΌΠΎΠΌΠ΅Π½Ρ Π΅Π³ΠΎ Π½Π΅Π΄ΠΎΡΡΡΠΏΠ½ΠΎΡΡΠΈ, Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΈΠ»ΠΈ Π² ΡΠ΅ΠΆΠΈΠΌΠ΅ ΡΠ°Π±ΠΎΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠ° Β«Π±Π΅Π· ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊΒ». ΠΠΎΠ±Π°Π²Π»ΡΠ΅ΡΡΡ ΠΎΠ½ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° alt ΡΠ΅Π³Π° <img>.
ΠΡΠΈΠΌΠ΅Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ° ΠΊ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΌΡ ΡΠ°ΠΉΠ»Ρ:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ΠΠ»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΠΉ ΡΠ΅ΠΊΡΡ</title> </head> <body> <p><img src="images/example.png" alt="ΠΠ»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π½ΡΠΉ ΡΠ΅ΠΊΡΡ"></p> </body> </html>
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡ ΡΠ΅Π³ΠΈ height ΠΈ width, Π³Π΄Π΅ height β Π²ΡΡΠΎΡΠ°, Π° width β ΡΠΈΡΠΈΠ½Π°, ΠΈΠ·ΠΌΠ΅ΡΡΠ΅ΠΌΡΠ΅ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ .
ΠΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ Π΄Π°Π½Π½ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² Π±ΡΠ°ΡΠ·Π΅Ρ ΡΠ½Π°ΡΠ°Π»Π° Π²ΡΠ΄Π΅Π»ΡΠ΅Ρ ΠΌΠ΅ΡΡΠΎ Π΄Π»Ρ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ°, ΠΏΠΎΠ΄Π³ΠΎΡΠ°Π²Π»ΠΈΠ²Π°Π΅Ρ ΠΎΠ±ΡΠΈΠΉ ΠΌΠ°ΠΊΠ΅Ρ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ ΡΠ΅ΠΊΡΡ, ΠΏΠΎΡΠ»Π΅ ΡΠ΅Π³ΠΎ Π·Π°Π³ΡΡΠΆΠ°Π΅Ρ ΡΠ°ΠΌΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ.
Π ΠΈΡΡΠ½ΠΎΠΊ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅ΡΡΡ Π² ΠΏΡΡΠΌΠΎΡΠ³ΠΎΠ»ΡΠ½ΠΈΠΊ Ρ Π·Π°Π΄Π°Π½Π½ΡΠΌΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΠΌΠΈ, Π° Π² ΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅, Π΅ΡΠ»ΠΈ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠ΅Π½ΡΡΠ΅ ΠΈΠ»ΠΈ Π±ΠΎΠ»ΡΡΠ΅ ΠΈΡΡ ΠΎΠ΄Π½ΡΡ , ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΡΡΠ³ΠΈΠ²Π°Π΅ΡΡΡ ΠΈΠ»ΠΈ ΡΠΆΠΈΠΌΠ°Π΅ΡΡΡ.
ΠΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡΡ height ΠΈ width Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ, Π±ΡΠ°ΡΠ·Π΅Ρ Π·Π°Π³ΡΡΠΆΠ°Π΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΡΠ°Π·Ρ, Π·Π°Π΄Π΅ΡΠΆΠΈΠ²Π°Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΈ ΠΏΡΠΎΡΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠ°Π½Π½ΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°Π·Π°ΡΡ ΠΊΠ°ΠΊ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ (ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎΡΡΠΎΡΠ½Π΅Π½ ΠΈ Π½Π΅ Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΡ ΡΠΊΡΠ°Π½Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ), ΡΠ°ΠΊ ΠΈ Π² ΠΏΡΠΎΡΠ΅Π½ΡΠ°Ρ (ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ ΡΠ°Π·ΡΠ΅ΡΠ΅Π½ΠΈΡ ΡΠΊΡΠ°Π½Π°).
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
<img src=βexample.pngβ width=β60β height=β40β>
ΠΈΠ»ΠΈ
<img src=βexample.pngβ width=β50%β height=β10%β>
Π‘Π»Π΅Π΄ΡΠ΅Ρ ΠΏΠΎΠΌΠ½ΠΈΡΡ, ΡΡΠΎ Π² ΡΠΎΡ ΠΌΠΎΠΌΠ΅Π½Ρ, ΠΊΠΎΠ³Π΄Π° Π²Ρ ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅ΡΠ΅ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΎΡ ΡΠ°Π½ΡΡΡ Π΅Π³ΠΎ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΈ.
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΡΠΊΠ°Π·Π°ΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ· ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠΎΠ² (ΡΠΈΡΠΈΠ½Ρ ΠΈΠ»ΠΈ Π²ΡΡΠΎΡΡ), Π° Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π²ΡΠΎΡΠΎΠ³ΠΎ Π±ΡΠ°ΡΠ·Π΅Ρ Π²ΡΡΠΈΡΠ»ΠΈΡ Π² Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΌ ΡΠ΅ΠΆΠΈΠΌΠ΅.
ΠΠ°ΠΊ ΠΈ ΠΊΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠΌ ΡΠ΅Π³Π°ΠΌ HTML, ΠΊ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΠΌ Π°ΡΡΠΈΠ±ΡΡ align, ΠΊΠΎΡΠΎΡΡΠΉ Π²ΡΠΏΠΎΠ»Π½ΡΠ΅Ρ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ:
<img src=βexample.pngβ align=βtopβ> β ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Π²ΡΡΠ΅ ΡΠ΅ΠΊΡΡΠ°;
<img src=βexample.pngβ align=βbottomβ> β ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Π½ΠΈΠΆΠ΅ ΡΠ΅ΠΊΡΡΠ°;
<img src=βexample.pngβ align=βleftβ> β ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΡΠ»Π΅Π²Π° ΠΎΡ ΡΠ΅ΠΊΡΡΠ°;
<img src=βexample.pngβ align=βrightβ> β ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΡΠΏΡΠ°Π²Π° ΠΎΡ ΡΠ΅ΠΊΡΡΠ°.
Π HTML Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΡΡΡΠ»ΠΊΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ΅Π³ <a>:
<a href=βΠ°Π΄ΡΠ΅Ρ Π²Π°ΡΠ΅ΠΉ ΡΡΡΠ»ΠΊΠΈβ>ΠΠΌΡ ΡΡΡΠ»ΠΊΠΈ</a>
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π·Π°Π΄Π°ΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΡΡ ΡΡΡΠ»ΠΊΡ, Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π²ΡΠ΅Π³ΠΎ Π»ΠΈΡΡ ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΠΈΡΡ ΡΠ΅Π³ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Ρ ΡΠ΅Π³ΠΎΠΌ ΡΡΡΠ»ΠΊΠΈ.
ΠΠ΅Π»Π°Π΅ΡΡΡ ΡΡΠΎ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ:
<a href=βΠ°Π΄ΡΠ΅Ρ ΡΡΡΠ»ΠΊΠΈβ><img src=βΠ°Π΄ΡΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈβ></a>
ΠΠ°ΠΊ Π²ΠΈΠ΄ΠΈΡΠ΅, Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠ°Ρ Π²ΡΡΠ°Π²ΠΊΠ° ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΡΡΠ»ΠΊΠΎΠΉ ΠΈ ΠΏΡΠΈ ΠΊΠ»ΠΈΠΊΠ΅ ΠΏΠ΅ΡΠ΅Π°Π΄ΡΠ΅ΡΠΎΠ²ΡΠ²Π°ΡΡ Π½Π° Π»ΡΠ±ΠΎΠΉ Π°Π΄ΡΠ΅Ρ, Π·Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ Π² ΠΏΠΎΠ»Π½ΠΎΠΌ ΠΈΠ»ΠΈ ΡΠΎΠΊΡΠ°ΡΡΠ½Π½ΠΎΠΌ Π²Π°ΡΠΈΠ°Π½ΡΠ΅.
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ Π²ΡΡΠ°Π²Π»ΡΡΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π²ΠΈΠ΄ΠΈΠΌΠΎΠ³ΠΎ ΠΎΠ±ΡΠ΅ΠΊΡΠ°, Π½ΠΎ ΠΈ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠΎΠ½ΠΎΠ²ΡΠΌ. ΠΠ»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΊΠ°ΠΊ ΡΠΎΠ½Π° Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π² ΡΠ΅Π³Π΅ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ Π°ΡΡΠΈΠ±ΡΡ background=βxxxβ, Π³Π΄Π΅ xxx β Π°Π΄ΡΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ, ΡΠΊΠ°Π·Π°Π½Π½ΡΠΉ ΡΠ°ΠΊΠΈΠΌ ΠΆΠ΅ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ, ΠΊΠ°ΠΊ Π² ΠΏΡΠΈΠΌΠ΅ΡΠ°Ρ Π²ΡΡΠ΅.
ΠΠ»Ρ ΠΏΡΠΈΠΌΠ΅ΡΠ° Π·Π°Π΄Π°Π΄ΠΈΠΌ ΡΠ°ΠΊΡΡ ΡΠ΅ΠΊΡΡΡΡΠ½ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² ΡΠΎΠ»ΠΈ ΡΠΎΠ½ΠΎΠ²ΠΎΠΉ:
Π‘ΠΎΡ ΡΠ°Π½ΠΈΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² ΠΏΠ°ΠΏΠΊΠ΅ Ρ Π·Π°Π³ΠΎΡΠΎΠ²Π»Π΅Π½Π½ΠΎΠΉ Π·Π°ΡΠ°Π½Π΅Π΅ ΡΡΡΠ°Π½ΠΈΡΠ΅ΠΉ ΠΈ ΠΏΡΠΎΠΏΠΈΡΠΈΡΠ΅ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΡΡΡΠΎΠΊΠΈ:
<html> <head><title>Π‘ΡΡΠ°Π½ΠΈΡΠ° Ρ ΡΠΎΠ½ΠΎΠ²ΠΎΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΎΠΉ</head></title> <body background=βimage.jpgβ> <h2> Π€ΠΎΠ½ Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ. </h2> </body> </html>
Π€ΠΎΠ½ΠΎΠ²Π°Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π·Π°Π΄Π°Π½Π°.
ΠΠ° ΡΡΠΎΠΌ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΎ ΡΠ΅Π³Π°Ρ ΠΈ Π°ΡΡΠΈΠ±ΡΡΠ°Ρ , Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΡ Π΄Π»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π° HTML ΡΡΡΠ°Π½ΠΈΡΡ ΡΠ°ΠΉΡΠ°, ΠΈΡΡΠ΅ΡΠΏΠ°Π½Π°.
ΠΠ΅Π»Π°Π΅ΠΌ ΡΠ΄Π°ΡΠΈ!
www.internet-technologies.ru
ΠΠ΅ΡΠ΅Π΄Π²ΠΈΠ³Π°Π΅ΠΌ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ. ΠΠ²ΠΈΠ³Π°Π΅ΠΌ ΡΠΈΡΡΠ½ΠΎΠΊ.
PHP ΡΡΠΎΠΊ β 171ΠΠ° ΠΌΠΎΠΉ Π²Π·Π³Π»ΡΠ΄ ΡΠ°ΠΌΡΠΉ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² Π½ΡΠΆΠ½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΠ΅ —
ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ
CSS (Π°Π½Π³Π». Cascading Style Sheets β ΠΊΠ°ΡΠΊΠ°Π΄Π½ΡΠ΅ ΡΠ°Π±Π»ΠΈΡΡ ΡΡΠΈΠ»Π΅ΠΉ) β ΡΠ΅Ρ Π½ΠΎΠ»ΠΎΠ³ΠΈΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΡ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ Π²ΠΈΠ΄Π° Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°, Π½Π°ΠΏΠΈΡΠ°Π½Π½ΠΎΠ³ΠΎ ΡΠ·ΡΠΊΠΎΠΌ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΈ. ΠΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΠΊΠ°ΠΊ ΡΡΠ΅Π΄ΡΡΠ²ΠΎ ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡ Π² ΡΠΎΡΠΌΠ°ΡΠ΅ HTML ΠΈ XHTML, Π½ΠΎ ΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ Ρ Π»ΡΠ±ΡΠΌΠΈ Π²ΠΈΠ΄Π°ΠΌΠΈ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠΎΠ² Π² ΡΠΎΡΠΌΠ°ΡΠ΅ XML, Π²ΠΊΠ»ΡΡΠ°Ρ SVG ΠΈ XUL.
ΠΠΎΠ»Π΅Π΅ ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΠΎΠ·Π½Π°ΠΊΠΎΠΌΠΈΡΡΡ Ρ CSS ΠΌΠΎΠΆΠ½ΠΎ Π·Π΄Π΅ΡΡ.ΠΠ° ΡΡΠΎ ΡΠ΅ΠΌΡ Π½Π°ΠΏΠΈΡΠ°Π½ΠΎ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΊΠ½ΠΈΠ³, ΠΈΠ·ΡΡΠ°Ρ HTML Π½Π΅Π»ΡΠ·Ρ ΠΎΠ±ΠΎΠΉΡΠΈ CSS ΡΡΠΎ Π½Π΅ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ. Π’Π°ΠΊ ΡΡΠΎ Π½Π°ΡΠΈΠ½Π°Π΅ΡΡΡ Π²ΡΡ Ρ HTML. :)Π― Π½Π°ΡΠ½Ρ ΡΠ°ΡΡΠΊΠ°Π· ΡΠΎ ΠΆΠ΅ Ρ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΡ HTML. ΠΠ°ΠΊ ΠΈΠ·Π²Π΅ΡΡΠ½ΠΎ Π² HTML Π΅ΡΡΡ ΡΠ΅Π³ΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠΎΡΠΌΠΈΡΡΡΡ Π²ΠΈΠ΄ ΡΡΡΠ°Π½ΠΈΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅.
<p></p>
<h2></h2>Β
<div></div>Β
<table></table>
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
<tr></tr>
<th></th>
<td></td>
Π£ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΏΠ°ΡΡ ΡΠ΅Π³ΠΎΠ² Π΅ΡΡΡ ΡΠ²ΠΎΠΈ Π°ΡΡΠΈΠ±ΡΡΡ, Π° Π² ΡΠ²ΠΎΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ° Π΅ΡΡΡ ΡΠ²ΠΎΠΈ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΡ, Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΡΡΠ°Π½ΠΎ, Π½ΠΎ ΡΡΠ° ΡΠ΅ΠΏΠΎΡΠΊΠ° ΠΈΠΌΠ΅Π½Π½ΠΎ ΡΠ°ΠΊ ΠΈ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ. ΠΠ΅ΡΡ ΡΠ΅ΠΊΡΡ Π½Π°Ρ ΠΎΠ΄ΡΡΠΈΠΉΡΡ ΠΌΠ΅ΠΆΠ΄Ρ ΠΏΠ°ΡΠΎΠΉ ΡΠ΅Π³ΠΎΠ² ΠΈΡΠΏΠΎΠ»Π½ΡΠ΅ΡΡΡ ΠΈ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅ ΡΠΎΠ³Π»Π°ΡΠ½ΠΎ ΡΠ·ΡΠΊΠ° HTML ΠΈ ΡΡΠΈΠ»Π΅ΠΌ Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ.
Π‘ΡΠΈΠ»Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ° — ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠΉ ΡΡΠΈΠ»Ρ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΠΏΡΠ΅Π΄ΡΡΠ°Π²Π»Π΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
Π£ Π²ΡΠ΅Ρ ΡΠ΅Π³ΠΎΠ² ΠΎΠΏΠΈΡΠ°Π½Π½ΡΡ Π² Π»ΠΈΡΡΠΈΠ½Π³Π΅ β1 Π΅ΡΡΡ Π°ΡΡΠΈΠ±ΡΡ align ΠΎΠ½ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ Π·Π° ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΈΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²Π΅ ΡΡΡΠ°Π½ΠΈΡΡ ΠΠ ΠΠΠ ΠΠΠΠΠ’ΠΠΠ. Π Π°Π· Π΅ΡΡΡ Π°ΡΡΠΈΠ±ΡΡ ΡΠ΅Π³Π°, Π·Π½Π°ΡΠΈΡ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ ΠΈ Π°ΡΠ³ΡΠΌΠ΅Π½Ρ ΡΡΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°.
ΠΡΠ³ΡΠΌΠ΅Π½ΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° align
ΠΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΏΠΎ ΡΠ΅Π½ΡΡΡ. Π’Π΅ΠΊΡΡ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΎΠΊΠ½Π° Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΠΈΠ»ΠΈ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°, Π³Π΄Π΅ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ ΡΠ΅ΠΊΡΡΠΎΠ²ΡΠΉ Π±Π»ΠΎΠΊ. Π‘ΡΡΠΎΠΊΠΈ ΡΠ΅ΠΊΡΡΠ° ΡΠ»ΠΎΠ²Π½ΠΎ Π½Π°Π½ΠΈΠ·ΡΠ²Π°ΡΡΡΡ Π½Π° Π½Π΅Π²ΠΈΠ΄ΠΈΠΌΡΡ ΠΎΡΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΏΡΠΎΡ ΠΎΠ΄ΠΈΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠΎΠ΄ΠΎΠ±Π½ΡΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ Π°ΠΊΡΠΈΠ²Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°Ρ ΠΈ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ ΠΏΠΎΠ΄ΠΏΠΈΡΡΡ , Π²ΡΠΎΠ΄Π΅ ΠΏΠΎΠ΄ ΡΠΈΡΡΠ½ΠΎΡΠ½ΡΡ , ΠΎΠ½ ΠΏΡΠΈΠ΄Π°Π΅Ρ ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½ΡΠΉ ΠΈ ΡΠΎΠ»ΠΈΠ΄Π½ΡΠΉ Π²ΠΈΠ΄ ΠΎΡΠΎΡΠΌΠ»Π΅Π½ΠΈΡ ΡΠ΅ΠΊΡΡΠ°. ΠΠΎ Π²ΡΠ΅Ρ Π΄ΡΡΠ³ΠΈΡ ΡΠ»ΡΡΠ°ΡΡ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΡΠ΅Π΄ΠΊΠΎ ΠΏΠΎ ΡΠΎΠΉ ΠΏΡΠΈΡΠΈΠ½Π΅, ΡΡΠΎ ΡΠΈΡΠ°ΡΡ Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΎΠ±ΡΠ΅ΠΌ ΡΠ°ΠΊΠΎΠ³ΠΎ ΡΠ΅ΠΊΡΡΠ° Π½Π΅ΡΠ΄ΠΎΠ±Π½ΠΎ.
ΠΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΈΡΠΈΠ½Π΅, ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ ΠΎΠ΄Π½ΠΎΠ²ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠ΅ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ ΠΈ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ. Π§ΡΠΎΠ±Ρ ΠΏΡΠΎΠΈΠ·Π²Π΅ΡΡΠΈ ΡΡΠΎ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ Π±ΡΠ°ΡΠ·Π΅Ρ Π² ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ ΠΏΡΠΎΠ±Π΅Π»Ρ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ.
ΠΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ. Π ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΡΡΡΠΎΠΊΠΈ ΡΠ΅ΠΊΡΡΠ° Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π΅ΡΡΡ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, Π° ΠΏΡΠ°Π²ΡΠΉ ΠΊΡΠ°ΠΉ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Β«Π»Π΅ΡΠ΅Π½ΠΊΠΎΠΉΒ». Π’Π°ΠΊΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ ΡΠ²Π»ΡΠ΅ΡΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΠΌ Π½Π° ΡΠ°ΠΉΡΠ°Ρ , ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ Π»Π΅Π³ΠΊΠΎ ΠΎΡΡΡΠΊΠΈΠ²Π°ΡΡ Π²Π·Π³Π»ΡΠ΄ΠΎΠΌ Π½ΠΎΠ²ΡΡ ΡΡΡΠΎΠΊΡ ΠΈ ΠΊΠΎΠΌΡΠΎΡΡΠ½ΠΎ ΡΠΈΡΠ°ΡΡ Π±ΠΎΠ»ΡΡΠΎΠΉ ΡΠ΅ΠΊΡΡ.
ΠΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ. ΠΡΠΎΡ ΡΠΏΠΎΡΠΎΠ± Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ Π²ΡΡΡΡΠΏΠ°Π΅Ρ Π² ΡΠΎΠ»ΠΈ Π°Π½ΡΠ°Π³ΠΎΠ½ΠΈΡΡΠ° ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌΡ ΡΠΈΠΏΡ. Π ΠΈΠΌΠ΅Π½Π½ΠΎ, ΡΡΡΠΎΠΊΠΈ ΡΠ΅ΠΊΡΡΠ° ΡΠ°Π²Π½ΡΡΡΡΡ ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, Π° Π»Π΅Π²ΡΠΉ ΠΎΡΡΠ°Π΅ΡΡΡ Β«ΡΠ²Π°Π½ΡΠΌΒ». ΠΠ·-Π·Π° ΡΠΎΠ³ΠΎ, ΡΡΠΎ Π»Π΅Π²ΡΠΉ ΠΊΡΠ°ΠΉ Π½Π΅ Π²ΡΡΠΎΠ²Π½Π΅Π½, Π° ΠΈΠΌΠ΅Π½Π½ΠΎ Ρ Π½Π΅Π³ΠΎ Π½Π°ΡΠΈΠ½Π°Π΅ΡΡΡ ΡΡΠ΅Π½ΠΈΠ΅ Π½ΠΎΠ²ΡΡ ΡΡΡΠΎΠΊ, ΡΠ°ΠΊΠΎΠΉ ΡΠ΅ΠΊΡΡ ΡΠΈΡΠ°ΡΡ ΡΡΡΠ΄Π½Π΅Π΅, ΡΠ΅ΠΌ, Π΅ΡΠ»ΠΈ Π±Ρ ΠΎΠ½ Π±ΡΠ» Π²ΡΡΠΎΠ²Π½Π΅Π½ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ. ΠΠΎΡΡΠΎΠΌΡ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΠΎΠ±ΡΡΠ½ΠΎ Π΄Π»Ρ ΠΊΠΎΡΠΎΡΠΊΠΈΡ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² ΠΎΠ±ΡΠ΅ΠΌΠΎΠΌ Π½Π΅ Π±ΠΎΠ»Π΅Π΅ ΡΡΠ΅Ρ ΡΡΡΠΎΠΊ. ΠΡ Π½Π΅ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°Π΅ΠΌ ΡΠΏΠ΅ΡΠΈΡΠΈΡΠ½ΡΠ΅ ΡΠ°ΠΉΡΡ, Π³Π΄Π΅ ΡΠ΅ΠΊΡΡ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ ΡΠΈΡΠ°ΡΡ ΡΠΏΡΠ°Π²Π° Π½Π°Π»Π΅Π²ΠΎ, ΡΠ°ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠΉ ΡΠΏΠΎΡΠΎΠ± Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ ΠΈ ΠΏΡΠΈΠ³ΠΎΠ΄ΠΈΡΡΡ. ΠΠΎ Π³Π΄Π΅ Π²Ρ Ρ Π½Π°Ρ Π² ΡΡΡΠ°Π½Π΅ Π²ΠΈΠ΄Π΅Π»ΠΈ ΡΠ°ΠΊΠΈΠ΅ ΡΠ°ΠΉΡΡ.
ΠΡΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π² ΡΠ°Π±Π»ΠΈΡΠ΅ Ρ ΠΎΡΡΡΡΠΏΠ°ΠΌΠΈ ΡΠΏΡΠ°Π²Π° ΠΈ ΡΠ»Π΅Π²Π°. ΠΠ΄Π΅ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ Π°ΡΡΠΈΠ±ΡΡΡ hspace — ΡΡΠΎ ΠΎΡΡΡΡΠΏΡ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΈ vspace — ΠΎΡΡΡΡΠΏ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ, ΠΏΡΠΈΡΠ΅ΠΌ ΡΡΠ°Π·Ρ Ρ Π΄Π²ΡΡ ΡΡΠΎΡΠΎΠ½ 70->ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°
Π‘ΠΈΠ½ΠΈΠΉ ΠΊΡΠ°ΠΉ ΡΡΠΎ Π³ΡΠ°Π½ΠΈΡΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° (div), ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ Π²Π½ΡΡΡΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π·Π°ΡΡΡΠΈΡ ΠΎΠ²Π°Π½ΠΎ, Π΅ΡΡΡ ΡΠΎ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠ΅ Π½Π°Π΄ΠΎ ΠΎΡΡΡΡΠΏΠΈΡΡ Π²Π½ΡΡΡΠΈ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° ΠΎΡ Π΅Π³ΠΎ Π³ΡΠ°Π½ΠΈΡ (ΡΡΡΠ΅Π»ΠΊΠ°ΠΌΠΈ ΡΠΊΠ°Π·Π°Π½Π° Π²Π΅Π»ΠΈΡΠΈΠ½Π° Π² ΠΏΠΈΠΊΡΠ΅Π»Π°Ρ ). Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΈ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π²Π½ΡΡΡΠΈ Π±Π»ΠΎΠΊΠ°.
ΠΠΈΡΡΠΈΠ½Π³ β 1 — Π Π°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS. Π€Π°ΠΉΠ» ΡΡΠΈΠ»Ρ.
Π Π°ΡΡΠΌΠΎΡΡΠΈΠΌ ΠΏΠΎΠ΄ΡΠΎΠ±Π½Π΅Π΅. ΠΠ΅ΡΠ²ΡΠ΅ Π΄Π²Π΅ ΡΡΡΠΎΠΊΠΈ Π΄Π»Ρ Π½Π°Ρ ΡΠ΅ΠΉΡΠ°Ρ Π½Π΅ Π²Π°ΠΆΠ½Ρ ΠΈΡ ΠΏΡΠΎΠΏΡΡΠΊΠ°Π΅ΠΌ. ΠΠ°Π»Π΅Π΅ ΠΈΠ΄ΡΡ ΡΠΎΡΠΊΠ° — ΡΡΠΎ ΠΎΠ±ΠΎΠ·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ»Π°ΡΡΠ° Π² CSS. ΠΡΠΈΠΌΠ΅ΡΠ½ΠΎ ΡΠΈΡΠ°Π΅ΡΡΡ ΡΠ°ΠΊ: ΠΊΠ»Π°ΡΡ gif ΠΈΠΌΠ΅Π΅Ρ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ:
- padding-top: 200px; — ΡΡΠΎ ΠΎΡΡΡΡΠΏ ΡΠ²Π΅ΡΡ Ρ
- padding-left: 150px; — ΡΡΠΎ ΠΎΡΡΡΡΠΏ ΡΠ»Π΅Π²Π°
- width: 350px; — ΡΡΠΎ ΡΠΈΡΠΈΠ½Π° ΡΠ°ΠΌΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°
- padding-bottom: 47px; — ΡΡΠΎ ΠΎΡΡΡΡΠΏ ΡΠ½ΠΈΠ·Ρ
Π’Π°ΠΊ ΠΆΠ΅ Π΅ΡΡΡ Π°ΡΡΠΈΠ±ΡΡ padding-right: — ΡΡΠΎ ΠΎΡΡΡΡΠΏ ΡΠΏΡΠ°Π²Π°. ΠΡ ΡΠ΅ΠΏΠ΅ΡΡ Π½Π°Π²Π΅ΡΠ½ΠΎ ΡΡΠ°Π»ΠΎ ΠΊΠ°ΡΡΠΈΠ½Π° ΠΏΡΠΎΡΡΠ½ΡΡΡΡ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ΄Π²ΠΈΠ½ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ, Ρ.Π΅. ΠΌΠ΅Π½ΡΡ Π°ΡΠ³ΡΠΌΠ΅Π½ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ², ΡΠ΅ ΡΠ°ΠΌΡΠ΅ ΡΠΈΡΠ΅ΡΠΊΠΈ ΡΡΠΎ ΠΈΠ·ΠΌΠ΅ΡΡΡΡΡΡ Π² ΠΏΠΈΠΊΡΠ΅Π»Π°Ρ , Ρ ΠΎΡΡ ΠΊΡΡΠ°ΡΠΈ ΡΠΎ ΠΆΠ΅ Π½Π΅ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π² Π½ΠΈΡ . ΠΠΎΠΌΠΈΠΌΠΎ ΡΠΎΠ³ΠΎ, ΡΡΠΎ ΠΌΡ ΡΠ°ΡΡΠΌΠΎΡΡΠ΅Π»ΠΈ Π°ΡΡΠΈΠ±ΡΡΡ ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΡΡΡΡ Ρ ΡΠ΅Π³ΠΎΠΌ Π΄ΠΈΠ², ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΡΠ²Π΅ΡΠ°ΡΡ Π·Π° ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΎΠ±ΡΠ΅ΠΊΡΠ° Π²Π½ΡΡΡΠΈ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°. Π‘ΡΡΠ΅ΡΡΠ²ΡΡΡ Π΅ΡΡ Π°ΡΡΠΈΠ±ΡΡΡ ΠΊΠΎΡΠΎΡΡΠ΅ Π² ΡΠ²ΠΎΡ ΠΎΡΠ΅ΡΠ΅Π΄Ρ Π΄Π²ΠΈΠ³Π°ΡΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΡΠ½Π°ΡΡΠΆΠΈ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΡΡΠ°Π½ΠΈΡΡ ΡΡΠΎ margin.
ΠΠΈΡΡΠΈΠ½Π³ β 2 — ΠΡΠΎ Π²Π΅ΡΡ HTML-ΠΊΠΎΠ΄ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΠΉ Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² Π½ΡΠΆΠ½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>Untitled Document</title> <link href="/hio.css" rel="stylesheet" type="text/css"> </head> <body> <div><img src="/images/Avatar1/Ava0002.gif" border=0></div> </body> </html>
ΠΠΈΡΡΠΈΠ½Π³ β 3 — Π’Π°Π±Π»ΠΈΡΠ° CSS ΡΡΠΈΠ»Π΅ΠΉ Π΄Π»Ρ ΠΏΠΎΡΠ»Π΅Π΄Π½Π΅Π³ΠΎ ΠΏΡΠΈΠΌΠ΅ΡΠ°. (Π€Π°ΠΉΠ» hio.css)
Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΠΎΠ²Π°Π½Π½ΡΠ΅ ΡΡΠΎΠΊΠΈ ΡΡΠΎΠ³ΠΎ ΡΠ°Π·Π΄Π΅Π»Π°:ΠΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ
ΡΠ°ΡΠ° 15.03.2012 15:47:46ΠΏΡΠΈΠΊΠΎΠ»ΡΠ½ΡΡΠΉ ΡΠ°ΠΉΡ
lphp.ru
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² html
ΠΠ°Π½Π½Π°Ρ ΡΡΠ°ΡΡΡ Π½Π°ΠΏΠΈΡΠ°Π½Π° ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ Vertex Academy. ΠΡΠΎ ΠΎΠ΄Π½Π° ΠΈΠ· ΡΡΠ°ΡΠ΅ΠΉ ΠΈΠ· Π½Π°ΡΠ΅Π³ΠΎ Π‘Π°ΠΌΠΎΡΡΠΈΡΠ΅Π»Ρ ΠΏΠΎ HTML&CSS. ΠΠ°Π΄Π΅Π΅ΠΌΡΡ, ΡΡΠΎ Π΄Π°Π½Π½Π°Ρ ΡΡΠ°ΡΡΡ ΠΠ°ΠΌ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠ»Π΅Π·Π½Π°. ΠΡΠΈΡΡΠ½ΠΎΠ³ΠΎ ΠΏΡΠΎΡΡΠ΅Π½ΠΈΡ!
ΠΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΌΠΎΠΌΠ΅Π½ΡΠ°Π»ΡΠ½ΠΎ Π΄Π°ΡΡ Π½Π°ΠΌ ΠΏΠΎΠ½ΡΡΡ, Π½Π°ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄Π°Π½Π½ΡΠΉ ΡΠ°ΠΉΡ ΠΈΠ»ΠΈ ΡΡΠ°ΡΡΡ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ Π΄Π»Ρ Π½Π°Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΡΠΌΠΈ, ΡΠΎΠ·Π΄Π°ΡΡ Π½Π°ΡΡΡΠΎΠ΅Π½ΠΈΠ΅, ΠΏΠΎ Π½ΠΎΠ²ΠΎΠΌΡ ΠΌΠΎΠ³ΡΡΒ ΡΠ°ΡΠΊΡΡΡΡ ΡΠ΅ΠΌΡ. ΠΠ½ΠΎΠ³Π΄Π° ΠΎΠ΄Π½ΠΎ ΡΠΎΡΠΎ ΡΡΠΎΠΈΡ ΡΡΡΡΡΠΈ ΡΠ»ΠΎΠ².
ΠΠΎ ΠΈ ΡΠ°ΡΡΠΈΡΡ ΠΈΠΌΠΈ Π½Π΅ ΡΡΠΎΠΈΡ, Π΅ΡΠ»ΠΈ Π²Ρ Π½Π΅ ΠΈΠ½ΡΡΠ°Π³ΡΠ°ΠΌ ΠΈΠ»ΠΈ ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ-ΠΌΠ°Π³Π°Π·ΠΈΠ½. ΠΠ΅Π»Π°ΡΠ΅Π»ΡΠ½ΠΎ, ΡΡΠΎΠ±Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ:
- Π±ΡΠ»ΠΈ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠ²Π½ΡΠΌΠΈ
- ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΎΠ²Π°Π»ΠΈ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΉ Π³Π°ΠΌΠΌΠ΅ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ°
- Π±ΡΠ»ΠΈ ΡΠΌΠ΅ΡΡΠ½Ρ
ΠΡΠ»ΠΈ Ρ Π²Π°Ρ Π½Π΅Ρ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΡΡΠ΅Π³ΠΎ ΡΠΎΡΠΎ, ΠΌΠΎΠΆΠ½ΠΎ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΡΠ°ΠΊ Π½Π°Π·ΡΠ²Π°Π΅ΠΌΡΠΌ ΡΠΎΡΠΎΡΡΠΎΠΊΠΎΠΌ (ΡΠΎΡΠΎΠ±Π°Π½ΠΊΠΎΠΌ) — ΠΌΠ΅ΡΡΠΎΠΌ, Π³Π΄Π΅ Ρ ΡΠ°Π½ΠΈΡΡΡ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, ΠΈΠ»Π»ΡΡΡΡΠ°ΡΠΈΠΉ ΠΈ Π²Π΅ΠΊΡΠΎΡΠ½ΠΎΠΉ Π³ΡΠ°ΡΠΈΠΊΠΈ. Π’Π°ΠΊΠΈΡ ΡΠ΅ΡΡΡΡΠΎΠ² ΠΌΠΎΡΠ΅, Π²Ρ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ Π΄Π°ΠΆΠ΅ ΡΠ»ΡΡΠ°Π»ΠΈ ΠΎΠ± ΠΎΠ΄Π½ΠΎΠΌ ΠΈΠ· ΠΊΡΡΠΏΠ½Π΅ΠΉΡΠΈΡ — Shutterstock, Π½ΠΎ ΡΠΊΠ°ΡΠΈΠ²Π°Π½ΠΈΡ ΡΠ°ΠΌ ΠΏΠ»Π°ΡΠ½ΡΠ΅.
ΠΠ»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ Π½Π΅ Π»ΡΠ±ΠΈΡ ΠΏΠ΅ΡΠ΅ΠΏΠ»Π°ΡΠΈΠ²Π°ΡΡ, Π² ΠΊΠΎΠ½ΡΠ΅ ΡΡΠ°ΡΡΠΈ ΠΌΡ ΠΏΡΠΈΠ³ΠΎΡΠΎΠ²ΠΈΠ»ΠΈ Π±ΠΎΠ½ΡΡ — ΡΠΏΠΈΡΠΎΠΊΒ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ ΡΠΎΡΠΎΠ±Π°Π½ΠΊΠΎΠ², Π³Π΄Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°ΡΠ°ΡΡΒ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΡ ΠΊΡΠ°ΡΠΈΠ²ΡΡ ΠΌΠ°ΡΠ΅ΡΠΈΠ°Π»ΠΎΠ² ΡΠΎΠ²Π΅ΡΡΠ΅Π½Π½ΠΎ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΠΎ π
Π€ΠΎΡΠΌΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ
ΠΠΎ ΠΡΠ΅ΠΌΠΈΡΠ½ΠΎΠΉ ΠΏΠ°ΡΡΠΈΠ½Π΅ Π² ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ 3 Π²ΠΈΠ΄Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ:
gif (Graphics Interchange Format —Β ΡΠΎΡΠΌΠ°Ρ Π΄Π»Ρ ΠΎΠ±ΠΌΠ΅Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ)
ΡΡΠΎ ΠΏΠ΅ΡΠ²ΡΠΉ ΡΠΎΡΠΌΠ°Ρ, ΠΊΠΎΡΠΎΡΡΠΉ Π½Π°ΡΠ°Π» ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π² ΠΈΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅. ΠΠ»ΡΡΡ ΡΠ°ΠΊΠΎΠ³ΠΎ ΡΠΎΡΠΌΠ°ΡΠ°Β — Π½Π°Π»ΠΈΡΠΈΠ΅ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΈ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ ΡΠ°Π·ΠΌΠ΅Ρ, ΡΡΡΠ°Π½ΠΈΡΠ° Π·Π°Π³ΡΡΠΆΠ°Π΅ΡΡΡ Π±ΡΡΡΡΠΎ. Π ΡΠΎΠΌΡ ΠΆΠ΅ ΠΎΠ½ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΡ. ΠΠ΅Π΄ΠΎΡΡΠ°ΡΠΎΠΊ — ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠΎΠ»ΡΠΊΠΎ 256 ΡΠ²Π΅ΡΠΎΠ² (ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠΎΡΠΎΠΌΡ ΠΈ ΡΠ°Π·ΠΌΠ΅Ρ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ), Ρ.Π΅. Π΅Π³ΠΎ Π½Π΅Π»ΡΠ·Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΡΠ²Π΅ΡΠ½ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ.
jpeg, ΠΎΠ½ ΠΆΠ΅ jpg (Joint Photographic Experts Group —Β ΠΠ±ΡΠ΅Π΄ΠΈΠ½Π΅Π½Π½Π°Ρ Π³ΡΡΠΏΠΏΠ° ΡΠΊΡΠΏΠ΅ΡΡΠΎΠ² ΠΏΠΎ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ —Β ΡΠ°ΠΊ Π½Π°Π·ΡΠ²Π°Π΅ΡΡΡ ΠΎΡΠ³Π°Π½ΠΈΠ·Π°ΡΠΈΡ-ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ)
ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΠΎΠ»Π½ΠΎΡΠ²Π΅ΡΠ½ΡΡ , Π²ΡΡΠΎΠΊΠΎΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ. Π Π°Π·ΠΌΠ΅Ρ ΡΠ°ΠΊΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ Π²Π΅Π»ΠΈΠΊ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΎΠ½ΠΈ ΠΎΠ±ΡΡΠ½ΠΎ Π΄Π°ΡΡ Π±ΠΎΠ»ΡΡΡΡ Π½Π°Π³ΡΡΠ·ΠΊΡ Π½Π° ΡΠ΅ΡΠ²Π΅Ρ. ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΡΠΆΠ°ΡΡ jpeg (Π΄Π»Ρ ΠΌΠ΅Π½ΡΡΠ΅Π³ΠΎ Π²Π΅ΡΠ° ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ) ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ Π±ΡΠ°ΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΡΠΎΠ³ΠΎΠ²ΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΊΡΠ°ΡΠ½ΡΠΉ Π²ΠΎΡΡΠΌΠΈ, ΡΠ°ΠΊ ΠΏΠΎΡΠ΅ΡΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π° Π±ΡΠ΄ΡΡ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΠΌΠΈ.
png (Portable Network Graphics —Β ΠΠΎΡΡΠ°ΡΠΈΠ²Π½Π°Ρ ΡΠ΅ΡΠ΅Π²Π°Ρ Π³ΡΠ°ΡΠΈΠΊΠ°. ΠΡΠΎΠΈΠ·Π½ΠΎΡΠΈΡΡΡ ΡΠ°ΠΊ ΠΆΠ΅ ΠΊΠ°ΠΊ ping, Ρ.Π΅. [pΙͺΕ])
ΡΡΠΎΡ ΡΠΎΡΠΌΠ°Ρ ΠΈΠ·Π½Π°ΡΠ°Π»ΡΠ½ΠΎ ΡΠ°Π·ΡΠ°Π±Π°ΡΡΠ²Π°Π»ΡΡ Π΄Π»Ρ Π²Π΅Π±Π°, Ρ.Π΅. ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΎΠ±ΡΡΠ½ΠΎ ΠΌΠ°Π»ΠΎ «Π²Π΅ΡΠΈΡ» ΠΈ Π½Π΅ ΡΠΎΡΠΌΠΎΠ·ΠΈΡ ΡΡΡΠ°Π½ΠΈΡΡ ΠΏΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠ΅. ΠΡΠΎΡ ΡΠΎΡΠΌΠ°Ρ ΡΠΎΠ·Π΄Π°Π½ Π½Π° Π·Π°ΠΌΠ΅Π½Ρ ΡΡΡΠ°ΡΠ΅Π²ΡΠ΅Π³ΠΎ gif, Π½ΠΎ Π² ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ Π½Π΅Π³ΠΎ, Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ. Png-8, ΠΊΠ°ΠΊ ΠΈ gif, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π²ΡΠ΅Π³ΠΎ 256 ΡΠ²Π΅ΡΠΎΠ². Π€ΠΎΡΠΌΠ°Ρ png-24 ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΒ 16 ΠΌΠ»Π½ ΡΠ²Π΅ΡΠΎΠ², ΠΏΡΠ°Π²Π΄Π° ΠΈ Π²Π΅ΡΒ ΡΠΆΠ΅ Π½Π΅ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΠΉ. Png-32 ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΡΡΠΎΠ»ΡΠΊΠΎ ΠΆΠ΅ ΡΠ²Π΅ΡΠΎΠ², ΠΊΠ°ΠΊ ΠΈ png-24, ΠΈ ΠΏΠ»ΡΡ ΠΊ ΡΡΠΎΠΌΡΒ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎΠ»ΡΡΠΈΡΡΒ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΡΠΌ ΡΠΎΠ½ΠΎΠΌ, ΠΏΡΠΈΡΠ΅ΠΌ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΅Π³ΡΠ»ΠΈΡΠΎΠ²Π°ΡΡ ΡΡΠ΅ΠΏΠ΅Π½Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΠΎΡΡΠΈ.Β ΠΡΠΈ ΡΠΌΠ΅Π½ΡΡΠ΅Π½ΠΈΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠ²Β png Π½Π΅ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΠΏΠΎΡΠ΅ΡΠΈ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠ²Π΅ΡΠ°.
ΠΠΎΠ΄ΡΡΠΎΠΆΠΈΠΌ
gif —Β Π΄Π»Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ
jpeg — Π΄Π»Ρ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ
pngΒ — Π΄Π»Ρ ΠΈΠΊΠΎΠ½ΠΎΠΊ, ΠΊΠ½ΠΎΠΏΠΎΠΊ, ΡΠΎΠ½ΠΎΠ²,Β Π»ΠΎΠ³ΠΎΡΠΈΠΏΠΎΠ², ΡΠΊΡΠΈΠ½ΡΠΎΡΠΎΠ², ΡΠ΅ΡΡΠ΅ΠΆΠ΅ΠΉ, ΡΠ΅ΠΊΡΡΠΎΠ², ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ Ρ ΠΏΡΠΎΠ·ΡΠ°ΡΠ½ΡΠΌ ΡΠΎΠ½ΠΎΠΌ
ΠΡΡΠ°Π²ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² html-ΡΠ°ΠΉΠ»
ΠΠ»Ρ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ΅Π³ <img> (ΠΎΡ Π°Π½Π³Π». image — ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°). ΠΡΠΎ ΠΎΠ΄ΠΈΠ½ΠΎΡΠ½ΡΠΉ ΡΠ΅Π³, Π΅ΠΌΡ Π½Π΅ Π½ΡΠΆΠ΅Π½ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ.Β ΠΠ½ΡΡΡΠΈ ΡΡΠΎΠ³ΠΎ ΡΠ΅Π³Π° ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡΡΒ Π°ΡΡΠΈΠ±ΡΡΡ.
ΠΡΡΠΈΠ±ΡΡΒ srcΒ (ΠΎΡ Π°Π½Π³Π». source — ΠΈΡΡΠΎΡΠ½ΠΈΠΊ) ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ (ΠΌΠ΅ΡΡΠΎ, Π³Π΄Π΅ Π»Π΅ΠΆΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅). ΠΡΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π»Π΅ΠΆΠΈΡ Ρ Π²Π°Ρ Π½Π° ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ΅ (ΠΏΠΎΠΊΠ° ΡΠ°ΠΉΡ ΡΠΎΠ»ΡΠΊΠΎ Π² ΠΏΡΠΎΡΠ΅ΡΡΠ΅ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ) ΠΈΠ»ΠΈ Π½Π° Π²Π°ΡΠ΅ΠΌ ΡΠ΅ΡΠ²Π΅ΡΠ΅ — ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΡΡΠ»ΠΊΡ. ΠΡΠ»ΠΈ ΠΈΠΌΠΈΠ΄ΠΆ ΠΈΠ· ΡΠ΅ΡΠΈ, ΡΠΎΠ³Π΄Π° Π½ΡΠΆΠ½Π° Π°Π±ΡΠΎΠ»ΡΡΠ½Π°Ρ ΡΡΡΠ»ΠΊΠ°. ΠΠ°ΠΊ ΡΡΠΎ ΡΠ΄Π΅Π»Π°ΡΡΒ ΡΠΈΡΠ°ΠΉΡΠ΅ Π² ΡΡΠ°ΡΡΠ΅ «Π‘ΡΡΠ»ΠΊΠΈ».
ΠΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ ΡΠ°ΠΉΡΠ° Ρ Π½ΡΠ»Ρ ΡΠΎΠ²Π΅ΡΡΠ΅ΠΌΒ ΡΠΎΠ·Π΄Π°ΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΡ ΠΏΠ°ΠΏΠΊΡ Π΄Π»Ρ Ρ ΡΠ°Π½Π΅Π½ΠΈΡ ΠΈΠΌΠΈΠ΄ΠΆΠ΅ΠΉ. Π’Π°ΠΊ Π²Π°ΠΌ Π±ΡΠ΄Π΅Ρ ΠΏΡΠΎΡΠ΅ ΡΠΏΡΠ°Π²Π»ΡΡΡ Π²ΡΠ΅ΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ, ΠΊΠΎΠ³Π΄Π° Π²Π°Ρ ΡΠ°ΠΉΡ ΡΠ°Π·ΡΠ°ΡΡΠ΅ΡΡΡ.
Β
ΠΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊ Π²Π°ΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅, Π½ΡΠΆΠ½ΠΎ Π½Π°ΠΏΠΈΡΠ°ΡΡ ΡΠ°ΠΊΠΎΠΉ ΠΊΠΎΠ΄:
<img src=»ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ»>
<img src=»ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ»> |
ΠΡΡΠΈΠ±ΡΡΒ alt (ΠΎΡ Π°Π½Π³Π». alternative — Π°Π»ΡΡΠ΅ΡΠ½Π°ΡΠΈΠ²Π°) ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠ΅ΠΊΡΡ, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ²ΠΈΠ΄ΠΈΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ, Π΅ΡΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ Π·Π°Π³ΡΡΠ·ΠΈΡΡΡ. ΠΠ΅ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΡΠΊΠ°Π·Π°Π½ ΠΏΡΡΡ, ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ΄Π°Π»Π΅Π½Π°, ΠΏΠ»ΠΎΡ ΠΎΠΉ ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ — ΠΏΡΠΈΡΠΈΠ½ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΠΌΠ½ΠΎΠ³ΠΎ, ΠΈ ΠΆΠ΅Π»Π°ΡΠ΅Π»ΡΠ½ΠΎ, ΡΡΠΎΠ±Ρ ΡΠ΅Π»ΠΎΠ²Π΅ΠΊ ΠΏΠΎΠ½ΡΠ», ΡΡΠΎ ΠΆΠ΅ ΠΊΡΠΎΠ΅ΡΡΡ Π·Π° ΡΡΠΎΠΉ Π½Π΅Π½Π°Π²ΠΈΡΡΠ½ΠΎΠΉ ΠΈΠΊΠΎΠ½ΠΊΠΎΠΉ.
ΠΠΎΠΈΡΠΊΠΎΠ²ΠΈΠΊΠΈ ΠΎΠ±ΡΠ°ΡΠ°ΡΡ ΠΏΡΠΈΡΡΠ°Π»ΡΠ½ΠΎΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΡΠΎ, ΡΡΠΎΠ±Ρ ΡΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ Π±ΡΠ» Π·Π°ΠΏΠΎΠ»Π½Π΅Π½. Π html Π²Π°Π»ΠΈΠ΄Π°ΡΠΎΡ (ΡΠ΅ΡΡΡΡ Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΊΠΎΠ΄Π° Π½Π° ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎΡΡΡ) Π²ΠΎΡΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΡΡΡΡΡΠ²ΠΈΠ΅Β Π°ΡΡΠΈΠ±ΡΡΠ° alt ΠΊΠ°ΠΊ ΠΎΡΠΈΠ±ΠΊΡ. ΠΡΠ»ΠΈ ΠΆΠ΅ Π²ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ <alt> Π±ΡΠ΄ΡΡ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½Ρ, Π΄Π° Π΅ΡΠ΅ ΠΈ ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ ΠΏΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ ΠΊΠ»ΡΡΠ΅Π²ΡΠ΅ ΡΠ»ΠΎΠ²Π° — Π²ΠΈΠ΄ΠΈΠΌΠΎΡΡΡΒ Π²Π°ΡΠ΅Π³ΠΎ ΡΠ°ΠΉΡΠ° ΠΎΡΡΡΠΈΠΌΠΎ ΠΏΠΎΠ²ΡΡΠΈΡΡΡ, Ρ.Π΅. Π΅Π³ΠΎ ΡΠ°ΡΠ΅ Π±ΡΠ΄ΡΡ ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡ Π½Π° ΠΏΠΎΠΈΡΠΊΠ΅. ΠΡΠΎ ΠΈΠ· ΠΎΠ±Π»Π°ΡΡΠΈ SEO, Π° Π½Π° Π΄Π°Π½Π½ΠΎΠΌ ΡΡΠ°ΠΏΠ΅ Π½Π°ΠΌ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π·Π½Π°ΡΡ, ΡΡΠΎ Π΅ΡΡΡ ΡΠ°ΠΊΠΎΠΉ Π°ΡΡΠΈΠ±ΡΡ, ΠΈ Ρ «ΠΆΠΈΠ²ΠΎΠ³ΠΎ» ΡΠ°ΠΉΡΠ° ΠΎΠ½ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½. ΠΠΎΠΊΠ° ΡΠ°ΠΉΡ Π»Π΅ΠΆΠΈΡ Ρ Π½Π°Ρ Π½Π° Π΄ΠΈΡΠΊΠ΅ — Π΅Π³ΠΎ Π²ΠΏΠΎΠ»Π½Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΏΡΡΡΡΠΌ.
Π ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π½ΠΈΠΆΠ΅ ΠΌΡ ΡΠΌΡΡΠ»Π΅Π½Π½ΠΎ ΡΠΊΠ°Π·Π°Π»ΠΈ Π½Π΅ΡΡΡΠ΅ΡΡΠ²ΡΡΡΠΈΠΉ ΠΏΡΡΡ Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΡΡΠΎΠ±Ρ Π²Ρ ΡΠ²ΠΈΠ΄Π΅Π»ΠΈ, ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π°ΡΡΠΈΠ±ΡΡ alt
ΠΡΡΠΎΡΠ° ΠΈ ΡΠΈΡΠΈΠ½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ
Π’Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, Π΅ΡΠ»ΠΈ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½Π°Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π½Π°ΠΏΡ. Π±ΠΎΠ»ΡΡΠ΅, ΡΠ΅ΠΌ Π²Π°ΠΌ Π½ΡΠΆΠ½Π°.
Π HTML5 ΡΡΠΎ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΡΡΡ Π΄Π΅Π»Π°ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS ΠΈΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡΠ° style, Π²ΠΎΡ ΡΠ°ΠΊ:
Π Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ Π²Π·ΡΠ»ΠΈ 30% ΠΎΡ ΡΠΈΡΠΈΠ½Ρ, Π½ΠΎ Π½Π΅ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΈΠΌΠΈΠ΄ΠΆΠ°, Π° ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΎΠΊΠ½Π° Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΠΎΠ³Π΄Π° ΡΠΈΡΠΈΠ½Π° = 100%, ΡΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π½Π° Π²ΡΡ ΡΠΈΡΠΈΠ½Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΠ°ΠΏΠΎΠΌΠ½ΠΈΡΠ΅ ΡΡΡ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΡ ΠΏΡΠΎΡΠ΅Π½ΡΠΎΠ², ΠΊΠ°ΠΊ Π΅Π΄ΠΈΠ½ΠΈΡΡ ΠΈΠ·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ.
ΠΡΡΠ°ΡΠΈ, Π΅ΡΠ»ΠΈ Π±Ρ ΠΌΡ Π½Π°ΠΏΠΈΡΠ°Π»ΠΈ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΈΡΠΈΠ½Ρ, ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ Π±ΡΠ» Π±Ρ ΡΠΎΡ ΠΆΠ΅, ΠΏΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅:
<img src=»https://vertex-academy.com/tutorials/wp-content/uploads/2016/07/panda.jpg» alt=»ΠΏΠ°Π½Π΄Π° Π½Π° Π΄Π΅ΡΠ΅Π²Π΅»>
<img src=»https://vertex-academy.com/tutorials/wp-content/uploads/2016/07/panda.jpg» alt=»ΠΏΠ°Π½Π΄Π° Π½Π° Π΄Π΅ΡΠ΅Π²Π΅»> |
Π’Π°ΠΊΠΆΠ΅ ΡΠΈΡΠΈΠ½Ρ ΠΈ Π²ΡΡΠΎΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π·Π°Π΄Π°Π²Π°ΡΡ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
.Β Π ΡΠ»ΡΡΠ°Π΅ Ρ Π½Π°ΡΠ΅ΠΉ ΠΏΠ°Π½Π΄ΠΎΠΉ, Ρ ΠΊΠΎΡΠΎΡΠΎΠΉ ΠΈΡΡ
ΠΎΠ΄Π½ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡ 1196 Ρ
796 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ, ΡΡΠΎΠ±Ρ ΠΏΡΠΈ ΡΠΆΠ°ΡΠΈΠΈ ΠΆΠΈΠ²ΠΎΡΠ½ΠΎΠ΅ Π½Π΅ ΠΏΠΎΡΡΡΠ°Π΄Π°Π»ΠΎ, Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠΎΡ
ΡΠ°Π½ΠΈΡΡ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΈ, Π° Π·Π΄Π΅ΡΡ Π±Π΅Π· ΠΊΠ°Π»ΡΠΊΡΠ»ΡΡΠΎΡΠ° Π½Π΅ ΠΎΠ±ΠΎΠΉΠ΄Π΅ΡΡΡΡ. ΠΠΎΠΏΡΡΡΠΈΠΌ, ΠΌΡ Ρ
ΠΎΡΠΈΠΌ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² 3 ΡΠ°Π·Π°, ΡΠΎΠ³Π΄Π° Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ ΡΠ°Π·ΠΌΠ΅ΡΡ 399 Ρ
265 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ.
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Π΅ΡΠ»ΠΈ ΠΌΡ ΡΠ²Π΅Π»ΠΈΡΠΈΠ²Π°Π΅ΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΡΠΎΠΏΠΎΡΡΠΈΠΎΠ½Π°Π»ΡΠ½ΠΎ, ΡΠΎ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΡΠΊΠ°Π·Π°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡ, Π½Π°ΠΏΡ. ΡΠΈΡΠΈΠ½Ρ.Β Π£ΠΌΠ½ΡΠΉ Π±ΡΠ°ΡΠ·Π΅Ρ ΡΠ°ΠΌ Π²ΡΡΠΈΡΠ»ΠΈΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠ°Π·ΠΌΠ΅ΡΒ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ.
ΠΠΎΠΏΡΠΎΠ±ΡΠΉΡΠ΅ Π·Π°ΠΏΡΡΡΠΈΡΡ ΡΠ°ΠΊΠΎΠΉ ΠΊΠΎΠ΄ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅ Π½Π° ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ:
<img src=»https://vertex-academy.com/tutorials/wp-content/uploads/2016/07/panda.jpg» alt=»ΠΏΠ°Π½Π΄Π° Π½Π° Π΄Π΅ΡΠ΅Π²Π΅»>
<img src=»https://vertex-academy.com/tutorials/wp-content/uploads/2016/07/panda.jpg» alt=»ΠΏΠ°Π½Π΄Π° Π½Π° Π΄Π΅ΡΠ΅Π²Π΅»> |
Β
ΠΡΠ΅Π³Π΄Π° ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΠΉΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠ±ΡΡΠ½ΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π³ΡΡΠ·ΡΡΡΡ Π΄ΠΎΠ»ΡΡΠ΅, ΡΠ΅ΠΌ ΠΎΡΡΠ°Π»ΡΠ½ΠΎΠΉ html-ΠΊΠΎΠ΄. ΠΡΠ»ΠΈ Π±ΡΠ°ΡΠ·Π΅Ρ Π±ΡΠ΄Π΅Ρ Π·Π½Π°ΡΡ, ΡΠΊΠΎΠ»ΡΠΊΠΎ ΠΌΠ΅ΡΡΠ° ΡΠ΅Π·Π΅ΡΠ²ΠΈΡΠΎΠ²Π°ΡΡ Π½Π° ΠΈΠΌΠΈΠ΄ΠΆΠΈ, ΠΎΠ½ ΡΠΌΠΎΠΆΠ΅Ρ ΠΏΡΠΎΠ΄ΠΎΠ»ΠΆΠΈΡΡ Π·Π°Π³ΡΡΠ·ΠΊΡ ΡΠ°ΠΉΡΠ° Π½Π΅ Π΄ΠΎΠΆΠΈΠ΄Π°ΡΡΡ, ΠΏΠΎΠΊΠ° Π·Π°Π³ΡΡΠ·ΡΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.
ΠΠ΅ΠΌΠ½ΠΎΠΆΠΊΠΎ Π½Π°ΡΡΠ°Π»ΠΈΠ½Π°
ΠΡΠ»ΠΈ Π²Π°ΠΌ Π΄ΠΎΠ²Π΅Π΄Π΅ΡΡΡ ΠΊΠΎΠ²ΡΡΡΡΡΡΡ Π² ΠΊΠΎΠ΄Π΅ ΡΠ°ΠΉΡΠ°, ΡΠΎΠ·Π΄Π°Π½Π½ΠΎΠ³ΠΎ Π½Π° HTML-4 ΠΈΠ»ΠΈ Π΅ΡΠ΅ Π±ΠΎΠ»Π΅Π΅ ΡΠ°Π½Π½ΠΈΡ , ΡΠΎ Π²Ρ Π·Π°ΠΌΠ΅ΡΠΈΡΠ΅, ΡΡΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ² width ΠΈ height. ΠΡΠΎ ΡΡΡΠ°ΡΠ΅Π²ΡΠΈΠΉ ΠΌΠ΅ΡΠΎΠ΄, Ρ ΠΎΡΡ Π²ΡΡ Π΅ΡΠ΅ Π²Π°Π»ΠΈΠ΄Π½ΡΠΉ Π² HTML5. Π’Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅ ΡΠΎΠ²Π΅ΡΡΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ style, Ρ.ΠΊ. Π½Π° Π°ΡΡΠΈΠ±ΡΡΡΒ width ΠΈ height ΠΌΠΎΠ³ΡΡ Π²Π»ΠΈΡΡΡ Π²Π½ΡΡΡΠ΅Π½Π½ΠΈΠ΅ ΠΈΠ»ΠΈ Π²Π½Π΅ΡΠ½ΠΈΠ΅ ΡΡΠΈΠ»ΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ΄ΡΡ ΠΆΠΈΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅ ΠΈΠ»ΠΈ Π²Π°ΡΠ΅ΠΌ CSS-ΡΠ°ΠΉΠ»Π΅. ΠΡ ΠΎΡΡΠ°Π½ΠΎΠ²ΠΈΠΌΡΡ Π½Π° ΡΡΠΎΠΌ Π΄Π΅ΡΠ°Π»ΡΠ½Π΅ΠΉ, ΠΊΠΎΠ³Π΄Π° Π±ΡΠ΄Π΅ΠΌ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ CSS, Π° ΠΏΠΎΠΊΠ° ΠΏΡΠΎΡΡΠΎ ΠΏΠΎΡΠΌΠΎΡΡΠΈΡΠ΅ ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊΠ°ΠΊ ΡΡΠΈΠ»ΠΈ Π²Π»ΠΈΡΡΡ Π½Π° Π°ΡΡΠΈΠ±ΡΡΡ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ.
Π ΡΡΠΎΠΌ ΠΎΠΊΠ½Π΅ 3 Π²ΠΊΠ»Π°Π΄ΠΊΠΈ: Π½Π° ΠΏΠ΅ΡΠ²ΠΎΠΉ Π²Ρ Π²ΠΈΠ΄ΠΈΡΠ΅ html-ΠΊΠΎΠ΄, Π½Π° 2-ΠΉ ΠΊΠΎΠ΄ CSS, Π½Ρ Π° Π½Π° ΠΏΠΎΡΠ»Π΅Π΄Π½Π΅ΠΉ — ΠΊΠ°ΠΊ Π²ΡΠ΅Π³Π΄Π° ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ. ΠΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ, ΠΊΠ°ΠΊ Π΅ΡΠ»ΠΈ Π±Ρ ΠΏΠ΅ΡΠ²Π°Ρ Π²ΠΊΠ»Π°Π΄ΠΊΠ° Π±ΡΠ»Π° ΡΠ°ΠΉΠ»ΠΎΠΌ index.html, Π²ΡΠΎΡΠ°Ρ — ΡΠ°ΠΉΠ»ΠΎΠΌ style.css, Π° ΡΡΠ΅ΡΡΡ Π±ΡΠ°ΡΠ·Π΅ΡΠΎΠΌ. Π’Π°ΠΊ Π²ΠΎΡ, ΡΠ΅ΠΉΡΠ°Ρ Π² Π½Π°ΡΠ΅ΠΌ CSS Π½Π°ΠΏΠΈΡΠ°Π½ΠΎ, ΡΡΠΎ Π²ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Ρ ΡΠ΅Π³ΠΎΠΌ img ΠΈΠΌΠ΅ΡΡ ΡΠΈΡΠΈΠ½Ρ 100%. Π Π°Π·ΠΌΠ΅ΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠ²Β width ΠΈ height ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ , ΠΏΠΎΡΡΠΎΠΌΡ Π·Π΄Π΅ΡΡ Π½Π΅ Π½Π°Π΄ΠΎ Π΄ΠΎΠΏΠΈΡΡΠ²Π°ΡΡ Π½ΠΈΠΊΠ°ΠΊΠΈΡ Π΅Π΄ΠΈΠ½ΠΈΡ.
Π Π°Π·Π½ΠΈΡΠ° Π² ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ΅ Π½Π° Π»ΠΈΡΠΎ π
Π’Π°ΠΊΠΆΠ΅ Π² ΡΡΠ°ΡΡΡ Π²Π΅ΡΡΠΈΡΡ html ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈΡΡ ΡΠ°ΠΊΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ:
align, Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π»ΠΎΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΈΠ»ΠΈ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ.
hspace — ΠΎΡΡΡΡΠΏ ΡΠ»Π΅Π²Π° ΠΈ ΡΠΏΡΠ°Π²Π° ΠΎΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π΄ΠΎ ΠΎΠΊΡΡΠΆΠ°ΡΡΠ΅Π³ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° (Π½Π°ΠΏΡ. ΡΠ΅ΠΊΡΡΠ° ΠΈΠ»ΠΈ ΡΠΎΡΠ΅Π΄Π½Π΅ΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ)
vspace — ΠΎΡΡΡΡΠΏ ΡΠ²Π΅ΡΡ Ρ ΠΈ ΡΠ½ΠΈΠ·Ρ ΠΎΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π΄ΠΎ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠ° Π²ΠΎΠΊΡΡΠ³.
border — Π·Π°Π΄Π°Π²Π°Π» ΡΠΎΠ»ΡΠΈΠ½Ρ ΡΠ°ΠΌΠΊΠΈ Π²ΠΎΠΊΡΡΠ³ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ (ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠ½Π° ΡΠ°Π²Π½Π° Π½ΡΠ»Ρ)
Π‘Π΅ΠΉΡΠ°Ρ Π²ΡΠ΅ ΡΡΠΈ ΠΌΠ°Π½ΠΈΠΏΡΠ»ΡΡΠΈΠΈ (ΠΈ Π³ΠΎΡΠ°Π·Π΄ΠΎ Π±ΠΎΠ»ΡΡΠ΅) Π΄Π΅Π»Π°ΡΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ CSS, ΠΏΠΎΡΡΠΎΠΌΡΒ ΠΌΡ ΡΠ΅ΡΠΈΠ»ΠΈ Π·Π΄Π΅ΡΡ Π½Π΅ Π·Π°Π±ΠΈΠ²Π°ΡΡ Π²Π°ΠΌ ΡΡΠΈΠΌ Π³ΠΎΠ»ΠΎΠ²Ρ. ΠΡΠ»ΠΈ Π²ΡΠ΅ ΠΆΠ΅ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎ, ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ ΡΡΠΈΠΌΠΈ Π°ΡΡΠΈΠ±ΡΡΠ°ΠΌΠΈ — ΠΏΠΈΡΠΈΡΠ΅ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ , ΠΌΡ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΡΡΠΎΡ ΠΏΡΠ½ΠΊΡ π
Π Π°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π² ΠΊΠΎΠ΄Π΅
ΠΡ ΡΠΎΠ³ΠΎ, Π³Π΄Π΅ ΠΌΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΠΌ Π½Π°Ρ ΡΠ΅Π³ <img> Π·Π°Π²ΠΈΡΠΈΡ ΡΠΎ, ΠΊΠ°ΠΊ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅.
ΠΡΠΈΠΌΠ΅Ρ β1 — ΠΏΠ΅ΡΠ΅Π΄ ΠΏΠ°ΡΠ°Π³ΡΠ°ΡΠΎΠΌ:
Π’Π°ΠΊΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΊΠ°ΠΊ <p> ΠΈ <h2> ΠΎΡΠ½ΠΎΡΡΡΡΡ ΠΊ Π±Π»ΠΎΡΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌ. ΠΠ½ΠΈ Π²ΡΠ΅Π³Π΄Π° Π½Π°ΡΠΈΠ½Π°ΡΡΡΡ Ρ Π½ΠΎΠ²ΠΎΠΉ ΡΡΡΠΎΠΊΠΈ ΠΈ Π·Π°Π½ΠΈΠΌΠ°ΡΡ Π²ΡΡ Π΄ΠΎΡΡΡΠΏΠ½ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΎΠΊΠ½Π° Π±ΡΠ°ΡΠ·Π΅ΡΠ°. ΠΡΠ»ΠΈ ΡΠ½Π°ΡΠ°Π»Π° ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ <img>, Π° ΠΏΠΎΡΠ»Π΅ Π½Π΅Π³ΠΎ Π±Π»ΠΎΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΏΠ°ΡΠ°Π³ΡΠ°Ρ, ΡΠΎ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΠΏΠ΅ΡΠ΅Π½Π΅ΡΠ΅Π½ Π½Π° ΡΠ»Π΅Π΄ΡΡΡΡΡΒ ΡΡΡΠΎΠΊΡ.
ΠΡΠΈΠΌΠ΅Ρ β2 — Π² Π½Π°ΡΠ°Π»Π΅ ΠΏΠ°ΡΠ°Π³ΡΠ°ΡΠ°
<img> ΡΡΠΎ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΎΠ½ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅ΡΡΡ Π²Π½ΡΡΡΠΈ Π±Π»ΠΎΡΠ½ΠΎΠ³ΠΎ ΠΈ Π½Π΅ Π½Π°ΡΠΈΠ½Π°Π΅Ρ Π½ΠΎΠ²ΡΡ ΡΡΡΠΎΡΠΊΡ. Π ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π²ΡΡΠ΅ ΡΠ΅ΠΊΡΡ ΠΎΠ±ΡΠ΅ΠΊΠ°Π΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΊΠΎΠ΄ <img> ΠΏΡΠΎΠΏΠΈΡΠ°Π½ Π²Π½ΡΡΡΠΈ <p>
ΠΠΎΠ΄ΠΏΠΈΡΠΈ ΠΊ ΠΈΠ»Π»ΡΡΡΡΠ°ΡΠΈΡΠΌ
Π§ΡΠΎΠ±Ρ ΠΏΠΎΠΌΠ΅ΡΠΈΡΡ ΠΈΠ»ΠΈ ΠΏΠΎΠ΄ΠΏΠΈΡΠ°ΡΡ ΡΠΎΡΠΎ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡΒ ΡΠ΅Π³ <figure> (ΠΎΡ Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΎΠ³ΠΎ figure — ΡΠΈΡΡΠ½ΠΎΠΊ). ΠΡΠΎΡ ΡΠ΅Π³ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π½Π° ΡΠΎ, ΡΡΠΎ Π²Π½ΡΡΡΠΈ Π½Π΅Π³ΠΎ ΠΏΠΎΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΠΊΠΎΠ½ΡΠ΅Π½Ρ ΡΠΈΠΏΠ° ΠΈΠ»Π»ΡΡΡΡΠ°ΡΠΈΠΉ, ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, Π΄ΠΈΠ°Π³ΡΠ°ΠΌΠΌ ΠΈ Ρ.ΠΏ.
Π’Π΅Π³ <figcaption> (Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΡΠΈΡΡΠ½ΠΊΠ°) ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΏΠΎΠ΄ΠΏΠΈΡΡ ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠΎΡ ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ:
ΠΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Ρ Π±ΡΠ°ΡΠ·Π΅ΡΠ° ΡΡΡΠ΅ΡΡΠ²ΡΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΡΡΠΈΠ»Ρ Π΄Π»Ρ ΡΠ΅Π³Π°Β <figure>, Π² ΡΠ°ΡΡΠ½ΠΎΡΡΠΈ ΡΠ»Π΅Π²Π° ΠΈ ΡΠΏΡΠ°Π²Π° Π΅ΡΡΡ ΠΎΡΡΡΡΠΏΡ ΠΏΠΎ 40 px.Β
Β
ΠΡΠ°ΠΊ, ΠΌΡ Ρ Π²Π°ΠΌΠΈ Π½Π°ΡΡΠΈΠ»ΠΈΡΡ
- Π΄ΠΎΠ±Π°Π²Π»ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ: Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ΅Π³Π° <img>
- ΡΠ·Π½Π°Π»ΠΈ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΡΠ΅Π³Π°: src Π΄Π»Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΡ ΠΏΡΡΠΈ ΠΈ alt Π΄Π»Ρ ΠΎΠΏΠΈΡΠ°Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ
- ΠΏΠΎΠ½ΡΠ»ΠΈ ΠΊΠ°ΠΊΠΎΠΉ ΡΠΎΡΠΌΠ°Ρ Π»ΡΡΡΠ΅ Π΄Π»Ρ ΡΠ΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ: jpeg Π΄Π»Ρ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, png Π΄Π»Ρ Π»ΠΎΠ³ΠΎΡΠΈΠΏΠΎΠ² ΠΈ ΡΠΊΡΠΈΠ½ΡΠΎΡΠΎΠ², gif Π΄Π»Ρ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ
- ΠΊΠ°ΠΊ Π»ΡΡΡΠ΅ Π·Π°Π΄Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡ: Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠ° style Ρ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ°ΠΌΠΈ width ΠΈ height
- ΡΠ°Π·ΠΎΠ±ΡΠ°Π»ΠΈΡΡ ΠΊΠ°ΠΊ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΌΠ΅ΡΡΠ° Π² ΠΊΠΎΠ΄Π΅: ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎ, Π΅ΡΠ»ΠΈ ΠΏΠ΅ΡΠ΅Π΄ Π±Π»ΠΎΡΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ ΠΈ Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°Π½ΠΈΠ΅ΠΌ, Π΅ΡΠ»ΠΈ Π²Π½ΡΡΡΠΈ Π±Π»ΠΎΡΠ½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ <p>)
Π ΡΡΠΎΠ±Ρ Π½Π°ΠΌ Π±ΡΠ»ΠΎ Ρ ΡΠ΅ΠΌ ΡΠ°Π±ΠΎΡΠ°ΡΡ, Π½ΡΠΆΠ½ΠΎ ΠΎΡΠΊΡΠ΄Π°-ΡΠΎ Π²Π·ΡΡΡ ΡΡΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ, ΠΏΡΠΈ ΡΡΠΎΠΌ Π½Π΅ Π½Π°ΡΡΡΠΈΠ² Π½ΠΈΡΡΠΈΡ Π°Π²ΡΠΎΡΡΠΊΠΈΡ ΠΏΡΠ°Π².
ΠΠ½Π°ΡΠΈΡ, ΠΏΡΠΈΡΠ»ΠΎ Π²ΡΠ΅ΠΌΡ Π±ΠΎΠ½ΡΡΠ° π
Β
Π‘ΠΏΠΈΡΠΎΠΊ Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΡΠΎΡΠΎΠ±Π°Π½ΠΊΠΎΠ²Β
ΠΡΠ΅ΠΆΠ΄Π΅, ΡΠ΅ΠΌ Π½Π°ΡΠ½ΡΠΌ, ΠΎΠ±ΡΠ°ΡΠΈΡΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠΊΡΠΈΠ½ΡΠΎΡ Π·Π΄Π΅ΡΡ — ΡΡΠΎ ΡΡΡΠ»ΠΊΠ° Π½Π° ΡΠ°ΠΉΡ. ΠΠ°ΠΊ Π΄Π΅Π»Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² Π²ΠΈΠ΄Π΅ ΡΡΡΠ»ΠΎΠΊ, ΡΠΈΡΠ°ΠΉΡΠ΅ Π² ΡΡΠ°ΡΡΠ΅ «Π‘ΡΡΠ»ΠΊΠΈ».
pixabay.comΠΠ° pixabayΒ Π²Ρ Π½Π°ΠΉΠ΄Π΅ΡΠ΅ 680 ΡΡΡ. Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ Π½Π° Π»ΡΠ±ΡΡ ΡΠ΅ΠΌΠ°ΡΠΈΠΊΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΡΡΡΡ ΠΏΠΎ Π»ΠΈΡΠ΅Π½Π·ΠΈΠΈ Creative Commons CΠ‘Π (CC Zero), Ρ.Π΅. ΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, ΡΠ°ΡΠΏΡΠΎΡΡΡΠ°Π½ΡΡΡ, ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ Π² Π»ΡΠ±ΡΡ ΡΠ΅Π»ΡΡ , Π΄Π°ΠΆΠ΅ ΠΊΠΎΠΌΠΌΠ΅ΡΡΠ΅ΡΠΊΠΈΡ .
Β
Β
freeimages.comΠ ΡΠΎΡΠΎΠ±Π°Π½ΠΊΠ΅Β freeimagesΒ 390 ΡΡΡ. Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΡΠΎΡΠΎ ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ. ΠΠ΄Π΅ΡΡ ΡΠ»ΠΎΠΆΠ½Π΅Π΅ Π½Π°ΠΉΡΠΈΒ ΠΊΡΡΡΠΎΠΉ ΠΈΠΌΠΈΠ΄ΠΆ, Π½ΠΎ ΡΠΎΠΆΠ΅ ΠΏΠΎΠΏΠ°Π΄Π°ΡΡΡΡΒ Π½Π΅ΠΏΠ»ΠΎΡ ΠΈΠ΅ ΡΠΊΠ·Π΅ΠΌΠΏΠ»ΡΡΡ. ΠΠΎΡΡΠ΄ΠΊΠΎΠΌ ΠΎΡΠ²Π»Π΅ΠΊΠ°Π΅Ρ ΡΠ΅ΠΊΠ»Π°ΠΌΠ° ΠΏΠ»Π°ΡΠ½ΡΡ ΡΠΎΡΠΎΠ±Π°Π½ΠΊΠΎΠ². ΠΡ ΠΏΠΎΡΡΠ°Π²ΠΈΠ»ΠΈ ΡΡΠΎΡ ΡΠ΅ΡΡΡΡ Π½Π° Π²ΡΠΎΡΠΎΠ΅ ΠΌΠ΅ΡΡΠΎ ΠΈΠ·-Π·Π° ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, Π½ΠΎ ΠΏΠΎ Π΄ΡΡΠΆΠ΅Π»ΡΠ±Π½ΠΎΡΡΠΈ ΠΎΠ½ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠΆΠ°Π»ΡΠΉ Π½Π° ΠΏΠΎΡΠ»Π΅Π΄Π½Π΅ΠΌ Π² Π½Π°ΡΠ΅ΠΌ ΡΠ΅ΠΉΡΠΈΠ½Π³Π΅.
Β
Β
morguefile.comΠ£ ΡΠΎΡΠΎΡΡΠΎΠΊΠ°Β morguefileΒ Π±ΠΎΠ»Π΅Π΅ 250 ΡΡΡ. Π±Π΅ΡΠΏΠ»Π°ΡΠ½ΡΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ, Π² ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΌ Π²ΡΡΠΎΠΊΠΎΠ³ΠΎ ΠΊΠ°ΡΠ΅ΡΡΠ²Π°. ΠΠΎΠΆΠ½ΠΎ ΡΠΊΠ°ΡΠΈΠ²Π°ΡΡ Π΄Π°ΠΆΠ΅ Π±Π΅Π· ΡΠ΅Π³ΠΈΡΡΡΠ°ΡΠΈΠΈ. ΠΠΎΡΡΡΠΏΠ΅Π½ ΡΠΎΠ»ΡΠΊΠΎ Π½Π° Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΎΠΌ.
Β
Β
Β
unsplash.comΠΠ° unsplashΒ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΡΠΈΠ»ΡΠ½ΡΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΉ ΠΏΠΎΠ΄ Π»ΠΈΡΠ΅Π½Π·ΠΈΠ΅ΠΉΒ CC Zero.Β ΠΠΎΠΆΠ½ΠΎ ΠΊΠ°ΡΠ°ΡΡ Π±Π΅Π· ΡΠ΅Π³ΠΈΡΡΡΠ°ΡΠΈΠΈ.Β ΠΡΠΎΡ ΡΠΎΡΠΎΠ±Π°Π½ΠΊ ΡΠΎΠΆΠ΅ ΠΏΠΎΠΉΠΌΠ΅Ρ Π²Π°Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΠΎ Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΈ.
Β
Β
Β
designerspics.comΠ‘Π°ΠΉΡΒ designerspicsΒ ΡΠΎΠ·Π΄Π°Π½ ΠΠ½Π΄ΠΈΠΉΡΠΊΠΈΠΌ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅ΡΠΎΠΌ, ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅Ρ, ΠΊΠ°ΠΊ ΡΡΠΆΠ΅Π»ΠΎ Π±ΡΠ²Π°Π΅Ρ Π½Π°ΠΉΡΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎΠ΅ ΡΠΎΡΠΎ. ΠΡΠ΅ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΠΈ ΡΠ½ΡΡΡ Π»ΠΈΡΠ½ΠΎ ΠΈΠΌ, ΠΈ Ρ Π½ΠΈΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π΄Π΅Π»Π°ΡΡ ΡΡΠΎ ΡΠ³ΠΎΠ΄Π½ΠΎ. ΠΡΠ±ΠΈΡ ΡΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ Π΅Π΄Ρ, ΡΠ°Π±ΠΎΡΠΈΠΉ ΡΡΠΎΠ», ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΡ ΠΈ Π²ΡΡΠΊΠΈΠ΅Β ΠΏΡΠ΅Π΄ΠΌΠ΅ΡΡ. ΠΠΎΠΈΡΠΊ — ΡΠΎΠ»ΡΠΊΠΎ Π½Π° Π°Π½Π³Π»ΠΈΠΉΡΠΊΠΎΠΌ.
Β
vertex-academy.com
ΠΊΠ°ΠΊ Π·Π°Π΄Π°ΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠΈΡΡΠ½ΠΊΠ°
ΠΠ°Π΄Π°Π½ΠΈΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΡΠΈΡΡΠ½ΠΊΠ° ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΡΠ΅Ρ Π²ΠΈΠ΄ΠΎΠ² (ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎ ΠΊΠ°ΠΊ ΠΈ Π»ΡΠ±ΠΎΠ³ΠΎ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΠΎΠ±ΡΠ΅ΠΊΡΠ° Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅). Π‘ΡΡΠ»Π°ΡΡΡ Π½Π° w3schools ΠΏΠΎ css (html Π°ΡΡΡΠΈΠ±ΡΡΡ ΠΈΠ³Π½ΠΎΡ — ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΏΠΎΠ½ΠΈΠΌΠ°Ρ Π½ΡΠΆΠ½ΠΎ ΡΡΠ΅Π΄ΡΡΠ²Π°ΠΌΠΈ css). Π‘ΡΡΠ»ΠΊΠΈ Π²Π½ΠΈΠ·Ρ ΠΏΠΎΡΡΠ°.1. Inline. ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ²Π»ΡΠ΅ΡΡΡ inline ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ, ΡΠΎ Π΅ΡΡΡ ΠΏΡΠΎΡΡΡΠΌ ΡΠ·ΡΠΊΠΎΠΌ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π² ΠΎΠ±ΡΠ΅ΠΌ ΠΏΠΎΡΠΎΠΊΠ΅ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ Π±Π΅Π· ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠ° Π½Π° Π½ΠΎΠ²ΡΡ ΡΡΡΠΎΠΊΡ. ΠΠ±ΡΡΠ½ΠΎ ΡΠ΄ΠΎΠ±Π½ΠΎ ΠΏΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΈΡ
ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ-ΠΈΠΊΠΎΠ½ΠΎΠΊ Π² ΡΠ΅ΠΊΡΡΠ΅. Π’ΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ:
— Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎΠ΅ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ (vertical-align)
— padding
— margin
<img src="images/img.png" alt="" />— ΠΡΠ»ΠΈ Π²ΡΠ΅ ΠΆΠ΅ Π½Π°ΠΌ Π½Π°Π΄ΠΎ Π½Π° Π½ΠΎΠ²ΠΎΠΉ ΡΡΡΠΎΠΊΠ΅, ΡΠΎΠ³Π΄Π΅ Π½Π°Π΄ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ ΠΏΠ΅ΡΠ΅Π½ΠΎΡ ΡΡΡΠΎΠΊΠΈ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ BR ΡΠ΅Π³Π° ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π±Π»ΠΎΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅.
— ΠΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΠΎΡΡΠ΅Π½ΡΡΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, Π½Π°Π΄ΠΎ Π·Π°ΠΊΠ»ΡΡΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² ΡΠ΅Π³ Π΄Π»Ρ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π·Π°Π΄Π°Π½ΠΎ ΡΠ΅Π½ΡΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ:
2. Block (ΡΠ°ΠΊΠΆΠ΅ ΡΡΠ΄Π° ΠΎΡΠ½Π΅ΡΠ΅ΠΌ float) ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ. ΠΠ°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΠΌΡΠΉ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ. ΠΠ°ΡΠΈΠ°Π½ΡΡ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ:
<center><img src="images/img.png" alt="" /></center><p><img src="images/img.png" alt="" /></p>
— ΠΎΠ±ΡΠ΅ΠΊΠ°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠΎΠΌ (float, padding, margin)
<img src="images/img.png" alt="" />— ΠΏΡΠΎΡΡΠΎ Π±Π»ΠΎΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ (display)
<img src="images/img.png" alt="" />3. ΠΠ±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅. ΠΠ±ΡΠ΅ΠΊΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΡΡΡ Π²Π½Π΅ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ³ΠΎ ΠΏΠΎΡΠΎΠΊΠ° ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ, ΠΏΠΎΠΏΡΠΎΡΡΡ — ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Π½Π°Π΄/ΠΏΠΎΠ΄ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ (ΡΠ΅Π³Π°ΠΌΠΈ) ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ RELATIVE ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° (ΡΠ΅Π³ body ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ°ΠΊΠΈΠΌ ΠΏΠΎ-ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ).
—————
<img src="images/img.png" alt="" />
<img src="images/img.png" alt="" />
* ΠΏΠΎΠΌΠ½ΠΈΠΌ ΠΎ ΡΠΎΠ²ΠΌΠ΅ΡΡΠΈΠΌΠΎΡΡΡΡ
* Π½Ρ ΠΈ ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ Π»ΡΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ Π²ΡΠ½ΠΎΡΠΈΡΡ css Π² ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΉ ΡΠ°ΠΉΠ» ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠΎΠ²Π°ΡΡ ΠΊΠ»Π°ΡΡΡ.
—————
ΡΡΡΠ»ΠΊΠΈ Π½Π° ΡΠ²ΠΎΠΉΡΡΠ²Π°
— vertical-align
— margin
— padding
— float
— display
— position ΠΈ positioning
www.html.by
Π’ΡΠΈ ΡΠΏΠΎΡΠΎΠ±Π° Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ html ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ
Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ ΠΌΡ ΡΠ°Π·Π±Π΅ΡΠ΅ΠΌ ΡΡΠΈ ΠΏΡΠΎΡΡΡΡ
ΡΠ΅Ρ
Π½ΠΈΠΊΠΈ, Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠΎΡΠΎΡΡΡ
ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ Π²ΡΡΠΎΠ²Π½ΡΡΡ html ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ ΡΠΊΡΠ°Π½Π°. ΠΠ»Ρ ΡΡΠΎΠΊΠ° Ρ ΡΠΎΠ·Π΄Π°Π» ΠΏΡΠΎΡΡΡΡ html ΡΡΡΠ°Π½ΠΈΡΠΊΡ Ρ Π±Π°Π·ΠΎΠ²ΠΎΠΉ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠΎΠΉ ΠΈ ΠΏΡΡΡΠΎΠΉ css ΡΠ°ΠΉΠ».
ΠΠ°ΠΌ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡΡΡ div ΠΎΠ±Π΅ΡΡΠΊΠ° ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΌΡ Π²ΠΎΠ·ΡΠΌΠ΅ΠΌ Π½Π° ΡΠ°ΠΉΡΠ΅ placehold.it. ΠΠ΅ΡΠ²ΠΎΠ΅, ΡΡΠΎ ΠΌΡ ΡΠ΄Π΅Π»Π°Π΅ΠΌ ΡΡΠΎ ΡΠΎΠ·Π΄Π°Π΄ΠΈΠΌ div Ρ ΠΊΠ»Π°ΡΡΠΎΠΌ image-wrap
, ΠΈ Π² Π½Π΅Π³ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅.
<div> <img src=»http://placehold.it/350×150″ > </div>
<div> Β Β <img src=»http://placehold.it/350×150″ > </div> |
ΠΠ°Π»ΡΡΠ΅ ΠΏΡΠΎΠΏΠΈΡΠ΅ΠΌ Π±Π°Π·ΠΎΠ²ΡΠ΅ ΡΡΠΈΠ»ΠΈ Π΄Π»Ρ ΠΊΠ»Π°ΡΡΠ° image-wrap. ΠΡΠΎ Π±ΡΠ΄Π΅Ρ Π²ΡΡΠΎΡΠ° ΠΈ ΡΠΈΡΠΈΠ½Π°, Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π±ΠΎΠ»ΡΡΠ΅ ΡΠ΅ΠΌ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°. Π ΡΠΏΠ»ΠΎΡΠ½ΡΡ ΡΠ°ΠΌΠΊΡ ΡΠ°Π·ΠΌΠ΅ΡΠΎΠΌ 1px.
.image-wrap { width: 500px; height: 300px; border: 1px solid gray; }
.image-wrap { Β Β width: 500px; Β Β height: 300px; Β Β border: 1px solid gray; } |
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ Π½ΠΈΠΆΠ΅ Π½Π° ΡΠΊΡΠΈΠ½ΡΠΎΡΠ΅.
Π‘ΠΏΠΎΡΠΎΠ± 1. ΠΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅ ΠΊΠ»Π°ΡΡ .image-center
.
Π‘ΠΏΠΎΡΠΎΠ± Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ ΡΡΠΎΠ±Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ display ΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ block ΠΈ ΡΠ°ΠΊ ΠΆΠ΅ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ margin:auto. ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ Π²Π°ΠΌ ΡΠΆΠ΅ Π·Π½Π°ΠΊΠΎΠΌΠ° ΡΡΠ° ΡΠ΅Ρ Π½ΠΈΠΊΠ° ΠΈ Π²Ρ Π΅Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈ Π΄Π»Ρ ΡΠ΅Π½ΡΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ div. ΠΠΎ ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΡΡΠΎΡΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ Π½Π°ΠΌ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ display:block.
<div> <img src=»http://placehold.it/350×150″> </div>
<div> Β Β <img src=»http://placehold.it/350×150″> </div> |
.image-center { display:block; margin: auto; }
.image-center { Β Β display:block; Β Β margin: auto; } |
ΠΠ° ΡΠΊΡΠΈΠ½ΡΠΎΡΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ²ΠΈΠ΄Π΅ΡΡ, ΡΡΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΎΡΡΠ΅Π½ΡΡΠΈΡΠΎΠ²Π°Π½ΠΎ.
Π‘ΠΏΠΎΡΠΎΠ± 2. ΠΠΎΠΏΠΈΡΡΠ΅ΠΌ html ΠΊΠΎΠ΄ ΠΊΠΎΡΠΎΡΡΠΉ Π΅ΡΡΡ Π½Π° Π΄Π°Π½Π½ΡΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ, ΠΈ Π΄ΠΈΠ²Ρ image-wrap Π΄ΠΎΠ±Π°Π²ΠΈΠΌ Π΅ΡΠ΅ ΠΊΠ»Π°ΡΡ image-align. Π ΠΊΠ»Π°ΡΡ .image-center ΡΠ΄Π°Π»ΠΈΠΌ.
ΠΡΠ° ΡΠ΅Ρ
Π½ΠΈΠΊΠ° Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ Π΄ΠΈΠ²Π° ΠΎΡΡΠ΅Π½ΡΡΠΈΡΠΎΠ²Π°ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ text-align : center
. Π‘ΡΠΎΠΈΡΡ ΠΏΠΎΠΌΠ½ΠΈΡΡ, Π΅ΡΠ»ΠΈ ΠΌΡ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ ΡΠ΅ΠΊΡΡ Π² Π΄ΠΈΠ² ΠΎΠ½ ΡΠΎΠΆΠ΅ Π±ΡΠ΄Π΅Ρ ΡΠ΅Π½ΡΡΠΈΡΠΎΠ²Π°ΡΡΡΡ Π²ΠΌΠ΅ΡΡΠ΅ Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΎΠΉ.
<div> <img src=»http://placehold.it/350×150″> </div>
<div> Β Β <img src=»http://placehold.it/350×150″> </div> |
.image-align { text-align: center; }
.image-align { Β Β text-align: center; } |
Π‘ΠΌΠΎΡΡΠΈΠΌ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ.
Π‘ΠΏΠΎΡΠΎΠ± 3. Π’Π΅Ρ
Π½ΠΈΠΊΠ° ΠΎΡΠ½ΠΎΠ²ΡΠ²Π°Π΅ΡΡΡ Π½Π° ΡΠ²ΠΎΠΉΡΡΠ²Π΅ display : flex
. ΠΠ΅ΡΠ΅ΠΌ ΠΊΠΎΠ΄ html ΠΊΠΎΡΠΎΡΡΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈ Π² ΡΠΏΠΎΡΠΎΠ±Π΅ 2 ΠΈ ΠΌΠ΅Π½ΡΠ΅ΠΌ Π² Π½Π΅ΠΌ ΠΊΠ»Π°ΡΡ image-align Π½Π° image-flex.
<div > <img src=»http://placehold.it/350×150″ > </div>
<div > Β Β <img src=»http://placehold.it/350×150″ > </div> |
ΠΠ»Π°ΡΡΡ image-flex Π² css ΠΏΠΈΡΠ΅ΠΌ:
.image-flex { display:flex; align-items: center; justify-content: center; }
.image-flex { Β Β display:flex; Β Β align-items: center; Β Β justify-content: center; } |
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ align-items
ΡΠ΅Π½ΡΡΠΈΡΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ, justify-content
ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ. Π ΡΡΠΎΠΌ Π΅ΡΡΡ Π³Π»Π°Π²Π½ΠΎΠ΅ ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΈ ΠΏΠ»ΡΡ ΠΎΡ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΡ
ΡΠΏΠΎΡΠΎΠ±ΠΎΠ², ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΏΠΎ Π΄Π²ΡΠΌ ΠΎΡΡΠΌ.
Π’Π΅ΠΏΠ΅ΡΡ Ρ Π²Π°Ρ ΡΠΎΡΠ½ΠΎ Π½Π΅ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡΡ Π²ΠΎΠΏΡΠΎΡΡ ΠΊΠ°ΠΊ ΠΎΡΡΠ΅Π½ΡΡΠΈΡΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ div. ΠΡΠ»ΠΈ Ρ Π²Π°Ρ Π΅ΡΡΡ, ΡΡΠΎ ΡΠΏΡΠΎΡΠΈΡΡ ΠΈΠ»ΠΈ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΡ, ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ ΠΏΡΠΈΠ²Π΅ΡΡΡΠ²ΡΡΡΡΡ. ΠΠΎ Π²ΡΡΡΠ΅ΡΠΈ Π² ΡΠ»Π΅Π΄ΡΡΡΠΈΡ ΡΡΠ°ΡΡΡΡ .
comments powered by HyperCommentswebupblog.ru
ΠΠ°ΠΊ Π²ΡΡΠ°Π²Π»ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΈ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ ΠΈΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Π² HTML
Π Π΄Π°Π½Π½ΠΎΠΌ ΡΡΠΎΠΊΠ΅ ΠΌΡ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ, ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²Π»ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π² html Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ, ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ Π΅Π³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅, Π° ΡΠ°ΠΊΠΆΠ΅ ΠΊΠ°ΠΊ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π² Π²ΠΈΠ΄Π΅ ΡΠΎΠ½Π°.
ΠΠ°ΡΠ΅ΡΠΈΠ°Π»Ρ ΠΏΠΎ ΡΠ΅ΠΌΠ΅:
ΠΡΠ΅ΠΆΠ΄Π΅ ΡΠ΅ΠΌ ΠΌΡ Π½Π°ΡΠ½Π΅ΠΌ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°ΡΡ ΡΠ΅Π³ΠΈ, ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ ΠΊΠΎΡΠΎΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡΡ Π²ΡΡΠ°Π²ΠΊΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈ ΠΈΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Ρ Π±Ρ Ρ ΠΎΡΠ΅Π» Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΠ°ΡΡΠΊΠ°Π·Π°ΡΡ ΠΎ ΡΠ°ΠΌΠΈΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΡ ΠΈ ΠΈΡ ΡΠΎΡΠΌΠ°ΡΠ°Ρ .
ΠΡΠ½ΠΎΠ²Π½ΡΠ΅ ΡΠΎΡΠΌΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ ΠΏΡΠΈ ΡΠΎΠ·Π΄Π°Π½ΠΈΠΈ web ΡΡΡΠ°Π½ΠΈΡ ΡΡΠΎ JPG, GIF ΠΈ PNG. ΠΠ»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡΠΌΠΈ ΠΈ ΠΏΠΎΠ΄Π³ΠΎΡΠΎΠ²ΠΊΠΈ ΠΈΡ ΠΊ ΠΏΡΠ±Π»ΠΈΠΊΠ°ΡΠΈΠΈ Π² ΠΈΠ½ΡΠ΅ΡΠ½Π΅Ρ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΌ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠΎΠΌ Photoshop. Π Π½Π΅ΠΌ Π΅ΡΡΡ ΡΡΠ΅Π΄ΡΡΠ²Π° ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ, ΠΊΠΎΡΠΎΡΡΡ ΠΎΡΠ΅Π½Ρ Π»Π΅Π³ΠΊΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΆΠ°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈ ΡΠΌΠ΅Π½ΡΡΠΈΡΡ Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅Ρ, Π½ΠΎ ΠΏΡΠΈ ΡΡΠΎΠΌ ΡΠΎΡ ΡΠ°Π½ΠΈΡΡ ΠΊΠ°ΡΠ΅ΡΡΠ²ΠΎ.ΠΡΠΎ ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ½ΠΎ Π΄Π»Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ, ΠΏΡΠ±Π»ΠΈΠΊΡΠ΅ΠΌΡΡ Π² ΠΈΠ½ΡΠ΅ΡΠ½Π΅ΡΠ΅.
ΠΡΠ»ΠΈ Π²Π°ΠΌ Π½ΡΠΆΠ½Ρ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π³ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠΎ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π°ΠΉΡΠΈ Π² ΡΠ°Π·Π΄Π΅Π» ΠΡΠ°ΡΠΈΠΊΠ° Π΄Π»Ρ ΡΠ°ΠΉΡΠΎΠ², ΡΠ°ΠΌ Π²Ρ Π½Π°ΠΉΠ΄Π΅ΡΠ΅ ΡΡΠΎΠΊΠΈ ΠΏΠΎΡΠ²ΡΡΠ΅Π½Π½ΡΠ΅ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ web Π³ΡΠ°ΡΠΈΠΊΠΈ.
ΠΡ Π° ΡΠ΅ΠΏΠ΅ΡΡ ΠΎ ΡΠΎΠΌ ΠΊΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² html Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ. ΠΠ»Ρ Π²ΡΡΠ°Π²ΠΊΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ΅Π³ <img>. ΠΡΠΎΡ ΡΠ΅Π³ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠ΅Π³ΠΎ ΡΠ΅Π³Π°. ΠΡΡΠ°Π²ΠΊΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠΉ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ Π΅Π³ΠΎ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ:
<img src= "Π°Π΄ΡΠ΅Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ">
Π ΠΊΠ°Π²ΡΡΠΊΠ°Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΠ°Π·Π°ΡΡ ΠΏΡΡΡ ΠΊ ΡΡΠΎΠΌΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ.
ΠΡΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π»Π΅ΠΆΠΈΡ Π² ΡΠΎΠΉ ΠΆΠ΅ ΠΏΠ°ΠΏΠΊΠ΅ ΡΡΠΎ ΠΈ ΡΡΡΠ°Π½ΠΈΡΠ°, Π² ΠΊΠΎΡΠΎΡΡΡ ΠΎΠ½ΠΎ Π²ΡΡΠ°Π²Π»ΡΠ΅ΡΡΡ, ΡΠΎ ΡΡΠΎ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ:
ΠΡΠ»ΠΈ ΠΆΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π»Π΅ΠΆΠΈΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π² ΠΏΠ°ΠΏΠΊΠ΅ images ΡΠΎ ΠΏΡΡΡ ΠΊ Π½Π΅ΠΌΡ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ:
<img src= "images/foto.jpg">
ΠΡΠ»ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π»Π΅ΠΆΠΈΡ Π½Π° Π΄ΡΡΠ³ΠΎΠΌ ΡΠ΅ΡΠ²Π΅ΡΠ΅, ΡΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ Π΄Π°Π²Π°ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ Π°Π΄ΡΠ΅Ρ ΠΊ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΡΡΡΠ»ΠΊΠ° Π½Π° ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ, ΠΊΠΎΡΠΎΡΠ°Ρ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π° Π² Π½Π°ΡΠ°Π»Π΅ ΡΡΠΎΠ³ΠΎ ΡΡΠΎΠΊΠ° Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠ°ΠΊ:
<img src= "http://webmastermix.ru/images/creation-site/lessons-HTML/images-in-html.jpg">
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²Ρ Π»ΡΡΡΠ΅ ΠΏΠΎΠ½ΡΠ»ΠΈ ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Ρ ΠΏΡΠ΅Π΄Π»Π°Π³Π°Ρ Π²Π°ΠΌ Π² ΠΊΠ°ΠΊΡΡ Π»ΠΈΠ±ΠΎ ΠΏΠ°ΠΏΠΊΡ Π½Π° Π²Π°ΡΠ΅ΠΌ ΠΊΠΎΠΌΠΏΡΡΡΠ΅ΡΠ΅ ΡΠΎΡ ΡΠ°Π½ΠΈΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ Π²ΠΈΠ΄ΠΈΡΠ΅ ΡΠ»Π΅Π²Π°. Π ΡΠΎΠ·Π΄Π°ΡΡ Π² ΡΠΎΠΉ ΠΆΠ΅ ΠΏΠ°ΠΏΠΊΠ΅ html Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ ΠΊΠΎΠ΄ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΡΠΉ Π½ΠΈΠΆΠ΅. ΠΡΠ»ΠΈ Π²Ρ Π½Π΅ Π·Π½Π°Π΅ΡΠ΅, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°ΡΡ html ΡΠ°ΠΉΠ» ΡΠΎΠ³Π΄Π° ΡΠΌΠΎΡΡΠΈΡΠ΅ ΡΡΠΎΠΊ ΠΡΠ½ΠΎΠ²Ρ HTML.
<html> <head> <title>ΠΠΎΡ ΠΏΠ΅ΡΠ²Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ° </title> </head> <body> <img src= "foto.jpg"> ΠΡΠΎΡ ΡΠ΅ΠΊΡΡ Ρ Π½Π°ΠΏΠΈΡΠ°Π» ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎ Π΄Π»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ Π²ΠΈΠ΄Π΅ΡΡ ΠΊΠ°ΠΊ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΅ΠΊΡΡΠ°. ΠΠ°Π»Π΅Π΅ ΠΌΡ ΡΠ°Π·Π±Π΅ΡΠ΅ΠΌ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ, ΠΊΠΎΡΠΎΡΡΡ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎ-ΡΠ°Π·Π½ΠΎΠΌΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. </body> </html>
ΠΠΎΡΠ»Π΅ ΡΠΎΠ³ΠΎ ΠΊΠ°ΠΊ Π²Ρ ΠΎΡΠΊΡΠΎΠ΅ΡΠ΅ ΡΠΎΠ·Π΄Π°Π½Π½ΡΡ ΡΡΡΠ°Π½ΠΈΡΡ Π² Π±ΡΠ°ΡΠ·Π΅ΡΠ΅ ΡΠΎ ΡΠ²ΠΈΠ΄ΠΈΡΠ΅ ΡΡΠΎ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ Π½Π΅ ΡΠΎΠ²ΡΠ΅ΠΌ ΠΊΡΠ°ΡΠΈΠ²ΠΎ. ΠΠΎΡΡΠΎΠΌΡ Π΄Π°Π»Π΅Π΅ ΠΌΡ ΡΠ°Π·Π±Π΅ΡΠ΅ΠΌ, ΠΊΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. ΠΠ΄Π΅ΡΡ Π½Π°ΠΌ Π½Π° ΠΏΠΎΠΌΠΎΡΡ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡ ΡΠΆΠ΅ Π·Π½Π°ΠΊΠΎΠΌΡΠΉ Π²Π°ΠΌ ΠΏΠΎ ΡΡΠΎΠΊΡ ΠΠ°ΡΠ°Π³ΡΠ°ΡΡ ΠΈ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ΅ΠΊΡΡΠ° Π² HTML Π°ΡΡΠΈΠ±ΡΡ align=»».
Π‘ΡΡΠ΅ΡΡΠ²ΡΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΡΡΠΎΠ³ΠΎ Π°ΡΡΠΈΠ±ΡΡΠ°:
<img src= "foto.jpg" align="left">
Π ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΠΏΡΠΈΠΆΠ°ΡΠ° ΠΊ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, Π° ΡΠ΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°ΡΡ Π΅Π΅ ΡΠΏΡΠ°Π²Π°.
<img src= "foto.jpg" align="right" >
ΠΠ°ΡΡΠΈΠ½ΠΊΠ° Π±ΡΠ΄Π΅Ρ ΠΏΡΠΈΠΆΠ°ΡΠ° ΠΊ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, Π° ΡΠ΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°ΡΡ Π΅Π΅ ΡΠ»Π΅Π²Π°.
<img src= "foto.jpg" align="bottom">
Π ΡΡΠΎΠΌ ΡΠ»ΡΡΠ°Π΅ ΡΠ΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π² Π½ΠΈΠ·Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. Π’Π°ΠΊ ΠΎΠ½ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, Π΅ΡΠ»ΠΈ Π°ΡΡΠΈΠ±ΡΡ align Π½Π΅ ΠΏΡΠΎΠΏΠΈΡΠ°Π½.
<img src= "foto.jpg" align="middle">
Π’Π΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ ΠΏΠΎ ΡΠ΅ΡΠ΅Π΄ΠΈΠ½Π΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΡΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Ρ ΠΎΡΠΎΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, Π΅ΡΠ»ΠΈ Π½ΡΠΆΠ½ΠΎ ΠΌΠ°Π»Π΅Π½ΡΠΊΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ ΡΡΡΠΎΠΊΠΈ ΡΠ΅ΠΊΡΡΠ°, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΊΠ½ΠΎΠΏΠΊΡ.
<img src= "foto.jpg" align="top">
Π’Π΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π²Π²Π΅ΡΡ Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ. ΠΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΠΏΡΠΎΠ±ΠΎΠ²Π°ΡΡ ΠΏΠΎΠ΄ΡΡΠ°Π²Π»ΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΈ ΠΏΠΎΡΠΌΠΎΡΡΠ΅ΡΡ, ΠΊΠ°ΠΊ Π±ΡΠ΄Π΅Ρ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΅ΠΊΡΡΠ°.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ Π°ΡΡΠΈΠ±ΡΡ, ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡΡΠΈΠΉ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Π½Π°Π·ΡΠ²Π°Π΅ΡΡΡ vspace=»». ΠΠ½ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠ°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ. Π ΠΊΠ°Π²ΡΡΠΊΠ°Ρ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ Π»ΡΠ±ΠΎΠ΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ .
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
<img src= "foto.jpg" align="left" vspace="10">
Π Π°ΡΡΡΠΎΡΠ½ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ ΠΈ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅ΡΡΡ Π°ΡΡΠΈΠ±ΡΡΠΎΠΌ hspace=»».
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
<img src= "foto.jpg" align="left" vspace="10" hspace="20">
Π‘Π»Π΅Π΄ΡΡΡΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΡΡΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠΈΡΠΈΠ½Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ Π²ΡΡΠΎΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΡΠ»ΠΈ Π²Ρ ΠΈΡ Π½Π΅ ΠΏΡΠΎΠΏΠΈΡΠΈΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π²ΡΠ΅ ΡΠ°Π²Π½ΠΎ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΡΡΡ ΠΈ Π±ΡΠ΄Π΅Ρ ΡΠΎΠ³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠ° ΠΊΠ°ΠΊ ΠΎΠ½Π° ΠΈ Π΅ΡΡΡ. ΠΠΎ Π»ΡΡΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΠΏΡΠΎΠΏΠΈΡΡΠ²Π°ΡΡ ΡΠΈΡΠΈΠ½Ρ ΠΈ Π²ΡΡΠΎΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΄Π»Ρ Π½Π°ΡΠ΅ΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΡΡΠΎ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ:
<img src= "foto.jpg" align="left">
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ Π°ΡΡΠΈΠ±ΡΡ ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ΅Π½ Π² ΠΏΠ»Π°Π½Π΅ ΠΏΠΎΠΈΡΠΊΠΎΠ²ΠΎΠΉ ΠΎΠΏΡΠΈΠΌΠΈΠ·Π°ΡΠΈΠΈ Π²Π°ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΡΠΎ Π°ΡΡΠΈΠ±ΡΡ alt=»» Π³Π΄Π΅ Π² ΠΊΠ°Π²ΡΡΠΊΠ°Ρ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠΎΠΈΡΠΊΠΎΠ²ΡΠ΅ ΡΠΈΡΡΠ΅ΠΌΡ ΠΎΠ±ΡΠ°ΡΠ°ΡΡ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΡΠΎ, ΡΡΠΎ Π½Π°ΠΏΠΈΡΠ°Π½ΠΎ ΠΌΠ΅ΠΆΠ΄Ρ ΠΊΠ°Π²ΡΡΠ΅ΠΊ. ΠΡΠΎ ΠΎΠΏΠΈΡΠ°Π½ΠΈΠ΅ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ, Π΅ΡΠ»ΠΈ ΠΏΠΎΠ΄Π΅ΡΠΆΠ°ΡΡ ΠΊΡΡΡΠΎΡ Π½Π°Π΄ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΎΠΉ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΠΊΡΠ½Π΄. ΠΠ»Ρ Π½Π°ΡΠ΅ΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ ΡΠ°ΠΊ:
<img src= "foto.jpg" align="left" alt=βΠ€ΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡ Π΄Π΅Π²ΡΡΠΊΠΈβ>
ΠΡ ΠΈ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ Π°ΡΡΠΈΠ±ΡΡ ΡΡΠΎ border=»» ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΡΠΈΡΠΈΠ½Ρ ΡΠ°ΠΌΠΊΠΈ Π²ΠΎΠΊΡΡΠ³ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. Π ΠΊΠ°Π²ΡΡΠΊΠ°Ρ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΡΠΈΡΠΈΠ½Π° ΡΠ°ΠΌΠΊΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΡΠ°ΠΊ:
<img src= "foto.jpg" align=βleftβ alt=βΠ€ΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡ Π΄Π΅Π²ΡΡΠΊΠΈβ border="2">
ΠΠ°ΠΊ Π²Ρ ΡΠΆΠ΅ Π½Π°Π²Π΅ΡΠ½ΡΠΊΠ° Π·Π°ΠΌΠ΅ΡΠΈΠ»ΠΈ Π²ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΊΠ°ΠΊ ΠΏΠΎ ΠΎΡΠ΄Π΅Π»ΡΠ½ΠΎΡΡΠΈ, ΡΠ°ΠΊ ΠΈ Π²ΠΌΠ΅ΡΡΠ΅. ΠΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΡΠΉ ΠΊΠΎΠ΄ Π½Π°ΡΠ΅ΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π±ΡΠ΄Π΅Ρ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ:
<img src= "foto.jpg" align="left" vspace="10" hspace="20" alt="Π€ΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡ Π΄Π΅Π²ΡΡΠΊΠΈ" border="2">
ΠΡΠΎΠΌΠ΅ ΡΡΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π½Π΅ ΠΏΡΠΎΡΡΠΎ Π²ΡΡΠ°Π²Π»ΡΡΡ Π½Π° ΡΡΡΠ°Π½ΠΈΡΡ Π½ΠΎ ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ½Π° Π΄Π»Ρ ΡΡΡΠ°Π½ΠΈΡΡ. ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ½Π° Π΄Π»Ρ Π½Π°ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ Π² ΠΎΡΠΊΡΡΠ²Π°ΡΡΠ΅ΠΌ ΡΠ΅Π³Π΅ <body> Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ Π°ΡΡΠΈΠ±ΡΡ background=»» Π³Π΄Π΅ Π² ΠΊΠ°Π²ΡΡΠΊΠ°Ρ ΡΠΊΠ°Π·Π°ΡΡ Π°Π΄ΡΠ΅Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎ ΡΠΎΠΌΡ ΠΊΠ°ΠΊ ΠΌΡ ΡΡΠΎ ΡΠ°ΡΡΠΌΠ°ΡΡΠΈΠ²Π°Π»ΠΈ Π²ΡΡΠ΅.
Π ΠΏΡΠΈΠΌΠ΅ΡΡ Π·Π°Π΄Π°Π΄ΠΈΠΌ ΡΠΎΠ½ Π΄Π»Ρ Π²Π°ΡΠ΅ΠΉ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΡΠΎΡ ΡΠ°Π½ΠΈΡΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠΎΠ½Π°, ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²Ρ Π²ΠΈΠ΄ΠΈΡΠ΅ Ρ Π»Π΅Π²Π°, Π² ΡΡ ΠΏΠ°ΠΏΠΊΡ Π³Π΄Π΅ Π»Π΅ΠΆΠΈΡ Π²Π°ΡΠ° ΡΠ°Π½Π΅Π΅ ΡΠΎΠ·Π΄Π°Π½Π½Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ°. ΠΠ°ΡΠ΅ΠΌ Π² ΡΠ΅Π³Π΅ <body> ΠΏΡΠΎΠΏΠΈΡΠΈΡΠ΅ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
<body background="fon.gif">
ΠΠΎΠ»Π½ΡΠΉ ΠΊΠΎΠ΄ ΡΡΡΠ°Π½ΠΈΡΡ Π±ΡΠ΄Π΅Ρ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ:
<html> <head> <title>ΠΠΎΡ ΠΏΠ΅ΡΠ²Π°Ρ ΡΡΡΠ°Π½ΠΈΡΠ°</title> </head> <body background="fon.gif"> <img src= "foto.jpg" align="left" vspace="10" hspace="20" alt="Π€ΠΎΡΠΎΠ³ΡΠ°ΡΠΈΡ Π΄Π΅Π²ΡΡΠΊΠΈ" border="2"> ΠΡΠΎΡ ΡΠ΅ΠΊΡΡ Ρ Π½Π°ΠΏΠΈΡΠ°Π» ΡΠΏΠ΅ΡΠΈΠ°Π»ΡΠ½ΠΎ Π΄Π»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²Ρ ΠΌΠΎΠ³Π»ΠΈ Π²ΠΈΠ΄Π΅ΡΡ ΠΊΠ°ΠΊ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°Π΅ΡΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΅ΠΊΡΡΠ°. ΠΠ°Π»Π΅Π΅ ΠΌΡ ΡΠ°Π·Π±Π΅ΡΠ΅ΠΌ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΡ ΠΏΡΠΈ ΠΏΠΎΠΌΠΎΡΠΈ, ΠΊΠΎΡΠΎΡΡΡ Π²Ρ ΡΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎ-ΡΠ°Π·Π½ΠΎΠΌΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅. </body> </html>
Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΌΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΠ»ΠΈ Π½Π°ΡΠ΅ ΠΏΠ΅ΡΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΡΠ»Π΅Π²Π°, ΡΠ΅ΡΡ Π΅Π³ΠΎ ΠΎΠ±ΡΠ΅ΠΊΠ°Π΅Ρ ΡΠΏΡΠ°Π²Π°, Π·Π°Π΄Π°Π»ΠΈ ΠΎΡΡΡΡΠΏΡ ΠΌΠ΅ΠΆΠ΄Ρ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΈ ΡΠ΅ΠΊΡΡΠΎΠΌ Π² 10 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ, ΡΠΊΠ°Π·Π°Π»ΠΈ Π΅Π³ΠΎ Π²ΡΡΠΎΡΡ ΠΈ ΡΠΈΡΠΈΠ½Ρ, Π° Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΡΠΎΠ½Π° Π·Π°Π΄Π°Π»ΠΈ Π΅ΡΠ΅ ΠΎΠ΄Π½ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅.
ΠΠ°ΡΠ΅ΡΠΈΠ°Π» ΠΏΠΎΠ΄Π³ΠΎΡΠΎΠ²Π»Π΅Π½ ΠΏΠΎΡΡΠ°Π»ΠΎΠΌ:Β webmastermix.ru
Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΠ΅ΠΌ ΠΎΠ·Π½Π°ΠΊΠΎΠΌΠΈΡΡΡΡ:
- ΠΠΎΠ΄ΡΠΎΠ±Π½ΠΎΡΡΠΈ
ΠΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΎ: 04 Π‘Π΅Π½ΡΡΠ±ΡΡ 2013
Π‘ΠΎΠ·Π΄Π°Π½ΠΎ: 13 Π―Π½Π²Π°ΡΡ 2010
ΠΡΠΎΡΠΌΠΎΡΡΠΎΠ²: 54649
webmastermix.ru
ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML. Π£ΡΠΎΠΊ — 7 (Π΄Π»Ρ Π½Π°ΡΠΈΠ½Π°ΡΡΠΈΡ ).
ΠΡΠ΅ΠΌ ΠΏΡΠΈΠ²Π΅Ρ!!! ΠΠΎ ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ Π²Ρ Π½Π°ΡΡΠΈΡΠ΅ΡΡ Π²ΡΡΠ°Π²Π»ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML Π΄ΠΎΠΊΡΠΌΠ΅Π½Ρ. ΠΡΠΎ Π²ΠΎΠ²ΡΠ΅ Π½Π΅ ΡΠ»ΠΎΠΆΠ½ΠΎ. ΠΠΎ Π²Π½Π°ΡΠ°Π»Π΅ Ρ Π±Ρ Ρ ΠΎΡΠ΅Π» Π²Π°ΠΌ Π΄Π°ΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°ΡΠΈΠΉ ΠΏΠΎ ΠΏΠΎΠ²ΠΎΠ΄Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅.
Π‘ΠΎΠ²Π΅Ρ: ΠΊΠΎΠ³Π΄Π° Π±ΡΠ΄Π΅ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, Π½Π΅ ΡΠ²Π»Π΅ΠΊΠ°ΠΉΡΠ΅ΡΡ Π°Π½ΠΈΠΌΠΈΡΠΎΠ²Π°Π½Π½ΡΠΌΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°ΠΌΠΈ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΡΡΠΎ ΠΎΡΠ²Π»Π΅ΠΊΠ°Π΅Ρ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΡΠΈΡΠ°ΡΠ΅Π»Ρ ΠΎΡ ΡΠ°ΠΌΠΎΠ³ΠΎ Π²Π°ΠΆΠ½ΠΎΠ³ΠΎ — ΡΠ΅ΠΊΡΡΠ°. ΠΡΡΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΎΠ±ΡΡΠ½ΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅ Π±Π΅Π· Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ.
Π‘ΡΠ°ΡΠ°ΠΉΡΠ΅ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠΊΠ°Ρ
ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ½ΠΈΠΊΠ°Π»ΡΠ½ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠΎΡΠΈΡΠ°ΡΡ ΡΡΡ, Π° Π²Π·ΡΡΡ ΠΊΡΠ°ΡΠΈΠ²ΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π·Π΄Π΅ΡΡ.
ΠΡΠΈΡΡΡΠΏΠΈΠΌ.
ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² html?
Π’Π°ΠΊ, ΠΊΠ°ΠΊ Ρ Π³ΠΎΠ²ΠΎΡΠΈΠ» — Π·Π΄Π΅ΡΡ ΡΠ»ΠΎΠΆΠ½ΠΎΠ³ΠΎ Π½ΠΈΡΠ΅Π³ΠΎ Π½Π΅Ρ, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΡΡΠΎΡΒ html ΠΊΠΎΠ΄.
<img src=»kartinka.jpg»>
kartinka — ΡΡΠΎ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ
jpg — ΡΡΠΎ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. Π Π°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ gif, png, bmp.
ΠΡΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½Π° Π² ΠΏΠ°ΠΏΠΊΠ΅Β images, ΡΠΎΠ³Π΄Π° ΠΏΡΡΡ ΠΊ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ΅ Π±ΡΠ΄Π΅Ρ ΡΠ°ΠΊΠΈΠΌ:
<img src=»Β images/kartinka.jpg»>
images — Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΏΠ°ΠΏΠΊΠΈ, Π³Π΄Π΅ Π»Π΅ΠΆΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° «kartinka.jpg».
ΠΡΠ»ΠΈ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ° Π»Π΅ΠΆΠΈΡ Π½Π° Π΄ΡΡΠ³ΠΎΠΌ ΡΠ°ΠΉΡΠ΅, ΡΠΎΠ³Π΄Π° ΠΊΠΎΠ΄ Π±ΡΠ΄Π΅Ρ ΡΠ°ΠΊΠΈΠΌ:
<img src=»https://www.bloggood.ru/images/kartinka.jpg»>
https://www.bloggood.ru — ΡΡΠΎ Π°Π΄ΡΠ΅Ρ ΡΠ°ΠΉΡΠ°.
ΠΡΠΈΠΌΠ΅Ρ:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² html</title> </head> <body> <img src="kartinka.jpg"> </body> </html>
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ Π²Β html ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΡΡΡΠ»ΠΊΠΎΠΉ?
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΏΡΠΎΡΡΠΎ Π·Π°ΠΊΠ»ΡΡΠΈΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΡΠ»ΠΎΡΠ½ΡΠΌ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠΌ:
<a href=»Π°Π΄ΡΠ΅Ρ ΡΡΡΠ»ΠΊΠΈ»><img src=»kartinka.jpg»></a>
ΠΡΡΠΈΠ±ΡΡΡ Π΄Π»Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΎΠΊ
ALIGN — ΡΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½ Π΄Π»Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°Π½ΠΈΡ ΠΈΠ»ΠΈ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ.
left —Β Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ Π»Π΅Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, ΡΠ΅ΠΊΡΡ Π±ΡΠ΄Π΅Ρ ΠΎΠ±ΡΠ΅ΠΊΠ°ΡΡ ΡΠΏΡΠ°Π²Π°.
right —Β Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ, ΡΠ΅ΠΊΡΡ ΠΎΠ±ΡΠ΅ΠΊΠ°Π΅Ρ ΡΠ»Π΅Π²Π°.
<img src=»kartinka.png» align=»right»>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ ΠΏΠΎ ΠΏΡΠ°Π²ΠΎΠΌΡ ΠΊΡΠ°Ρ
HSPACE — ΠΎΡΡΡΡΠΏΡ ΠΎΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈΒ (Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
).
VSPACE —Β ΠΎΡΡΡΡΠΏΡ ΠΎΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ (Π² ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
).
<img src=»kartinka.png» align=»right» hspace=»15″ vspace=»15″>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
ΠΎΡΡΡΡΠΏΡ ΠΎΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ
HEIGHT — Π²ΡΡΠΎΡΠ° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ (ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
).
WIDTHΒ — ΡΠΈΡΠΈΠ½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ Β (ΠΏΠΈΠΊΡΠ΅Π»ΡΡ
).
<img src=»kartinka.png» align=»right» hspace=»15″ vspace=»15″>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
Π²ΡΡΠΎΡΠ° ΠΈ ΡΠΈΡΠ΅Π½Π° ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ
TITLE —Β ΡΡΠΎ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Π±ΡΠ΄Π΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ, Π΅ΡΠ»ΠΈ Π½Π°Π²Π΅ΡΡΠΈ Π½Π° ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΊΡΡΡΠΎΡ ΠΌΡΡΠΊΠΈ.
<img src=»kartinka.png» align=»right» hspace=»15″ vspace=»15″Β width=»100″ Β title=»ΠΡΠ΅ΠΌ ΠΏΡΠΈΠ²Π΅Ρ — bloggood_ru!!! «>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ
BORDER — ΡΡΠΎΡ Π°ΡΡΠΈΠ±ΡΡ ΠΎΡΠ²Π΅ΡΠ°Π΅Ρ Π·Π° ΡΠ°Π·ΠΌΠ΅Ρ ΡΠ°ΠΌΠΊΠΈ Π²ΠΎΠΊΡΡΠ³ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. Π Π°ΠΌΠΊΠΈ ΠΏΠΎΡΠ²Π»ΡΡΡΡΡ Π² ΡΠ°ΠΊΠΈΡ ΡΠ»ΡΡΠ°ΡΡ , ΠΊΠΎΠ³Π΄Π° Π²Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΡΠ΄Π΅Π»Π°Π΅ΡΠ΅ ΡΡΡΠ»ΠΊΠΎΠΉ. ΠΡΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½ΡΠ»Π΅Π²ΠΎΠ΅Β Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ Π°ΡΡΠΈΠ±ΡΡΠ°Β BORDER , ΡΠ°ΠΌΠΊΠ° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π½Π΅ Π±ΡΠ΄Π΅Ρ.
<a href=»Π°Π΄ΡΠ΅Ρ ΡΡΡΠ»ΠΊΠΈ»><img src=»kartinka.png» border=»0″></a>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
Π Π΅ΡΠ»ΠΈ ΠΏΠΎΠΌΠ΅Π½ΡΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ border Π½Π° 5:
<a href=»Π°Π΄ΡΠ΅Ρ ΡΡΡΠ»ΠΊΠΈ»><img src=»kartinka.png» border=»5″></a>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΡΠΎΠ½ΠΎΠΌ?
ΠΡΠ±ΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠΎΠ½ΠΎΠΌ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ Π² ΡΠ΅Π³Π΅Β bodyΒ ΠΏΡΠΎΠΏΠΈΡΠΈΡΠ΅ Π°ΡΡΠΈΠ±ΡΡΒ background.
<bodyΒ background=»Π²Π°Ρ_ΡΠΎΠ½.jpg»>
ΠΠ° ΠΊΠ°ΡΡΠΈΠ½ΠΎΡΠ½ΠΎΠΌ ΡΠΎΠ½Π΅ ΠΌΠΎΠΆΠ΅Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ ΡΠ΅ΠΊΡΡ.
ΠΡΠΈΠΌΠ΅Ρ:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΡΡΡΠ»ΠΊΡ-ΡΠΊΠΎΡΡ Π² html</title> </head> <body background="kartinka.jpg"> <p>ΡΠ΅ΠΊΡΡ</p> <p>ΡΠ΅ΠΊΡΡ</p> </body> </html>
Π Π΅Π·ΡΠ»ΡΡΠ°Ρ:
ΠΠ°ΡΡΠΈΠ½ΠΊΠ° ΠΊΠ°ΠΊ ΡΠΎΠ½
ΠΠ° ΡΡΠΎΠΉ Π½ΠΎΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ»ΠΎ Π±Ρ ΠΈ Π·Π°ΠΊΠΎΠ½ΡΠΈΡΡ ΡΠ΅ΠΌΡ «ΠΠ°ΠΊ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ Π² HTML», Π½ΠΎ Π·Π½Π°Ρ, ΡΡΠΎ ΠΌΠ½ΠΎΠ³ΠΈΡ
ΠΈΠ½ΡΠ΅ΡΠ΅ΡΡΠ΅Ρ Π²ΠΎΠΏΡΠΎΡ, Π° ΠΊΠ°ΠΊ ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ.
Π§ΡΠΎΠ±Ρ ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΠΏΠΎ ΡΠ΅Π½ΡΡΡ,Β Π²Π°ΠΌ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΡ ΡΠ°ΠΊΠΎΠΉ ΡΠΎΠΊΡΡ:
<center>
<img src=»kartinka.jpg»>
</center>
ΠΠΎΡ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠΎΡΠ½ΠΎ Π²ΡΠ΅. ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ ΠΊ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌΡ ΡΡΠΎΠΊΡ.
ΠΠΎΠ½ΡΠ°Π²ΠΈΠ»ΡΡ ΠΏΠΎΡΡ? ΠΠΎΠΌΠΎΠ³ΠΈ Π΄ΡΡΠ³ΠΈΠΌ ΡΠ·Π½Π°ΡΡ ΠΎΠ± ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅, ΠΊΠ»ΠΈΠΊΠ½ΠΈ Π½Π° ΠΊΠ½ΠΎΠΏΠΊΡ ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΠ΅ΠΉ βββ
ΠΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ Π½ΠΎΠ²ΠΎΡΡΠΈ ΠΊΠ°ΡΠ΅Π³ΠΎΡΠΈΠΈ:
ΠΠΎΡ ΠΎΠΆΠΈΠ΅ ΡΡΠ°ΡΡΠΈ
ΠΠΎΠΏΡΠ»ΡΡΠ½ΡΠ΅ ΡΡΠ°ΡΡΠΈ:
ΠΠΎΠ±Π°Π²ΠΈΡΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠ΅ΡΠΊΠΈ: html, ΠΎΡΠ½ΠΎΠ²Ρ
bloggood.ru