background:none Vs background:transparent Ano ang Pagkakaiba?

Background None Vs Background Transparent Ano Ang Pagkakaiba



Habang nag-iistilo ng dokumento, mahalagang pangalagaan ang mga kulay ng background na ginamit, upang ito ay magmukhang maganda at mapang-akit sa mata sa paraang walang kahirapan habang nagbabasa ng teksto dahil sa hindi magandang pagpili ng mga kumbinasyon ng kulay. Para doon, mayroong isang CSS background property na nagtatakda ng kulay ng background ng isang text o isang buong interface ayon sa mga tagubiling ibinigay ng mga user.

Ang pangalan ng kulay na dapat ipakita sa output interface ay nakasulat sa background property na iyon. Halimbawa, ' background: pula ” ay magtatakda ng kulay ng background na pula. Katulad nito, upang panatilihing simple ang background o alisin ang mga kulay ng background, ' wala 'at' transparent Ang ” ay ginagamit sa background property kaysa sa pangalan ng isang kulay.

Parehong ipinapakita ng background:none at background:transparent ang parehong mga resulta habang ganap nilang inaalis ang background. Kaya, walang malaking pagkakaiba sa pagitan ng pagtatrabaho ng dalawa.







Pagkakaiba sa pagitan ng 'background:none' at 'background:transparent' sa CSS

Ang ' background: wala 'at' background: transparent ”, parehong ginagamit para sa parehong layunin. Itinakda nila ang kulay ng background bilang wala o inaalis ang kulay sa background.



Ngunit gayon pa man, kung mag-iisip tayo nang kritikal at susubukan na makahanap ng mga pagkakaiba sa pagitan nila, mayroong dalawang posibleng pagkakaiba:



  • Ang pangunahing pagkakaiba sa pagitan ng dalawa ay ang mga ito ay magkaibang mga salita na may iba't ibang bilang ng mga character sa mga ito. Kaya, naniniwala ang maraming tao na kapag ginamit sila sa isang malaking dokumento ng maraming beses sa iba't ibang lugar, ang dokumentong gumagamit ng ' background:wala ” ay maaaring tumagal ng mas kaunting oras upang ma-compile dahil walang mas kaunting bilang ng mga character kumpara sa transparent.
  • Kung pag-uusapan natin kung paano sila pinagsama-sama, kung gayon, ' background:wala ” itinatakda ang larawan sa background sa wala o sabihin nating inaalis ang kulay ng background. Sa kabilang banda, ang ' background:transparent ” nagtatakda ng transparent na kulay bilang background ng teksto o ang buong interface (alinman ang tinutukoy sa elemento ng istilo ng CSS).

Ngunit, ang mga ganitong uri ng pagkakaiba ay maaaring mapabayaan kung pag-uusapan natin ang epekto ng mga ito sa graphical na interface dahil walang magiging pagkakaiba sa dulo.





Halimbawa: Paglalapat ng background:wala at background:transparent

Halos patunayan natin na ' background:wala 'at' background:transparent ” gawin ang parehong bagay sa interface. Sumulat ng snippet ng code upang malaman ang epekto ng CSS background property sa parehong wala at transparent:

< h2 id = 'text' >

Ito ay isang simpleng teksto upang ipaliwanag ang layunin ng background:none at background:transparent

< / h2 >

Sa nabanggit na code snippet, mayroong isang heading na nilikha sa isang HTML na dokumento at ito ay binigyan ng isang id na pinangalanang ' text ”.



Pagdaragdag ng CSS Background Property

Ang teksto ay binigyan ng isang id, kaya gumawa tayo ng isang tagapili ng id sa elemento ng estilo ng CSS at idagdag lamang ang ' background:wala ” ari-arian sa loob nito:

# text {

background : wala ;

}

Katulad nito, isulat ang ' background:transparent ” property, walang pinagkaiba sa pamamaraan. Palitan lang ang ' wala 'may' transparent ”:

# text {

background : transparent ;

}

Parehong ' background:wala 'at' background:transparent ” ay bubuo ng parehong output:

Nangangahulugan ito na walang pagkakaiba sa pagitan ng dalawa at sila ay pinagsama-sama sa parehong paraan.

Pagdaragdag ng Background Property na may Pangalan ng Kulay

Ngayon, kung magdagdag tayo ng pangalan ng kulay sa halip na magsulat ng ' wala 'at' transparent ”, ang output ay hindi kailanman magiging katulad ng nabuo ng “ background:wala 'at' background:transparent ”. Halimbawa, nagsusulat kami ng pangalan ng kulay sa background property:

# text {

background : mapusyaw na asul ;

}

Ang pagkakaiba ay malinaw. Hindi ito nagpapakita ng parehong output tulad ng sa kaso ng background:wala at background:transparent :

Binubuo nito ang pagkakaiba sa pagitan ng background:none at background:transparent.

Konklusyon

Ang background:none at background:transparent ay ginagamit upang alisin ang kulay ng background at upang itakda ang kulay ng background bilang transparent, ayon sa pagkakabanggit. Ngunit, dahil pareho silang may eksaktong parehong epekto sa output interface, parehong background:none at background:transparent ay maaaring gamitin para sa parehong layunin.