CSS-selector, na ya ọrụ na formatting html-akwụkwọ

Ịmepụta a website na-ejuputa na ọ na ụfọdụ ọcha nke web page, onye ọ bụla ga-eche ihu a okwu dị ka CSS-selector. Ọ na-eje ozi ọzọ n'ụzọ ziri ezi chọpụta niile ọcha nke html-faịlụ nke ha imewe na na ọnọdụ na peeji nke. Iji mee nke a, ike a CSS-a akwụkwọ na-akpata ụfọdụ selectors na ha formatting nhọrọ: agba, size, ebe ndị ọzọ. Ọ bụla web mmebe kwesịrị ịma na-enwe ike n'ụzọ kwesịrị ekwesị na-abanye na-chọrọ selections. Ha na-ekewa site ụdị, isi nke anyị na-atụle n'okpuru.

Iche iche nke selectors na CSS

Dabere na nke mmewere na-etinyere html-Ị, CSS-selector nwere ike ikwu na otu n'ime ndị na-esonụ iche iche:

• mkpado selector;
• klas selector;
• id-selector;
• ikwu selector.

Tag selector

Ọ na-akpọ "ụdị selector" ma ọ bụ "mmewere", ọ bụ ihe kasị dị mfe ma na-ahụkarị. Dị ka ya CSS-akwụkwọ bụ aha ndị ọcha nke html-faịlụ, nke anyị na-akọwa. Ka ihe atụ, ọ bụrụ na anyị chọrọ ka paragraf style, anyị dee Njirimara na ha ụkpụrụ maka mmewere p {ndabere: x; agba: y; size: z}. Na nke a, ihe niile na paragraf nke web page ga-enwe otu format (ndabere agba, ederede size, na na. D.).

klas selector

Na ihe ma ọ bụrụ na ị ga-achọ ịjụ gị ọ bụla na paragraf dị iche ndị ọzọ ekwekọghị? Iji mee nke a, e nwere a na klas selector.

CSS-akwụkwọ na nke a ga-ebu ihe ntinye nke ndị na-esonụ ụdị: p.first {agba: x; font-size: y}. N'ihi ya, anyị kọwaa Njirimara nke "agba" na "size" naanị maka klas mbụ paragraf.

Na a html-akwụkwọ na nke a banyere a na klas àgwà ka aha nke style mbụ. Klas nwere ike dị ukwuu dị ka ndị style na ị chọrọ ime n'ihi na a web page ọcha.

selector id

Ọtụtụ mgbe e nwere mkpa kọwaa a style ọzọ n'ụzọ ziri ezi, n'ihi na ihe atụ ọ bụla onye mmewere nke page, ma ọ bụ ka ịlele ha. Ke idaha emi, enyemaka na-abịa id-selector. The html file ekenye a chọrọ item aha nke na-emetụta ya n'etiti ndị ọzọ. Ka ihe atụ, ndị ọcha na anyị chọrọ ka dị iche iche site na ndị ọzọ style ga-isiokwu aha.

Ekem, ke a html-akwụkwọ na-ekenye nkụnye eji isi mee H1 nchọpụta, dị articlename. Na na CSS-faịlụ, ezipụta na style, na-agbakwụnye na ID aha grille: #articlename {agba: acha anụnụ anụnụ; ederede-mmezi: center}. Ugbu a anyị isiokwu ga-agba anụnụ anụnụ na-kpọt.

Onye ọ bụla nke n'elu ụdị nwere ike kọwara dị ka "a dị mfe CSS-selector". Ha kọwaa formatting maka otu oke nke html-akwụkwọ: ọnụ yiri ọcha (eg, niile na paragraf nke isiokwu), otu klas (atụ, naanị mbụ paragraf) ma ọ bụ a kpọmkwem ihe (ihe atụ, isiokwu aha).

ikwu selectors

Na mgbakwunye na n'elu, e nwere a CSS-selectors àgwà - ihe mgbagwoju anya na usoro nke na ngwa ekwekọghị. Ọ na-ekwe html format ọcha na họrọ àgwà ma ọ bụ uru. E nwere ọtụtụ iche nke a selector:

• site ọnụnọ nke àgwà;
• na ya kpọmkwem uru;
• site ele mmadụ anya n'ihu àgwà bara uru;
• na ya kpọmkwem uru.

Ka anyị tụlee nke ọ bụla n'ime ndị a umu:

1. The mbụ ahụ. Formatting na-etinyere, ma ọ bụrụ na ugbu a na a kpọmkwem àgwà html-koodu (o nwere ike ịbụ a p, div, nkụnye eji isi mee, wdg). Ọ bụrụ na ọ bụghị, ọ na-eji a ọnyà niile ọcha nke style. Dị ka ihe atụ, n'ihi na ndị ọcha na-enwe aha (ngwá ọrụ n'ọnụ).
2. Nke abụọ ahụ. The style na-emetụta nanị html-ọcha nwere ihe kpọmkwem egwuregwu nke àgwà ụkpụrụ. Ka ihe atụ, ka ọsọ ọsọ ndị na-ọcha, ebe uru nke ụdị àgwà nhata n'okpuru ya.
3. The atọ ikpe. N'okpuru format ga naanị gụnyere ihe na ndepụta nke ụkpụrụ na nwere ụfọdụ okwu. Ka ihe atụ, sidebar àgwà "klas" maka ọcha div.
4. The anọ ikpe. Style a kọwara nanị maka ndị ọcha nke html-akwụkwọ, onye akpan akpan àgwà nwere ụfọdụ uru, na-amalite na ya. Ka ihe atụ, na ojiji nke kpọmkwem agba niile ọcha nke asụsụ Bekee àgwà (nke nwere ike ịbụ en, en-rus, en-au na t. D.).

Ya mere, site na iji otu ma ọ bụ ndị ọzọ, na CSS selector, kasị mma isi kpọmkwem dị ka ihe dum web page, na-akọwa ụfọdụ n'ime ya ọcha.