ΠΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS ΠΈ Π΅Π³ΠΎ ΡΠ°Π±ΠΎΡΡ. ΠΡΠΈΠΌΠ΅Ρ
ΠΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ HTML Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ Π΄ΡΡΠ³ Π·Π° Π΄ΡΡΠ³ΠΎΠΌ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΡΠ½ΠΎ. ΠΡ Π²ΡΠ΅Π³Π΄Π° Π±ΡΠ΄Π΅ΡΠ΅ Ρ
ΠΎΡΠ΅ΡΡ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΡΡΠΈΠ»ΠΈ, ΡΡΠΎΠ±Ρ Π»ΠΈΠ±ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΠΌΠ°ΠΊΠ΅Ρ Π²Π°ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ, Π»ΠΈΠ±ΠΎ ΠΎΡΠ³Π°Π½ΠΈΠ·ΠΎΠ²Π°ΡΡ Π΅Π΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ»ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΠΎ Π½Π° Π²Π°ΡΠ΅ΠΌ ΡΠΊΡΠ°Π½Π΅. ΠΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ Ρ CSS flexbox
ΠΈ CSS grid
. ΠΠ΄Π½Π°ΠΊΠΎ Π΄Π»Ρ ΡΠΎΠ·Π΄Π°Π½ΠΈΡ ΠΏΠΎΡΡΡΡΠ°ΡΡΠΈΡ
Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ Π±ΠΎΠ»ΡΡΠ΅.
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ CSS position Π·Π°ΠΏΠΎΠ»Π½ΡΠ΅Ρ ΠΏΡΠΎΠ±Π΅Π»Ρ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡ Π²Π°ΠΌ ΡΠΎΠ·Π΄Π°ΡΡ Π°ΡΠΈΠΌΠΌΠ΅ΡΡΠΈΡΠ½ΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ, Π½Π° ΠΊΠΎΡΠΎΡΠΎΠΉ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ HTML Π² Π»ΡΠ±ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅, ΠΎΡΠ΄Π΅Π»ΡΡ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΡ ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΡΠΎΠΊΠ° ΠΈ Π΄ΡΡΠ³ΠΈΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ², Π΄Π΅Π»Π°Ρ Π²Π°ΡΡ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ Π±ΠΎΠ»Π΅Π΅ ΠΏΡΠΈΠ²Π»Π΅ΠΊΠ°ΡΠ΅Π»ΡΠ½ΠΎΠΉ ΠΈ ΡΠ΄ΠΎΠ±Π½ΠΎΠΉ Π΄Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ. .
Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ Π²Ρ ΡΠ·Π½Π°Π΅ΡΠ΅, ΡΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ CSS position, ΠΊΠ°ΠΊ ΠΎΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ, ΠΊΠ°ΠΊΠΈΠ΅ ΡΡΡΠ΅ΡΡΠ²ΡΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ ΠΌΠΎΠ³ΡΡ ΠΏΠΎΠΌΠΎΡΡ Π²Π°ΠΌ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅.
Π§ΡΠΎ ΡΠ°ΠΊΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS?
ΠΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ CSS position
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅. ΠΠ½ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅Ρ ΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ Π²Π·ΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΠ· ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅ΡΠ° ΠΏΠΎΡΠΎΠΊΠ° Π²Π°ΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ Π΅Π³ΠΎ ΡΠ°ΠΌ, Π³Π΄Π΅ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Π΄ΡΡΠ³ΠΈΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° CSS, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ 9.0003 ΡΠ²Π΅ΡΡ
Ρ , ΡΠΏΡΠ°Π²Π°
, ΡΠ½ΠΈΠ·Ρ
ΠΈ ΡΠ»Π΅Π²Π°
.
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ position ΠΈΠΌΠ΅Π΅Ρ ΠΏΡΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²ΡΠΏΠΎΠ»Π½ΡΡΡ ΡΠ°Π·Π½ΡΠ΅ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΈ Π²ΡΠ΅ ΠΎΠ½ΠΈ ΠΏΡΠ΅Π΄Π½Π°Π·Π½Π°ΡΠ΅Π½Ρ Π΄Π»Ρ ΠΏΠΎΠΌΠΎΡΠΈ Π² ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ ΠΎΠ±ΡΡΡΠ½ΡΠ΅ΡΡΡ, ΠΊΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΡΡΠΈ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΈ ΡΠ΅ΠΌ ΠΎΠ½ΠΈ ΠΎΡΠ»ΠΈΡΠ°ΡΡΡΡ, ΡΡΠΎ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π²Π°ΠΌ ΠΏΠΎΠ½ΡΡΡ, Π³Π΄Π΅ ΠΈ ΠΊΠΎΠ³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.
ΠΠ½Π°ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS
ΠΠΎΡ ΠΏΡΡΡ Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS:
1. ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠ°Ρ
2. ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ 9{
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΡΠ°ΡΠΈΡΠ½ΠΎΠ΅ | ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ | Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΠΉ | ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ | Π»ΠΈΠΏΠΊΠΈΠΉ;
}
ΠΠΎΠ΄ΠΎΠ²ΡΠΉ ΡΠ·ΡΠΊ: CSS (css) ΠΠ»Ρ Π½Π°ΡΠ°Π»Π° Π΄Π°Π²Π°ΠΉΡΠ΅ Π²ΠΎΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΡ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΈΠΌ div Ρ ΠΏΡΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°ΠΌΠΈ div
ΠΈ Π°Π±Π·Π°ΡΠ΅ΠΌ Π΄Π»Ρ ΠΈΠ΄Π΅Π½ΡΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ div
:
<Π΄Π΅Π»>
ΠΡΠΎ ΠΏΠ΅ΡΠ²ΡΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ
<Π΄Π΅Π»>
ΠΡΠΎ Π²ΡΠΎΡΠΎΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ
<Π΄Π΅Π»>
ΠΡΠΎ ΡΡΠ΅ΡΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ
<Π΄Π΅Π»>
ΠΡΠΎ ΡΠ΅ΡΠ²Π΅ΡΡΡΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ
<Π΄Π΅Π»>
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Π½ΠΎΠΌΠ΅Ρ ΠΏΡΡΡ
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: HTML, XML (xml) ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΡΠΈΠ»ΠΈΠ·ΡΠ΅ΠΌ ΡΡΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ div ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΠΎΠ½ΠΈ Π²ΡΠ³Π»ΡΠ΄Π΅Π»ΠΈ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ.
ΠΡΡΡ Π΄ΠΈΠ²ΠΎΠ² Ρ ΡΠ΅ΠΊΡΡΠΎΠΌ
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ One to Four , ΠΎΡΠΎΡΠΌΠ»Π΅Π½Π½ΡΠΉ Π² ΡΠ°Π·Π½ΡΡ
ΡΠ²Π΅ΡΠ°Ρ
.
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠ°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠ°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
β ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄Π»Ρ ΡΠ²ΠΎΠΉΡΡΠ²Π° position
. ΠΡΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² HTML ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ. ΠΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ position
ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΡ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ ΠΎΠ±ΡΡΠ½ΡΠΌ ΠΏΠΎΡΠΎΠΊΠΎΠΌ ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ Π±ΡΠ΄Π΅Ρ ΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΡ ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠΌ ΠΏΡΠ°Π²ΠΈΠ»Π°ΠΌ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ, ΠΊΠ°ΠΊ ΠΈ ΠΎΠΆΠΈΠ΄Π°Π»ΠΎΡΡ, Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΡΡΠΈΠ»Π΅ΠΉ CSS ΠΈΠ»ΠΈ Π±Π΅Π· Π½ΠΈΡ
.
ΠΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΠΊΠΎΠ³Π΄Π° Π²Ρ Π½Π΅ ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ position
ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΎΠ½ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ static
, ΡΠΎ Π΅ΡΡΡ Π±ΠΎΠ»ΡΡΠΈΠ½ΡΡΠ²ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ², Ρ ΠΊΠΎΡΠΎΡΡΠΌΠΈ Π²Ρ ΡΠ°Π±ΠΎΡΠ°Π΅ΡΠ΅, ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΡΡΡΡΡ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ. ΠΠ° Π½ΠΈΡ
Π½Π΅ Π²Π»ΠΈΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° top
, right
, bottom
, left
ΠΈ z-index
.
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π½ΠΈΠΆΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΡ static
ΠΏΡΠΈΠΌΠ΅Π½ΡΠ΅ΡΡΡ ΠΊΠΎ Π²ΡΠΎΡΠΎΠΌΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΡ div
, Π½ΠΎ Π²Ρ Π·Π°ΠΌΠ΅ΡΠΈΡΠ΅, ΡΡΠΎ ΡΡΠΎ Π½Π΅ Π²Π»ΠΈΡΠ΅Ρ Π½Π° Π²ΡΠ²ΠΎΠ΄ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
.ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ2 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #7f0df4;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΡΠ°ΡΠΈΡΠ½ΠΎΠ΅;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΡΡΡ Π±Π»ΠΎΠΊΠΎΠ²
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Π² ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΌ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ.
ΠΠΈΡΠ΅Π³ΠΎ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠ½ΠΎΠ³ΠΎ Π² ΡΡΠΎΠΌ Π·Π½Π°ΡΠ΅Π½ΠΈΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ Π½Π΅Ρ, Π½ΠΎ ΡΡΠΎΠΈΡ Π·Π½Π°ΡΡ, ΡΡΠΎ ΠΎΠ½ΠΎ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ π. ΠΠ°Π²Π°ΠΉΡΠ΅ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ Π΄ΡΡΠ³ΠΈΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΏΠΎ ΡΡΠ°Π²Π½Π΅Π½ΠΈΡ Ρ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ.
ΠΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
ΠΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ ΠΎΠ±ΡΡΠ½ΡΠΌ ΠΏΠΎΡΠΎΠΊΠΎΠΌ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ. Π‘Π°ΠΌΠΎ ΠΏΠΎ ΡΠ΅Π±Π΅ ΡΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ Π½ΠΈΡΠ΅Π³ΠΎ Π½Π΅ Π΄Π΅Π»Π°Π΅Ρ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π΅ΡΠ»ΠΈ Π²Ρ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΡΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ
ΠΊ ΡΡΠ΅ΡΡΠ΅ΠΌΡ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΡ div
.
. container3 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ce4dcd;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈ Π²ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅ Π½Π΅ Π±ΡΠ΄ΡΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½Ρ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΎΠ½ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅
, Π½ΠΎ ΠΈΠΌΠ΅Π΅Ρ Π±ΠΎΠ»ΡΡΠ΅ ΠΏΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ².
Π‘Π°ΠΌΠΎ ΠΏΠΎ ΡΠ΅Π±Π΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
ΠΡΠ΅ΠΈΠΌΡΡΠ΅ΡΡΠ²ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ ΡΡΠΎΠ³ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π° Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ΠΎΠ½ΠΎ Π΄Π°Π΅Ρ Π²Π°ΠΌ Π΄ΠΎΡΡΡΠΏ ΠΊ ΡΠ²ΠΎΠΉΡΡΠ²Π°ΠΌ Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΡ Π»ΡΠ±ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, Π½Π΅ Π²Π»ΠΈΡΡ Π½Π° ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ
ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ. ΠΡΠΈ ΡΠ²ΠΎΠΉΡΡΠ²Π° Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ Π²ΠΊΠ»ΡΡΠ°ΡΡ Π²Π΅ΡΡ
, Π»Π΅Π²ΠΎ
, ΠΏΡΠ°Π²ΠΎ
, Π½ΠΈΠ·
ΠΈ z-index
. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π²Π½ΠΈΠ· ΠΈ Π²ΠΏΡΠ°Π²ΠΎ ΡΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π°ΠΌΠΈ ΡΠ²Π΅ΡΡ
Ρ
ΠΈ ΡΠ»Π΅Π²Π°
.
. container3 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ce4dcd;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ;
Π²Π΅ΡΡ
: 50 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ;
ΡΠ»Π΅Π²Π°: 40 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Three ΠΏΠ΅ΡΠ΅ΠΊΡΡΠ²Π°Π΅ΡΡΡ Ρ
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Π§Π΅ΡΡΡΠ΅ Π±Π»ΠΎΠΊΠ° .
ΠΡ Π·Π°ΠΌΠ΅ΡΠΈΡΠ΅, ΡΡΠΎ ΡΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ Π½Π΅ Π²Π»ΠΈΡΠ΅Ρ Π½Π° ΠΎΠΊΡΡΠΆΠ°ΡΡΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ, ΠΊΠΎΡΠΎΡΠΎΠ΅ ΠΈΠ·Π½Π°ΡΠ°Π»ΡΠ½ΠΎ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΎΡΡΠ°Π΅ΡΡΡ ΠΏΡΡΡΡΠΌ. Π ΡΡΠΎΡ ΠΌΠΎΠΌΠ΅Π½Ρ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΠ°ΡΡ Π·Π°Π΄Π°Π²Π°ΡΡ ΡΠ΅Π±Π΅ Π²ΠΎΠΏΡΠΎΡ ΠΎΠ± ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ
.
Π£Π΄ΠΈΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ, Π½ΠΎ ΡΡΠΎ Π½Π΅ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΈΠ·Π±Π΅ΠΆΠ°ΡΡ ΡΠΈΡΡΠ°ΡΠΈΠΈ, Π² ΠΊΠΎΡΠΎΡΠΎΠΉ Π΄ΡΡΠ³ΠΈΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π΅ Π·Π°ΡΡΠΎΠ½ΡΡΡ. ΠΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ z-ΠΈΠ½Π΄Π΅ΠΊΡΠ°
ΠΈΠ»ΠΈ ΡΠΊΠ°Π·Π°Π½ΠΈΡ ΠΏΠΎΡΡΠ΄ΠΊΠ° ΡΡΠ΅ΠΊΠ° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΠΈΠ»ΠΈ Π΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° Π΄Π»Ρ Β«Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΒ» ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π² ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΡΡΠ΅ΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΊΠ»Π°Π΄ΡΠ²Π°Π΅ΡΡΡ ΠΏΠΎΠ²Π΅ΡΡ
ΡΠ΅ΡΠ²Π΅ΡΡΠΎΠ³ΠΎ. ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ z-index
ΠΊ ΡΠ΅ΡΠ²Π΅ΡΡΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π΅ Π΄Π°ΡΡ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΡΡΡΠ΅ΠΊΡΠ°, Π½ΠΎ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ Π²Π°ΠΌ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΏΠΎΠ²Π΅ΡΡ
ΡΡΠ΅ΡΡΠ΅Π³ΠΎ.
.container4 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ef74ff;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ;
z-ΠΈΠ½Π΄Π΅ΠΊΡ: 1;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΠ»Π΅ΠΌΠ΅Π½ΡΡ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ ΡΡΠΎΠΏΠΊΠΎΠΉ Π² ββΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅ Π² ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ΅
z-ΠΈΠ½Π΄Π΅ΠΊΡΠ°
ΡΠΎΠ±ΡΡΠ²Π΅Π½Π½ΠΎΡΡΡ.
ΠΠ±ΡΠΎΠ»ΡΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
ΠΠ±ΡΠΎΠ»ΡΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΈΠ· ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΡΠΎΠΊΠ° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΠΏΠΎΡΠ»Π΅Π΄ΡΡΡΠ΅Π³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π΅Π³ΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π±Π»ΠΈΠΆΠ°ΠΉΡΠ΅Π³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠ΅Π΄ΠΊΠ° ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° (Π»ΡΠ±ΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ, ΠΎΡΠ»ΠΈΡΠ½ΡΠΌ ΠΎΡ static
) .
ΠΠΎΠ³Π΄Π° ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΠΌΠ΅Π΅Ρ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΡ ΠΏΠΎΠ·ΠΈΡΠΈΡ, ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π²ΠΎΠΊΡΡΠ³ Π½Π΅Π³ΠΎ Π²Π΅Π΄ΡΡ ΡΠ΅Π±Ρ ΡΠ°ΠΊ, ΠΊΠ°ΠΊ Π±ΡΠ΄ΡΠΎ ΡΡΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π½Π΅ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅. Π Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π±ΡΠ»ΠΈ ΡΠ°Π½Π΅Π΅ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Ρ, ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΡΡΠ°Π΅ΡΡΡ ΠΎΠ΄ΠΈΠ½ ΠΏΠΎΠ²Π΅ΡΡ
Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΠΈ ΡΠ²ΠΎΡΠ°ΡΠΈΠ²Π°Π΅Ρ Π΄ΠΎΡΡΡΠΏΠ½ΠΎΠ΅ ΠΏΡΠΎΡΡΡΠ°Π½ΡΡΠ²ΠΎ.
. ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ2 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #7f0df4;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΠ±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ
ΠΏΡΠΈΠ²ΠΎΠ΄ΠΈΡ ΠΊ ΡΠΎΠΌΡ, ΡΡΠΎ ΡΡΠ΅ΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ ΠΌΠ΅ΡΡΠΎ Π²ΡΠΎΡΠΎΠ³ΠΎ.
Π ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΡΡΠ΅ΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ ΠΌΠ΅ΡΡΠΎ Π²ΡΠΎΡΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΠΎΡΡΠ°Π²Π»ΡΡ Π²ΡΠΎΡΠΎΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π·Π°Π΄Π΅ΡΠΆΠ°ΡΡΡΡ. ΠΡ ΡΠ°ΠΊΠΆΠ΅ Π·Π°ΠΌΠ΅ΡΠΈΡΠ΅, ΡΡΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΠΎΠ»ΡΡΠ΅ Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ ΠΏΠΎΠ»Π½ΠΎΠΉ ΡΠΈΡΠΈΠ½Ρ. ΠΡΠΎ ΡΠ²ΡΠ·Π°Π½ΠΎ Ρ ΡΠ΅ΠΌ, ΡΡΠΎ Π°Π±ΡΠΎΠ»ΡΡΠ½ΡΡ
ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΡΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΈΠΌΠ΅ΡΡ ΡΠΈΡΠΈΠ½Ρ, ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΡ Π½Π° Π°Π²ΡΠΎ
.
ΠΠ±ΡΠΎΠ»ΡΡΠ½ΠΎ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ² Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΡΠ°ΠΊΠΈΡ
ΠΊΠ°ΠΊ ΡΠ²Π΅ΡΡ
Ρ
, ΡΠ»Π΅Π²Π°
, ΡΠΏΡΠ°Π²Π°
ΠΈ ΡΠ½ΠΈΠ·Ρ
. Π’Π°ΠΊΠΆΠ΅ Π²Π°ΠΆΠ½ΠΎ ΠΏΠΎΠ½ΠΈΠΌΠ°ΡΡ, ΡΡΠΎ ΡΡΠΎΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ Π±Π»ΠΈΠΆΠ΅ Π²ΡΠ΅Π³ΠΎ ΠΊ ΠΏΡΠ΅Π΄ΠΊΡ. ΠΡΠΎ ΠΎΠ·Π½Π°ΡΠ°Π΅Ρ, ΡΡΠΎ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΈΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΌ, ΡΡΠΎΠ±Ρ ΡΠ»ΡΠΆΠΈΡΡ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½Π½ΡΠΌ ΠΏΡΠ΅Π΄ΠΊΠΎΠΌ.
. parent-ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ {
// ...
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ddd;
Π³ΡΠ°Π½ΠΈΡΠ°: 2px ΡΠΏΠ»ΠΎΡΠ½Π°Ρ #000;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ;
}
.ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ2 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #7f0df4;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅;
ΡΠ²Π΅ΡΡ
Ρ: 0;
ΡΠ»Π΅Π²Π°: 0;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
ΠΠ° ΠΏΠ΅ΡΠ²ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π²Π»ΠΈΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π°
top
ΠΈ
left
.
ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π²Π΅ΡΡ
Π½ΡΡ ΠΈ Π»Π΅Π²Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ Π±ΡΠ»ΠΈ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Ρ Π² ΠΊΠ°ΡΠ΅ΡΡΠ²Π΅ Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠΉ ΡΠΎΡΠΊΠΈ, ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ Π² Π²Π΅ΡΡ
Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΎ, ΡΡΠΎΠ±Ρ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² ΡΠ΅Π½ΡΡΠ΅ ΠΈΠ»ΠΈ Π² ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ Π½Π° Π²Π°ΡΠ΅ΠΌ Π²Π΅Π±-ΡΠ°ΠΉΡΠ΅.
ΠΡΠ»ΠΈ Π΄Π»Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° Π½Π΅ Π·Π°Π΄Π°Π½Π° ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ
, ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ Π² Π²Π΅ΡΡ
Π½Π΅ΠΌ Π»Π΅Π²ΠΎΠΌ ΡΠ³Π»Ρ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π³ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠ΅Π΄ΠΊΠ°, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠ²Π»ΡΠ΅ΡΡΡ ΡΠ΅Π»ΠΎΠΌ Π²ΡΠ΅ΠΉ ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΡΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ ΠΠ²Π° ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ Π·Π° ΠΏΡΠ΅Π΄Π΅Π»Ρ Π±Π»ΠΎΠΊΠΎΠ² ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ².
Π€ΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ CSS
ΠΠ°ΠΊ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΠ· Π½Π°Π·Π²Π°Π½ΠΈΡ, ΡΡΠ° ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ Π΄Π»Ρ ΡΠΈΠΊΡΠ°ΡΠΈΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π² ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ Π²Π°ΡΠ΅ΠΉ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠ½ ΡΠ΄Π°Π»ΡΠ΅Ρ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈΠ· ΠΎΠ±ΡΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΡΠΎΠΊΠ° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΡΠ΅Ρ Π΅Π³ΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ±Π»Π°ΡΡΠΈ ΠΏΡΠΎΡΠΌΠΎΡΡΠ° (ΡΠ°ΡΡΡ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°, Π²ΠΈΠ΄ΠΈΠΌΠ°Ρ Π² Π²Π°ΡΠ΅ΠΌ Π±ΡΠ°ΡΠ·Π΅ΡΠ΅), Π° Π½Π΅ Π±Π»ΠΈΠΆΠ°ΠΉΡΠ΅Π³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΡΠ΅Π΄ΠΊΠ° ΠΊΠ°ΠΊ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ³ΠΎ.
.container4 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ef74ff;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
Π§Π΅ΡΠ²Π΅ΡΡΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² Π±Π»ΠΎΠΊΠ΅-ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ΅ ΠΈΡΠΏΡΠ°Π²Π»Π΅Π½.
ΠΡ Π±ΡΠ΄Π΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° Π½Π°ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΡ, ΡΡΠΎΠ±Ρ ΡΠΊΠ°Π·Π°ΡΡ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ.
.container4 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ef74ff;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅;
Π²Π΅ΡΡ
: 50%;
ΡΠ»Π΅Π²Π°: 0;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
Π§Π΅ΡΠ²Π΅ΡΡΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ° Π·Π°ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½ ΠΈ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ Π·Π° ΠΏΡΠ΅Π΄Π΅Π»Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°.
Π ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ, ΠΊΠΎΠ³Π΄Π° Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΡΠΈΡΡ ΠΊΠ½ΠΎΠΏΠΊΡ Π² Π½ΠΈΠΆΠ½ΡΡ ΡΠ°ΡΡΡ ΡΡΡΠ°Π½ΠΈΡΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ Π²Π²Π΅ΡΡ
. ΠΡ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅, Π΅ΡΠ»ΠΈ Π²Ρ ΡΠ°ΠΊΠΆΠ΅ Ρ
ΠΎΡΠΈΡΠ΅ Π·Π°ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ Π² Π²Π΅ΡΡ
Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ ΡΠΊΡΠ°Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ.
ΠΠΎΠ³Π΄Π° Π²Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΡΠ΅ΡΠ΅ ΡΠΈΠΊΡΠΈΡΡΠ΅ΠΌΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΎΠ½ ΠΎΡΡΠ°Π΅ΡΡΡ Π² ΡΡΠΎΠΌ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ, Π΄Π°ΠΆΠ΅ Π΅ΡΠ»ΠΈ Π²Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅ΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΎΡΠ»ΠΈΡΠ°Ρ Π΅Π³ΠΎ ΠΎΡ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π½Π΅ ΠΎΡΡΠ°Π²Π»ΡΠ΅Ρ ΠΏΡΡΡΠΎΠ³ΠΎ ΠΌΠ΅ΡΡΠ°, ΠΊΠ°ΠΊ ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½Π°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ.
GIF-ΡΠ°ΠΉΠ», ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡΠΈΠΉ ΡΠ΅ΡΠ²Π΅ΡΡΡΠΉ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅Ρ, Π·Π°ΠΊΡΠ΅ΠΏΠ»Π΅Π½Π½ΡΠΉ Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΠΊΠΎΠ½ΡΠ΅ΠΉΠ½Π΅ΡΠ°.
ΠΠΈΠΏΠΊΠΎΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ CSS
ΠΠΈΠΏΠΊΠ°Ρ ΠΏΠΎΠ·ΠΈΡΠΈΡ ΠΎΡΠ΅Π½Ρ Ρ
ΠΎΡΠΎΡΠ°. ΠΡΠΎ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°ΡΠΈΡ
ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΡ
ΠΈ
ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΡ
ΠΏΠΎΠ·ΠΈΡΠΈΠΉ. ΠΡΠΎ ΡΠ²ΡΠ·Π°Π½ΠΎ Ρ ΡΠ΅ΠΌ, ΡΡΠΎ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π±ΡΠ΄Π΅Ρ ΠΎΡΡΠ°Π²Π°ΡΡΡΡ Π² ΠΎΠ±ΡΡΠ½ΠΎΠΌ ΠΏΠΎΡΠΎΠΊΠ΅ Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΡ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ Π΄ΠΎ ΡΠ΅Ρ
ΠΏΠΎΡ, ΠΏΠΎΠΊΠ° Π½Π΅ Π΄ΠΎΡΡΠΈΠ³Π½Π΅Ρ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ, ΠΏΠΎΡΠ»Π΅ ΡΠ΅Π³ΠΎ ΠΎΠ½ ΡΡΠ°Π½ΠΎΠ²ΠΈΡΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΌ.
. container3 {
ΡΠ²Π΅Ρ ΡΠΎΠ½Π°: #ce4dcd;
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: Π»ΠΈΠΏΠΊΠΎΠ΅;
ΡΠ²Π΅ΡΡ
Ρ: 0;
}
Π―Π·ΡΠΊ ΠΊΠΎΠ΄Π°: CSS (css)
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ Π²ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π±ΡΠ΄ΡΡ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°ΡΡΡΡ Π½ΠΎΡΠΌΠ°Π»ΡΠ½ΠΎ, ΠΏΠΎΠΊΠ° ΡΡΠ΅ΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π½Π΅ Π΄ΠΎΡΡΠΈΠ³Π½Π΅Ρ Π²Π΅ΡΡΠΈΠ½Ρ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. ΠΠΎΡΠΎΠΌ ΠΏΡΠΈΠ»ΠΈΠΏΠ°Π΅Ρ. ΠΠ½ Π²Π΅Π΄Π΅Ρ ΡΠ΅Π±Ρ ΠΊΠ°ΠΊ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΠΏΠΎΠΊΠ° Π½Π΅ Π΄ΠΎΡΡΠΈΠ³Π½Π΅Ρ ΡΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ; Π·Π°ΡΠ΅ΠΌ ΠΎΠ½ ΡΠΈΠΊΡΠΈΡΡΠ΅ΡΡΡ ΠΈ, ΠΊΠ°ΠΆΠ΅ΡΡΡ, ΠΏΡΠΈΠ»ΠΈΠΏΠ°Π΅Ρ ΠΊ ΡΡΠΎΠΌΡ ΠΌΠ΅ΡΡΡ.
Π‘ΡΡΠ°Π½ΠΈΡΠ° ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ ΡΠ»Π°ΡΡΠΈΡΠ½ΡΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ ΠΏΠΎΡΠ»Π΅ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.
βΉοΈ Π§ΡΠΎΠ±Ρ Π»ΠΈΠΏΠΊΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΡΠ°Π±ΠΎΡΠ°Π»ΠΎ, Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΊΠ°Π·Π°ΡΡ Ρ
ΠΎΡΡ Π±Ρ ΠΎΠ΄Π½ΠΎ ΠΈΠ· ΡΠ²ΠΎΠΉΡΡΠ² ΡΠ²Π΅ΡΡ
Ρ, ΡΠΏΡΠ°Π²Π°, ΡΠ½ΠΈΠ·Ρ ΠΈΠ»ΠΈ ΡΠ»Π΅Π²Π°.
ΠΡΠΎ ΠΈΠ΄Π΅Π°Π»ΡΠ½ΠΎ, ΠΊΠΎΠ³Π΄Π° Ρ Π²Π°Ρ Π΅ΡΡΡ ΠΏΠ°Π½Π΅Π»Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠΈ, ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½Π½Π°Ρ ΠΏΠΎΡΠ»Π΅ Π²Π°ΡΠ΅Π³ΠΎ Π³Π»Π°Π²Π½ΠΎΠ³ΠΎ ΡΠ°Π·Π΄Π΅Π»Π°, ΠΈ Π²Ρ Ρ
ΠΎΡΠ΅Π»ΠΈ Π±Ρ ΠΏΡΠΈΠ΄Π΅ΡΠΆΠΈΠ²Π°ΡΡΡΡ Π²Π΅ΡΡ
Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ, ΠΊΠΎΠ³Π΄Π° ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΠΏΡΠΎΠΊΡΡΡΠΈΠ²Π°Π΅Ρ Π΄ΠΎ Π²Π΅ΡΡ
Π½Π΅ΠΉ ΡΠ°ΡΡΠΈ ΡΠΊΡΠ°Π½Π°. ΠΡΠΎΠΌΠ΅ ΡΠΎΠ³ΠΎ, Π΅ΡΠ»ΠΈ Ρ Π²Π°Ρ Π΅ΡΡΡ ΡΠΏΠΈΡΠΎΠΊ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² Ρ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΌΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΏΡΠΈΠΊΡΠ΅ΠΏΠΈΡΡ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Π΅ΠΌ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±ΠΈΡΡΡΡ ΡΡΠΎΠ³ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ.
ΠΠ° ΡΠΈΡΡΠ½ΠΊΠ΅ ΠΏΠΎΠΊΠ°Π·Π°Π½Ρ Π²ΡΠ΅ Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΡΠ²ΠΎΠΉΡΡΠ²Π°
position
.
ΠΠΎΡ Π΄Π΅ΠΌΠΎΠ½ΡΡΡΠ°ΡΠΈΡ, ΠΏΠΎΠΊΠ°Π·ΡΠ²Π°ΡΡΠ°Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ Π²ΡΠ΅Ρ
Π·Π½Π°ΡΠ΅Π½ΠΈΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΉ.
Π Π°Π·Π»ΠΈΡΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎΠΌ position ΠΈ ΡΠΈΡΡΠ΅ΠΌΠ°ΠΌΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ CSS
Π€Π»Π΅ΠΊΡΠ±ΠΎΠΊΡ ΠΈ ΡΠ΅ΡΠΊΠ° CSS β ΡΡΠΎ ΡΠΈΡΡΠ΅ΠΌΡ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π΄Π»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ Π±Π°Π·ΠΎΠ²ΡΡ
ΠΈ ΡΠ»ΠΎΠΆΠ½ΡΡ
ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΎΠΊ. ΠΠΎ Π²Ρ Π½Π΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΠ°ΡΡ ΡΡΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π³Π΄Π΅ ΡΠ³ΠΎΠ΄Π½ΠΎ, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π²Ρ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Ρ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠΉ (X) ΠΈ ΠΏΠΎΠΏΠ΅ΡΠ΅ΡΠ½ΠΎΠΉ (Y) ΠΎΡΡΠΌΠΈ.
ΠΠ»Π»ΡΡΡΡΠ°ΡΠΈΡ ΡΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΡΠΈΡΡΠ΅ΠΌΡ CSS flexbox ΠΈ grid layout ΡΠΏΠΎΡΡΠ΄ΠΎΡΠΈΠ²Π°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ Π½Π° Π²Π΅Π±-ΡΡΡΠ°Π½ΠΈΡΠ΅.
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²Π° CSS position Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ²ΠΎΠΉ ΠΊΠΎΠ½ΡΠ΅Π½Ρ Π² Π»ΡΠ±ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅, ΠΎΡΠ΄Π΅Π»ΠΈΠ² ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΎΡ Π΄ΡΡΠ³ΠΈΡ
ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ². ΠΡΡΠ³ΠΈΠΌΠΈ ΡΠ»ΠΎΠ²Π°ΠΌΠΈ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ²ΠΎΠ±ΠΎΠ΄Π½ΠΎ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ ΠΏΠΎ ΡΠΊΡΠ°Π½Ρ, ΠΏΠΎΡΠΊΠΎΠ»ΡΠΊΡ Π²Ρ Π½Π΅ ΠΎΠ³ΡΠ°Π½ΠΈΡΠ΅Π½Ρ ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ ΠΎΡΡΡ.
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ CSS position ΠΎΡΡΠΎΠ΅Π΄ΠΈΠ½ΡΠ΅Ρ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΈ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΎ Π³Π΄Π΅ ΡΠ³ΠΎΠ΄Π½ΠΎ.
ΠΠΎΠ΄Π²Π΅Π΄Π΅Π½ΠΈΠ΅ ΠΈΡΠΎΠ³ΠΎΠ²
Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ Π²Ρ ΡΠ·Π½Π°Π»ΠΈ ΠΎ ΡΠ²ΠΎΠΉΡΡΠ²Π΅ position, ΠΎ ΡΠΎΠΌ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ, ΠΈ ΠΎ Π΅Π³ΠΎ ΡΠ°Π·Π»ΠΈΡΠ½ΡΡ
Π·Π½Π°ΡΠ΅Π½ΠΈΡΡ
. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΡΠ·Π½Π°Π»ΠΈ ΠΎ ΡΠ°Π·Π»ΠΈΡΠΈΡΡ
ΠΌΠ΅ΠΆΠ΄Ρ ΡΡΠΈΠΌΠΈ Π·Π½Π°ΡΠ΅Π½ΠΈΡΠΌΠΈ, ΠΏΠΎΡΡΠΎΠΌΡ Π·Π½Π°Π΅ΡΠ΅, ΠΊΠΎΠ³Π΄Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠ΅ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS ΠΈ Π΅Π³ΠΎ Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅.
ΠΠΎΠ»ΡΡΠ°ΠΉΡΠ΅ ΡΠ΄ΠΎΠ²ΠΎΠ»ΡΡΡΠ²ΠΈΠ΅ ΠΎΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠΈΡΠΎΠ²Π°Π½ΠΈΡ!
Π― ΠΠΆΠΎΡΠ» ΠΠ»Π°Π²Π°Π½Π»Π΅, ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡΠ° ΠΈ ΡΠ΅Ρ
Π½ΠΈΡΠ΅ΡΠΊΠΈΠΉ ΠΏΠΈΡΠ°ΡΠ΅Π»Ρ, Π·Π°ΠΈΠ½ΡΠ΅ΡΠ΅ΡΠΎΠ²Π°Π½Π½ΡΠΉ Π² ΡΠΎΠΌ, ΡΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΠΠ½ΡΠ΅ΡΠ½Π΅Ρ Π΄ΠΎΡΡΡΠΏΠ½ΡΠΌ Π΄Π»Ρ Π²ΡΠ΅Ρ
, Π²ΡΠ΅Π³Π΄Π° ΠΈΡΠ° ΡΠΏΠΎΡΠΎΠ±Ρ ΠΎΡΠ±Π»Π°Π³ΠΎΠ΄Π°ΡΠΈΡΡ ΡΠ΅Ρ
Π½ΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²ΠΎ. ΠΠΎΠ΄ΠΏΠΈΡΠΈΡΠ΅ΡΡ Π½Π° ΠΌΠ΅Π½Ρ ΠΈ ΡΠ²ΡΠΆΠΈΡΠ΅ΡΡ ΡΠΎ ΠΌΠ½ΠΎΠΉ ΠΏΠΎ ΡΠ΅Π»Π΅ΡΠΎΠ½Ρ Twitter .
ΠΠΎΠ·ΠΈΡΠΈΡ CSS β W3schools
Π½Π°
Π§ΡΠΎΠ±Ρ ΡΠΊΠ°Π·Π°ΡΡ ΠΏΠΎΠ·ΠΈΡΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ CSS position. ΠΡΠΎ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ Π΄Π»Ρ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΈΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΏΠΎΠ·Π°Π΄ΠΈ Π΄ΡΡΠ³ΠΎΠ³ΠΎ. ΠΠ½ ΡΠ°ΠΊΠΆΠ΅ Π½Π°Ρ
ΠΎΠ΄ΠΈΡ ΡΠ²ΠΎΠ΅ ΠΏΡΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π² ΡΡΡΠ΅ΠΊΡΠ΅ Π°Π½ΠΈΠΌΠ°ΡΠΈΠΈ ΠΏΠΎ ΡΡΠ΅Π½Π°ΡΠΈΡ. Π‘Π²ΠΎΠΉΡΡΠ²Π° top, bottom, left ΠΈ right ΠΌΠΎΠ³ΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡΡΡ ΠΏΠΎΡΠ»Π΅ ΡΠ²ΠΎΠΉΡΡΠ²Π° position Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°.
Π‘ΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ CSS:
ΠΡΠ΄ΡΡΠΈ ΠΏΠΎΠ·ΠΈΡΠΈΠ΅ΠΉ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΎΠ½Π° ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΡΠ΅Ρ HTML-ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΠΈΠΈ Ρ ΠΎΠ±ΡΡΠ½ΡΠΌ ΠΏΠΎΡΠΎΠΊΠΎΠΌ ΡΡΡΠ°Π½ΠΈΡΡ, ΠΈ ΡΠ²ΠΎΠΉΡΡΠ²Π° top, bottom, left ΠΈ right Π½Π΅ Π²Π»ΠΈΡΡΡ Π½Π° ΡΡΠΎ.
ΠΡΠΈΠΌΠ΅Ρ:
<Π³ΠΎΠ»ΠΎΠ²Π°>
<ΡΡΠΈΠ»Ρ>
div.static {
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΡΠ°ΡΠΈΡΠ½ΠΎΠ΅;
Π³ΡΠ°Π½ΠΈΡΠ°: 5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ ΡΠΏΠ»ΠΎΡΠ½ΠΎΠ³ΠΎ ΠΊΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΡΠ²Π΅ΡΠ°;
}
<ΡΠ΅Π»ΠΎ>
ΠΡΠΈΠΌΠ΅Ρ:
<Π΄Π΅Π»>
ΠΡΠΈΠ²Π΅Ρ, ΠΌΠΈΡ!!
|
ΠΡΠ²ΠΎΠ΄:
ΠΠΎΡΡΠ½Π΅Π½ΠΈΠ΅:
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΠΏΠΎΠΊΠ°Π·Π°Π»ΠΈ ΡΡΡΠ΅ΠΊΡ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠ³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ CSS.
Π€ΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ CSS:
Π§ΡΠΎΠ±Ρ ΡΠ΅ΠΊΡΡ ΠΎΡΡΠ°Π²Π°Π»ΡΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΌ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠΊΠ½Π° Π±ΡΠ°ΡΠ·Π΅ΡΠ°, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ. ΠΡΠΎΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ ΡΠ΅ΠΊΡΡ Π½Π΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ°Π΅ΡΡΡ Π΄Π°ΠΆΠ΅ ΠΏΡΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠ΅ ΠΎΠΊΠ½Π°.
ΠΡΠΈΠΌΠ΅Ρ:
<Π³ΠΎΠ»ΠΎΠ²Π°>
<ΡΡΠΈΠ»Ρ>
div.fixed {
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅;
Π³ΡΠ°Π½ΠΈΡΠ°: 5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ ΡΠΏΠ»ΠΎΡΠ½ΠΎΠ³ΠΎ ΠΊΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΡΠ²Π΅ΡΠ°;
}
<ΡΠ΅Π»ΠΎ>
ΠΡΠΈΠΌΠ΅Ρ:
<Π΄Π΅Π»>
ΠΡΠΈΠ²Π΅Ρ, ΠΌΠΈΡ!!
|
ΠΡΠ²ΠΎΠ΄:
ΠΠ±ΡΡΡΠ½Π΅Π½ΠΈΠ΅:
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΠ»ΠΈ ΡΡΡΠ΅ΠΊΡ ΡΠΈΠΊΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΉ ΠΏΠΎΠ·ΠΈΡΠΈΠΈ CSS.
ΠΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ CSS:
Π§ΡΠΎΠ±Ρ ΠΏΠΎΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ HTML ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ Π΅Π³ΠΎ Π½ΠΎΡΠΌΠ°Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ, ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ ΡΠ²ΠΎΠΉΡΡΠ²ΠΎ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
ΠΡΠΈΠΌΠ΅Ρ:
<Π³ΠΎΠ»ΠΎΠ²Π°>
<ΡΡΠΈΠ»Ρ>
div.ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΡΠΉ {
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: ΡΠΎΠ΄ΡΡΠ²Π΅Π½Π½ΠΈΠΊ;
Π³ΡΠ°Π½ΠΈΡΠ°: 5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ ΡΠΏΠ»ΠΎΡΠ½ΠΎΠ³ΠΎ ΠΊΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΡΠ²Π΅ΡΠ°;
}
<ΡΠ΅Π»ΠΎ>
ΠΡΠΈΠΌΠ΅Ρ:
<Π΄Π΅Π»>
ΠΡΠΈΠ²Π΅Ρ, ΠΌΠΈΡ!!
|
ΠΡΠ²ΠΎΠ΄:
ΠΠ±ΡΡΡΠ½Π΅Π½ΠΈΠ΅:
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΌΡ ΠΎΡΠΎΠ±ΡΠ°Π·ΠΈΠ»ΠΈ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ CSS.
ΠΠ±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ CSS:
ΠΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ ΡΠΎΠ΄ΠΈΡΠ΅Π»ΡΡΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Ρ ΠΏΠΎΠ·ΠΈΡΠΈΠ΅ΠΉ, ΠΎΡΠ»ΠΈΡΠ½ΠΎΠΉ ΠΎΡ ΡΡΠ°ΡΠΈΡΠ΅ΡΠΊΠΎΠΉ, ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°ΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ HTML Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½ΠΈΡ CSS. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠ°Π·ΠΌΠ΅ΡΡΠΈΡΡ ΡΠ»Π΅ΠΌΠ΅Π½Ρ Π² Π»ΡΠ±ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ ΡΡΡΠ°Π½ΠΈΡΡ. Π‘ΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ Π±Π»ΠΎΠΊ β ΡΡΠΎ HTML, Π΅ΡΠ»ΠΈ ΡΠ°ΠΊΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Π½Π΅Ρ.
ΠΡΠΈΠΌΠ΅Ρ:
<Π³ΠΎΠ»ΠΎΠ²Π°>
<ΡΡΠΈΠ»Ρ>
div.absolute {
ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅: Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅;
Π³ΡΠ°Π½ΠΈΡΠ°: 5 ΠΏΠΈΠΊΡΠ΅Π»Π΅ΠΉ ΡΠΏΠ»ΠΎΡΠ½ΠΎΠ³ΠΎ ΠΊΡΠ°ΡΠ½ΠΎΠ³ΠΎ ΡΠ²Π΅ΡΠ°;
}
<ΡΠ΅Π»ΠΎ>
ΠΡΠΈΠΌΠ΅Ρ:
<Π΄Π΅Π»>
ΠΡΠΈΠ²Π΅Ρ, ΠΌΠΈΡ!!
|
ΠΡΠ²ΠΎΠ΄:
ΠΠ±ΡΡΡΠ½Π΅Π½ΠΈΠ΅:
Π ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²ΡΡΠ΅ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎΠ΅ ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ CSS.
Π‘Π²ΠΎΠΉΡΡΠ²Π° ΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ CSS:
Π‘Π²ΠΎΠΉΡΡΠ²ΠΎ | ΠΠ½Π°ΡΠ΅Π½ΠΈΡ | ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ |
ΠΠΠ’ΠΠ― | 535350 | , | , | , | , | , | , | ,,, | , | , | , | , | , | , | ,,,,,,. .
clip | shape, auto, inherit | ΠΠ»Ρ Π²ΡΡΠ΅Π·Π°Π½ΠΈΡ Π°Π±ΡΠΎΠ»ΡΡΠ½ΠΎ ΠΏΠΎΠ·ΠΈΡΠΈΠΎΠ½ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ°. |
ΠΊΡΡΡΠΎΡ | URL, Π°Π²ΡΠΎ, ΠΏΠ΅ΡΠ΅ΠΊΡΠ΅ΡΡΠΈΠ΅, ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΡΠΊΠ°Π·Π°ΡΠ΅Π»Ρ, ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅, e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize , ΡΠΌΡ, ΠΏΠΎΠ΄ΠΎΠΆΠ΄ΠΈ, ΠΏΠΎΠΌΠΎΠ³ΠΈ | ΠΠ»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΠΈΠΏΠ° ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅ΠΌΠΎΠ³ΠΎ ΠΊΡΡΡΠΎΡΠ°.
|