CSS-seleksyon, ak wòl li nan fòma html-dokiman

Kreye yon sit entènèt ak ranpli li ak eleman sèten nan paj wèb la, tout moun ap fè fas a yon tèm tankou CSS-seleksyon an. Li sèvi nan plis detèmine egzakteman tout eleman ki nan html dosye-a konsepsyon yo ak kote sou paj la. Pou fè sa, kreye yon CSS-yon dokiman ki rekonèt soti sèten seleksyon ak opsyon fòma yo: koulè, gwosè, kote ak lòt. Chak designer sit entènèt ta dwe konnen epi yo dwe kapab byen antre nan seleksyon yo vle. Yo divize pa kalite, prensipal la nan yo ki nou diskite pi ba a.

Kalite seleksyon nan CSS

Tou depan de nan ki se eleman nan aplike html-fòma, CSS-seleksyon pouvwa gen rapò ak youn nan gwoup sa yo:

• seleksyon tag;
• klas seleksyon;
• ID-seleksyon;
• atribi seleksyon.

tag seleksyon

Li se tou rele "kalite seleksyon" oswa "eleman", li se pi senp lan ak komen. Kòm CSS-dokiman li yo non yo nan eleman ki nan html-dosye, nou dekri. Pou egzanp, si nou bezwen yo mete style la paragraf, nou presize pwopriyete yo ak valè yo pou p eleman {jan nou koumanse x; koulè: y; taille: z}. Nan ka sa a, tout paragraf nan paj wèb la ap gen fòma a menm (koulè jan nou koumanse, gwosè tèks, ak D. sou sa.).

klas seleksyon

Ak sa ki si ou bezwen mande chak paragraf ou a se diferan de lòt estil? Pou fè sa, gen yon seleksyon klas la.

CSS-dokiman nan ka sa a ta gen yon antre nan fòm sa a: p.first {koulè: x; font-gwosè: y}. Se konsa, nou defini pwopriyete yo nan "koulè" ak "gwosè" sèlman pou paragraf premye klas.

Nan yon html-dokiman nan ka sa a antre nan yon atribi klas nan non an nan style la an premye. Klas ka kòm anpil jan style la ou vle pou aplike pou yon eleman paj entènèt.

id Selector

Anpil fwa gen yon bezwen yo defini yon style plis presizyon, pou egzanp nan nenpòt eleman youn nan paj la, oswa nan echantiyon yo. Nan sitiyasyon sa a, èd la vini id-seleksyon. Dosye a html bay yon non atik vle ki idantifye l 'nan mitan lòt moun yo. Pou egzanp, eleman sa yo ke nou vle yo mete diferan de lòt style pral tit la atik.

Lè sa a, nan yon html-dokiman plase header h1 idantifyan a, tankou articlename. Ak nan CSS-dosye a, presize style la, ajoute nan griyaj la non ID: #articlename {koulè: ble; tèks-aliman: sant}. Koulye a, gran tit nou an pral gen koulè nan ble ak santre.

Chak nan kalite ki anwo yo ka dekri kòm "yon senp CSS-seleksyon". Yo defini fòma a pou yon paramèt patikilye nan html-dokiman an: ansanm eleman ki sanble (egzanp, tout paragraf yo nan atik la), yon klas (pou egzanp, se sèlman paragraf nan premye) oswa yon atik espesifik (pou egzanp, tit la atik).

atribi seleksyon

Anplis de sa nan pi wo a la, gen yon CSS-seleksyon atribi - metòd pi konplike nan Styles aplikasyon. Li pèmèt html eleman fòma sou atribi nan chwazi oswa valè. Gen varyete plizyè nan sa a seleksyon:

• pa nan prezans nan atribi a;
• nan valè egzak li yo;
• pa valè atribi yon pati nan;
• sou valè espesifik li yo.

Se pou nou konsidere chak nan espès sa yo:

1. Ka a an premye. se formataj aplike, si prezan nan yon espesifik atribi html-Kòd (li pouvwa gen yon p, div, header, elatriye). Si li pa bon, li sèvi ak yon jenerik pou tout eleman ki nan style. Pou egzanp, pou eleman yo gen tit (pwent an zouti).
2. Ka a dezyèm fwa. Style a aplike sèlman nan html eleman yo-ki gen yon matche ak egzak nan valè yo atribi. Pou egzanp, pou D 'a eleman yo, kote valè a nan atribi nan kalite egal soumèt.
3. Ka a twazyèm. Anba fòma a pral sèlman gen ladan atik ki nan lis la nan valè ki gen yon mo sèten. Pou egzanp, ankadre atribi "klas" pou eleman div.
4. Ka a katriyèm. se style defini sèlman pou moun ki eleman nan html-dokiman, ki gen patikilye atribi gen yon valè sèten, ak kòmanse avè l '. Pou egzanp, itilize nan koulè a espesifye nan tout eleman ki lang atribi nan angle (ki ka nan, en-Ris, nan-au ak D. t.).

Se konsa, lè l sèvi avèk youn oswa lòt la, seleksyon an CSS, ka pi byen dwe espesifye kòm yon paj entènèt tout antye, epi dekri kèk nan eleman li yo.