He kupu whakataki ki te CSS Background Blur Ko te hanga i te awenga papamuri i roto i te CSS kaore i ngawari ake. Ma te rarangi waehere kotahi, ka taea e koe te whakatutuki i nga ahuatanga tirohanga ngaio e whakarei ake ana i te wheako kaiwhakamahi me te hoahoa rerehua. He tino pai tenei tikanga mo nga matapihi ahua, whakakikorua whakaahua, me nga hononga tukutuku hou e hiahia ana koe ki te aro ki nga ihirangi motuhake me te whakakore i te papamuri.

Ko te mea ngaro kei roto i te taonga tātari papamuri o CSS, e pa ana ki nga paanga kauwhata ki te waahi kei muri i tetahi huānga. Ko tenei ahuatanga CSS kaha ka taea e nga kaiwhakawhanake te hanga i nga ahuatanga tirohanga whakamiharo kaore he JavaScript matatini, he whakatika whakaahua taapiri ranei. Ahakoa kei te mahi koe i runga i te paetukutuku kōpaki, i te papaaho-e-tauhokohoko, i te tono paetukutuku ranei, ma te maataki i tenei tikanga ka piki ake to kaha ki te hoahoa.

Me pehea te Whakatinana i te Papamuri Blur me tetahi Raina Waehere Ka puta te makutu me tenei whakapuakanga CSS ngawari:

papamuri-tātari: blur(5px);

Ko tenei rarangi waehere kotahi e pa ana ki te Gaussian blur effect ki te ihirangi papamuri kei muri i to huānga. Ko te uara o roto o te mahi purongo (5px i tenei tauira) ka whakatau i te kaha o te awenga purongo. Ka taea e koe te whakatika i tenei uara ki te whakatutuki i tetahi mea mai i te ngawari ngawari ki te papamuri tino pouri.

Tauira Whakatinana Taketake Anei he tauira katoa e whakaatu ana me pehea te hoatu i te blur papamuri ki te whakakikorua aratau:

.modal-overlay { tūnga: fixed; runga: 0; maui: 0; whanui: 100%; teitei: 100%; papamuri-tae: rgba(0, 0, 0, 0.5); papamuri-tātari: blur(5px); }

Ka hangaia e tenei waehere he whakakikorua ahua-ataata me te 5-pixel awenga puhoi e pa ana ki te kaupapa o raro. Ko te tae papamuri o te rgba e whakarato ana i te whakakikorua pouri i te wa e tuku ana i nga ihirangi porangi kia puta.

Nga Tikanga Blur Arā Atu Ake me te Whakaritenga Ahakoa he kaha te awe o te purongo taketake, ka taea e koe te whakarite kia rite ki o hiahia hoahoa. Ka tautokohia e te taonga tātari-muri nga mahi tātari maha ka taea te whakakotahi mo nga paanga uaua ake.

Te Whakakotahi i nga Paanga Tatari Maha Ka taea e koe te hono tahi i nga mahi tātari maha ki te hanga i nga paanga tirohanga matatau:

papamuri-tātari: blur(10px) wherikotanga(0.8); - Ka taapirihia te purongo me te whakapouri i te papamuri papamuri-tātari: te puru (5px) whakamakuku(150%); - Ka whakamahia te purongo me te whakanui ake i te tae o te tae papamuri-tātari: blur(8px) tauine hina(50%); - Whakakotahitia te puanaputanga me te awenga awheawhe kirikiri

Ko enei huinga ka taea e koe te hanga i nga wheako tirohanga ahurei e whakanui ana i te arotahi ihirangi me te whakauru o nga kaiwhakamahi. Whakamatautau ki nga uara rereke kia kitea te toenga tino pai mo to hoahoa.

Whakaaro Hototahi Pūtirotiro Ahakoa e tautokohia ana te tātari papamuri i roto i te nuinga o nga kaitirotiro hou, he mea nui ki te whakarato takahuri mo nga kaitirotiro tawhito. Anei tetahi huarahi whakatinana pakari:

.modal-overlay { papamuri-tae: rgba(0, 0, 0, 0.7); /* Whakahoki mo nga kaitirotiro tawhito */ }

@tautoko (tātari-whakamuri: blur(5px)) { .modal-overlay { papamuri-tae: rgba(0, 0, 0, 0.5); papamuri-tātari: blur(5px); } }

Ko tenei huarahi whakapai ake ka whakarite kia mahi to hoahoa puta noa i nga kaitirotiro katoa i te wa e whakarato ana i nga whakakitenga pai ake mo nga kaitirotiro hou.

