CSS-selector, ug ang papel sa formatting html-dokumento

Paghimo sa usa ka website ug pagpuno niini uban sa pipila ka mga elemento sa panid sa web, ang tanan mag-atubang sa usa ka termino sama sa CSS-selector. Kini nag-alagad sa mas tukma pagtino sa tanan nga mga elemento sa html-file sa ilang disenyo ug lokasyon sa panid. Sa pagbuhat niini, sa paghimo sa usa ka CSS-usa ka dokumento nga mopakatap sa sa pipila ka mga selectors ug sa ilang mga kapilian sa formatting: kolor, gidak-on, lokasyon ug uban pang mga. Ang matag web designer kinahanglan nga mahibalo ug makahimo sa husto nga paagi sa pagsulod sa gitinguha nga mga pinili. Sila mabahin sa matang, ang mga nag-unang nga atong hisgotan ang sa ubos.

Matang sa selectors sa CSS

Depende sa sa nga sa elemento gipadapat html-ay, CSS-selector mahimong may kalabutan sa usa sa mga mosunod nga mga grupo:

• tag selector;
• klase selector;
• id-selector;
• nagtuo nga selector.

tag selector

Kini gitawag usab nga "matang selector" o "elemento", kini mao ang labing yano ug komon. Samtang ang iyang CSS-dokumento mao ang mga ngalan sa mga elemento sa html-file, nga naghulagway sa atong. Pananglitan, kon kita kinahanglan nga ang mga parapo estilo, hingalan kita sa mga kabtangan ug sa ilang mga mga hiyas alang sa elemento p {background: x; kolor: y; gidak-on: z}. Sa kini nga kaso, ang tanan nga parapo sa pahina sa web adunay sa mao usab nga format (kolor background, gidak-on nga teksto, ug sa ingon sa. D.).

klase selector

Ug unsa kon kamo kinahanglan nga mangayo sa imong matag parapo mao ang lain-laing mga gikan sa ubang mga estilo? Sa pagbuhat niini, adunay usa ka klase selector.

CSS-dokumento sa niini nga kaso nga naglakip sa usa ka entry sa sa mosunod nga mga porma: p.first {kolor: x; font-size: y}. Busa, kita nagpaila sa mga kabtangan sa "kolor" ug "gidak-on" alang lamang sa unang klase nga parapo.

Sa usa ka html-dokumento sa niini nga kaso misulod sa usa ka klase nga hiyas sa ngalan sa estilo una. Mga klase mahimong sama sa estilo nga imong gusto sa paggamit sa alang sa usa ka elemento sa web page.

Selector id

Kasagaran adunay usa ka panginahanglan sa nagpaila sa usa ka estilo nga mas tukma, alang sa panig-ingnan sa bisan unsa nga usa ka elemento sa pahina, o sa sample kanila. Sa niini nga kahimtang, ang tabang moabut id-selector. Ang HTML file assign sa usa ka gitinguha nga ngalan butang nga nagpaila kini sa taliwala sa mga uban pa. Kay sa panig-ingnan, ang mga elemento nga gusto kita nga aron sa lain-laing mga gikan sa ubang mga estilo mao ang titulo nga artikulo.

Unya sa usa ka HTML-dokumento sa paghatag sa header H1 identifier, ang maong articlename. Ug sa CSS-file, hingalan sa estilo, sa pagdugang sa ngalan ID grille: #articlename {kolor: asul nga; text-align: center}. Karon ang atong headline makabaton sa kolor azul ug nasentro.

Ang matag usa sa mga matang sa ibabaw mahimong gihulagway nga "usa ka yano nga CSS-selector". Sila nagpaila sa formatting alang sa usa ka partikular nga sukaranan sa html-dokumento: sa tingub susama nga mga elemento (pananglitan, ang tanan nga mga parapo sa artikulo), usa ka klase (alang sa panig-ingnan, lamang ang unang parapo) o sa usa ka piho nga butang (alang sa panig-ingnan, ang titulo nga artikulo).

nagtuo nga selectors

Dugang pa sa mga sa ibabaw, adunay usa ka CSS-selectors mga hiyas - mas komplikado nga paagi sa mga estilo sa aplikasyon. Kini nagtugot html elemento format sa pinili nga hiyas o bili. Adunay pipila ka mga matang sa selector niini:

• pinaagi sa atubangan sa mga hiyas;
• sa iyang tukma nga bili;
• pinaagi sa partial bili hiyas;
• sa iyang piho nga bili.

Atong hisgotan ang matag usa niini nga mga sakop sa henero nga:

1. Ang unang kaso. Formatting ipadapat, kon karon sa usa ka piho nga kinaiya html-code (kini mahimo nga usa ka p, div, header, ug uban pa). Kon kini dili, kini gigamit sa usa ka komon nga alang sa tanan nga mga elemento sa estilo. Kay sa panig-ingnan, alang sa mga elemento nga may titulo (himan tip).
2. Ang ikaduha nga kaso. estilo sa magamit lamang ngadto sa html-elemento nga adunay usa ka tukmang duwa sa mga mithi nga hiyas. Pananglitan, sa input sa mga elemento, diin ang bili sa matang hiyas katumbas sa magpasakop.
3. Ang ikatulo nga kaso. Ubos sa format lamang maglakip sa mga butang diha sa listahan sa mga mithi nga adunay usa ka pulong. Pananglitan, sidebar hiyas "klase" alang sa mga elemento div.
4. Ang ikaupat nga kaso. Style gihubit lamang alang sa mga elemento sa HTML-dokumento, kansang partikular nga kinaiya adunay usa ka bili, ug nagsugod uban kaniya. Kay sa panig-ingnan, ang paggamit sa mga bungat kolor sa tanan nga mga elemento nga sa Iningles nga pinulongan hiyas (nga mahimong en, en-Lazaro, en-au ug t. D.).

Busa, pinaagi sa paggamit sa usa o sa lain, ang CSS selector, mahimo labing maayo nga bungat ingon nga usa ka bug-os nga pahina sa web, ug paghulagway sa pipila sa mga elemento niini.