
рд▓рдЧрднрдЧ рджреЛ рд╕рд╛рд▓ рдкрд╣рд▓реЗ, рд▓реЗрдЦ " рдЬреЗрдб-рдЗрдВрдбреЗрдХреНрд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХрд┐рд╕реА рдиреЗ рдЖрдкрдХреЛ рдХреНрдпрд╛ рдирд╣реАрдВ рдмрддрд╛рдпрд╛ " (рдФрд░ рдЗрд╕рдХрд╛ рдЕрдиреБрд╡рд╛рдж "рд╣реИрдмрд░ рдкрд░" рдЬреЗрдб-рдЗрдВрдбреЗрдХреНрд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХрд┐рд╕реА рдиреЗ рдЖрдкрдХреЛ рдХреНрдпрд╛ рдирд╣реАрдВ рдмрддрд╛рдпрд╛ ") рдкреНрд░рдХрд╛рд╢рд┐рдд рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛, рдЬрд┐рд╕рдХреЗ рд▓реЗрдЦрдХ рдЕрд▓реНрдкрдЬреНрдЮрд╛рдд рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╛рдд рдХрд░рддреЗ рд╣реИрдВ ( рд╡реЛрдЯрд┐рдВрдЧ рдХреЗ 76% рд╣реЗрдмрд░ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ) рдЗрд╕рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдкрд╣рд▓реА рдмрд╛рд░ ), рд▓реЗрдХрд┐рди рдирдП рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдмрдирд╛рдиреЗ рдХреА рдкреНрд░рд▓реЗрдЦрд┐рдд рд╕рдВрднрд╛рд╡рдирд╛ рдПрдХ рд╕реЗ рдХрдо
opacity
рд╕рдВрдХреЗрдд рджреЗрддреА рд╣реИред
рд▓реЗрдХрд┐рди рд▓реЗрдЦ рдХреЗ рд╢реАрд░реНрд╖рдХ рдХреЗ рдмрд╛рд╡рдЬреВрдж, рд▓реЗрдЦрдХреЛрдВ рдиреЗ рдЕрднреА рддрдХ рдЖрдкрдХреЛ рдХреБрдЫ рдФрд░ рдирд╣реАрдВ рдмрддрд╛рдпрд╛ рд╣реИред
рдпрд╣ рдорд╛рдирд╛ рдЬрд╛рддрд╛ рд╣реИ рдХрд┐ рдЖрдк рдПрдХ рд╕реНрдЯреИрдХрд┐рдВрдЧ рд╕рдВрджрд░реНрдн рдХреА рдЕрд╡рдзрд╛рд░рдгрд╛ рд╕реЗ рдкрд░рд┐рдЪрд┐рдд рд╣реИрдВред
рдЖрдо рдорд╛рддрд╛-рдкрд┐рддрд╛ рдХреЗ рд╕рд╛рде рддрддреНрд╡ рдЬреЛ рдЖрдЧреЗ рдпрд╛ рдкреАрдЫреЗ рдПрдХ рд╕рд╛рде рдЪрд▓рддреЗ рд╣реИрдВ, рдЙрдиреНрд╣реЗрдВ рдПрдХ рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдХреЗ рд░реВрдк рдореЗрдВ рдЬрд╛рдирд╛ рдЬрд╛рддрд╛ рд╣реИ ред рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдХреЛ рд╕рдордЭрдирд╛- рд▓реЗрдЦ рд╕реЗ " рдЬреЗрдб-рдЗрдВрдбреЗрдХреНрд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЖрдкрдХреЛ рдХрд┐рд╕реА рдиреЗ рдирд╣реАрдВ рдмрддрд╛рдпрд╛ "ред рд╡рд┐рд╖рдп рдХреЛ рд╕рдордЭрдиреЗ рдХреЗ рд▓рд┐рдП, рдореИрдВ рдЕрддреНрдпрдзрд┐рдХ рдЕрдиреБрд╢рдВрд╕рд╛ рдХрд░рддрд╛ рд╣реВрдВ рдХрд┐ рдЖрдк рдПрдордбреАрдПрди рдкрд░ рдЙрд╕рдХреЗ рдпрд╛ рдЙрд╕рдХреЗ рдХреНрд▓рд╛рд╕рд┐рдХ рдХрд╛рдо рд╕реЗ рдкрд░рд┐рдЪрд┐рдд рд╣реЛрдВредz-index
рдФрд░ рддрддреНрд╡реЛрдВ рдХреЗ рдХреНрд░рдо рдХреЛ рд╕рдордЭрдиреЗ рдХреА рдХреБрдВрдЬреА рд╣реИред
рдкреНрд░рддреНрдпреЗрдХ рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдХрд╛ HTML рд╕рдВрд░рдЪрдирд╛ рдореЗрдВ рдЕрдкрдирд╛ рдореВрд▓ рддрддреНрд╡ рд╣реИред рдПрдХ рддрддреНрд╡ рдкрд░ рдПрдХ рдирдпрд╛ рд╕рдВрджрд░реНрдн рдмрдирд╛рдиреЗ рдХреЗ рдХреНрд╖рдг рдореЗрдВ, рд╕рднреА рдмрд╛рд▓ рддрддреНрд╡ рднреА рдЗрд╕ рд╕рдВрджрд░реНрдн рдореЗрдВ рдЖрддреЗ рд╣реИрдВ рдФрд░ рд╕реНрдЯреИрдХрд┐рдВрдЧ рдХреНрд░рдо рдореЗрдВ рдЕрдкрдирд╛ рд╕реНрдерд╛рди рд▓реЗрддреЗ рд╣реИрдВред рдпрджрд┐ рдПрдХ рддрддреНрд╡ рдПрдХ рдЙрдкрд░рд┐рд╢рд╛рдпреА рд╕рдВрджрд░реНрдн рдХреЗ рдмрд╣реБрдд рдиреАрдЪреЗ рд╕реНрдерд┐рдд рд╣реИ , рддреЛ рдХрд┐рд╕реА рднреА рдХрд▓реНрдкрдиреАрдп рдФрд░ рдЕрдирд┐рд░реНрд╡рдЪрдиреАрдп рддрд░реАрдХреЗ рд╕реЗ рдкрдбрд╝реЛрд╕реА рдХреЗ рдЙрдкрд░рд┐рд╢рд╛рдпреА рд╕рдВрджрд░реНрдн рдореЗрдВ рдЗрд╕реЗ рдХрд┐рд╕реА рдЕрдиреНрдп рддрддреНрд╡ рдкрд░ рдкреНрд░рджрд░реНрд╢рд┐рдд рдХрд░рдирд╛ рд╕рдВрднрд╡ рд╣реЛрдЧрд╛, рдкрджрд╛рдиреБрдХреНрд░рдо рдореЗрдВ рдЙрдЪреНрдЪрддрд░ рд╕реНрдерд┐рдд, рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐z-index
рдХреЗ рд╕рд╛рде рдПрдХ рдорд┐рд▓рд┐рдпрди рддрдХред
рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдорд╛рдорд▓реЛрдВ рдореЗрдВ рдПрдХ рдирдпрд╛ рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдмрдирддрд╛ рд╣реИ:
- рдореВрд▓ рддрддреНрд╡ (
) . , ( ), .
) . , ( ), .
static
рдЕрд▓рд╛рд╡рд╛ рдПрдХ рддрддреНрд╡ рдФрд░auto
рдЕрд▓рд╛рд╡рд╛ рдПрдХz-index
рдореВрд▓реНрдпредposition: fixed
рд▓рд┐рдП рдПрдХ рдЕрдкрд╡рд╛рдж рдХреЛ рдЫреЛрдбрд╝рдХрд░position: fixed
, рд▓реЗрдХрд┐рди рдореИрдВрдиреЗ рдЗрд╕реЗ рдПрдХ рдЕрд▓рдЧ рдЖрдЗрдЯрдо рдореЗрдВ рдмрдирд╛рдпрд╛ред
рдПрдХ рддрддреНрд╡ рдореЗрдВ1
рд╕реЗ рдХрдо рдХреАopacity
рд╣реЛрддреА рд╣реИ ред
position: static
рдХреЗ рдорд╛рдорд▓реЗ рдореЗрдВ рднреА,auto
рдЕрд▓рд╛рд╡рд╛ рдПрдХz-index
рдореВрд▓реНрдп рдХреЗ рд╕рд╛рде рдПрдХ рдлреНрд▓реЗрдХреНрд╕ рддрддреНрд╡position: static
ред
рдкрд░рд┐рд╡рд░реНрддрд┐рдд рддрддреНрд╡:none
рдЕрд▓рд╛рд╡рд╛ рдЕрдиреНрдпtransform
рдореВрд▓реНрдп ;preserve-3d
рдореВрд▓реНрдп рдХреЗ рд╕рд╛рдеtransform-style
; рдФрд░none
рдЕрд▓рд╛рд╡рд╛ рдПрдХ рдореВрд▓реНрдп рдХреЗ рд╕рд╛рдеperspective
ред
рд╕реАрдПрд╕рдПрд╕ рдХреНрд╖реЗрддреНрд░:normal
рд╕реЗ рднрд┐рдиреНрдиcontent
рддрддреНрд╡ рдХреЗnone
рдЕрдиреНрдп рд╕реЗflow-from
рдореВрд▓реНрдп рдирд┐рд░реНрдзрд╛рд░рд┐рдд рдХрд░рдирд╛ ред
рдкреГрд╖реНрдард╛рдВрдХрд┐рдд рдореАрдбрд┐рдпрд╛: рдкреНрд░рддреНрдпреЗрдХ рдкреГрд╖реНрда-рдорд╛рд░реНрдЬрд┐рди рдмреЙрдХреНрд╕ рдЕрдкрдирд╛ рд╕реНрд╡рдпрдВ рдХрд╛ рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рд╕реЗрдЯ рдХрд░рддрд╛ рд╣реИ ред
рдФрд░ рдЕрдВрдд рдореЗрдВ, рдЬрд┐рд╕ рдмрд┐рдВрджреБ рдХреЗ рд▓рд┐рдП рдореИрдВ рдпрд╣ рд▓реЗрдЦ рд▓рд┐рдЦ рд░рд╣рд╛ рд╣реВрдВ - рд╡реЗрдмрдХрд┐рдЯ-рдЖрдзрд╛рд░рд┐рдд рдореЛрдмрд╛рдЗрд▓ рдмреНрд░рд╛рдЙрдЬрд╝рд░, рд╕рд╛рде рд╣реА Google рдХреНрд░реЛрдо 22+ рд╣рдореЗрд╢рд╛position: fixed
рд▓рд┐рдП рдПрдХ рдирдпрд╛ рдУрд╡рд░рд▓реЗ рд╕рдВрджрд░реНрдн рдмрдирд╛рддрд╛ рд╣реИposition: fixed
рддрддреНрд╡, рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐z-index: auto
!
, рд▓реЗрдХрд┐рди рдореБрдЭреЗ Microsoft рдкреНрд░рддрд┐рдирд┐рдзрд┐рдпреЛрдВ рдХреА рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдВ рдирд╣реАрдВ рдорд┐рд▓реАрдВ рдФрд░ рдЗрд╕ рдореБрджреНрджреЗ рдкрд░ рдЙрдирдХреА рд╕реНрдерд┐рддрд┐ рд╕реНрдкрд╖реНрдЯ рдирд╣реАрдВ рд╣реИред рдореБрдЭреЗ рд╡рд┐рдВрдбреЛрдЬ рдлреЛрди рдкрд░ рд╡реНрдпрд╡рд╣рд╛рд░ рдХрд╛ рдкрд░реАрдХреНрд╖рдг рдХрд░рдиреЗ рдФрд░ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдиреЗ рдХрд╛ рдЕрд╡рд╕рд░ рдирд╣реАрдВ рдорд┐рд▓рд╛ рдХрд┐ рдпрд╣ рдбреЗрд╕реНрдХрдЯреЙрдк рдкрд░ рд╡реНрдпрд╡рд╣рд╛рд░ рд╕реЗ рдореЗрд▓ рдЦрд╛рддрд╛ рд╣реИ рдпрд╛ рдирд╣реАрдВред рдЕрдЧрд░ рдХрд┐рд╕реА рдиреЗ рдкреНрд░рдпреЛрдЧ рдХрд╛ рдкрд░рд┐рдгрд╛рдо рд╕рд╛рдЭрд╛ рдХрд┐рдпрд╛ рддреЛ рдореИрдВ рдЖрднрд╛рд░реА рд░рд╣реВрдВрдЧрд╛ред
рдХрд┐рд╕реА рднреА рдорд╛рдорд▓реЗ рдореЗрдВ, W3C рдХреЗрд╡рд▓ рд╕рд┐рдлрд╛рд░рд┐рд╢реЗрдВ рджреЗрддрд╛ рд╣реИ, рдФрд░ рдкреНрд░рддреНрдпреЗрдХ рд╡рд┐рдХреНрд░реЗрддрд╛ рдЦреБрдж рдХрд╛ рдкрд╛рд▓рди рдХрд░рддрд╛ рд╣реИ рдХрд┐ рд╡рд╣ рдЗрд╕рдХрд╛ рдкрд╛рд▓рди рдХрд░реЗ рдпрд╛ рди рдХрд░реЗред рд╣рдо, рд╕рд░рд▓ рдбреЗрд╡рд▓рдкрд░, рдХреЗрд╡рд▓ рдЕрдкрдиреЗ рд╡реЗрдм рдЕрдиреБрдкреНрд░рдпреЛрдЧреЛрдВ рдореЗрдВ рдЗрд╕ рддрд░рд╣ рдХреА рдмрд╛рд░реАрдХрд┐рдпреЛрдВ рдХреЛ рдзреНрдпрд╛рди рдореЗрдВ рд░рдЦ рд╕рдХрддреЗ рд╣реИрдВ (рдпрд╣ рдЕрдЪреНрдЫрд╛ рд╣реИ рдХрд┐ рдПрдХ рдХреБрдЦреНрдпрд╛рдд рдЙрддреНрдкрд╛рдж рд╡рд╛рд▓реЗ рдПрдХ рдирд┐рдЧрдо рдиреЗ рд╣рдореЗрдВ рд╡рд░реНрд╖реЛрдВ рддрдХ рдЧреБрд╕реНрд╕рд╛ рдХрд┐рдпрд╛ рд╣реИ)ред
рдЖрдкрдХрд╛ рдзреНрдпрд╛рди рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!