Inā ʻoe e hoʻohana i nā mea e like me ka overlay (ʻo ia ka lula i nā manawa o ka hana GDPR) a makemake e palupalu i kahi ma hope o ka uhi, no ka laʻana, ʻike pinepine ʻoe i ka pilikia o ka pōʻaiapili . ʻO kahi laʻana, inā he mau hoʻonohonoho kāu i hoʻonohonoho ʻia a i ʻole i kahi kūlana paʻa, e hōʻike ʻokoʻa ʻia lākou ma mua o ka ʻole o kahi kānana noi. Akā aia kekahi lāʻau.
Hōʻike kēia code i kēia laʻana. Pono e hoʻonohonoho i ka pahu ma hope i ka pono ma luna, akā ua neʻe:
See the Pen CSS BLUR STACKING CONTEXT #1 by David Vielhuber (@vielhuber) on CodePen.
Ua ʻōlelo maopopo ka W3C ma aneʻi: "ʻAʻole ia he bug, he hiʻohiʻona." Hōʻike ka kikoʻī i ka pilina:
A value other than none for the filter property results in the creation of a containing block for absolute and fixed positioned descendants unless the element it applies to is a document root element in the current browsing context. The list of functions are applied in the order provided.
ʻO ka kūkā kamaʻilio e pili ana iā GitHub he mea pono nō hoʻi e heluhelu.
Hoʻokumu nā waiwai CSS aʻe i kahi pōʻaiapili hou, i kū ʻole a paʻa paʻa paha nā keiki i nā ʻano o ka viewport, akā i ka mea makua i kānana ʻia.:
- filter
- transform
- backdrop-filter
- perspective
- contain
- transform-style
- will-change
Akā, aia kahi hoʻonā i ka pilikia kumu: ʻO ka CSS waiwai backdrop-filter (i ʻike maoli ʻia no ka kānana hapa ʻana i nā wahi ma hope o nā mea) e hana i ka mea i makemake ʻia ma aneʻi. ʻOiai ua hoʻokumu ʻia kahi pōʻaiapili hoʻopaʻa hou ma aneʻi, ʻaʻohe mea kūpono no ka mea ʻaʻohe mea keiki i ka pseudo-element.:
See the Pen CSS BLUR STACKING CONTEXT #2 by David Vielhuber (@vielhuber) on CodePen.