Nga Whakamahinga Mahi me nga Take Whakamahi He maha nga whakamahinga o nga paanga o te papamuri mo te hoahoa tukutuku hou. Anei etahi o nga keehi whakamahi tino whai hua:

Matapihi Matapihi me nga Pouaka Korero He tino pai te purongo papamuri mo nga matapihi aratau e hiahia ana koe ki te aro ki te aro o nga kaiwhakamahi ki nga korero korero. Ko te papamuri karekau he whakaiti i te maru o te tirohanga me te hanga i te arokite tirohanga marama. Ka whakamahia tenei tikanga i roto i nga puka takiuru, nga korero whakau, me nga karere panui.

Taiwhanga Whakaahua me nga Pae Portfolio Ka paato nga kaiwhakamahi ki nga whakaahua karakōnui, ko te tono i te papamuri ki te ihirangi wharangi matua ka awhina i te ahua nui kia tu. He tino whai hua tenei huarahi mo nga kopaki whakaahua, nga taiwhanga hua, me nga whakaaturanga mahi toi he mea tino nui te arotahi tirohanga.

Nga Tahua Whakaterenga me nga Paetaha He maha nga wa e whakamahia ana e nga taupānga pūkoro me nga paetukutuku hou te purongo papamuri mo nga tahua whakatere reti. I te wa e paheke ana te tahua ki roto, ko te kaupapa matua ka poapoapoa i te papamuri, ka hanga i te awenga paparanga matanga. He pai tenei tikanga mo nga tauira whakatere waea me nga paetaha huna.

Nga Whakaaro Mahinga me nga Mahi Pai Ahakoa he kaha te tātari-whakamuri, he mea nui kia tika te whakamahi kia pai ai te mahi. Anei nga whakaaro matua:

Kia iti te whakamahi: Hoatuhia nga paanga purongo anake kinga huānga e tika ana hei karo i nga mahi mahi Whakamātautau i runga pūkoro: Ka raru pea etahi o nga taputapu pūkoro i nga raru o te mahi me nga paanga puhoi taumaha Whakaarohia etahi atu: Mo nga papamuri pateko, ka pai ake pea nga whakaahua kua puru-mua Whakapai ake: Whakaratohia i nga wa katoa nga whakamuri mo nga kaitirotiro kaore i te tautoko i te waahanga

Ko nga whanaketanga o te ahumahi tata nei e whakaatu ana me pehea te tipu haere tonu o nga paanga ataata. Hei tauira, kei te whakaaro a Zoox ki te tuku i tana robotaxis ki runga i te taupānga Uber i Vegas i tenei tau, e whakaatu ana me pehea te kaha o nga mahi hou atanga kaiwhakamahi ki te kawe i nga hangarau whanui.

Te Whakamutunga me nga Mahi Panuku Ko te whakahaere i te papamuri o te CSS me te papamuri-tatari rawa ka whakatuwhera i nga waahanga hoahoa whakahihiri. Ko tenei otinga raina-kotahi e whakarato ana i nga paanga ataata ngaio hei whakarei ake i te wheako kaiwhakamahi me te whakahou i o atanga tukutuku. Kia mahara ki te whakamatautau puta noa i nga kaitirotiro me nga taputapu kia rite tonu te mahi.

I a koe e torotoro ana i nga tikanga CSS matatau, whakaarohia me pehea te awe o nga hangarau hou ki te hoahoa paetukutuku. He kaha te whakataetae i roto i te hangarau ataata, i kitea i roto i te upoko o Nvidia mo te taraiwa motuhake e tuwhera ana mo tana mahere ki te patu i a Waymo me Tesla. Waihoki, ko nga huihuinga o te ao ka pa ki te tango hangarau, penei i te pakanga a Trump ki a Iran i paea ai te miriona rererangi me te ruku i te papa tapere tino pai o te Waiariki ki roto i te raru o te hangarau haerenga.

Kua reri ki te whakatinana i nga ahuatanga tirohanga whakamiharo ki o kaupapa? Tīmatahia te whakamātau me te tātari papamuri i tenei ra ka kite me pehea e huri ai tetahi rarangi waehere i o hoahoa. Mo te whakatinanatanga ngawari o nga ahuatanga CSS matatau, whakaarohia te whakamahi i a Semless ki te whakamaarama i to rerenga mahi whanaketanga kia tere ake ai nga hua ngaio.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free