Kujiunga na Selection nyingi za CSS

Gundi Selection nyingi za CSS za Kuboresha kasi ya Mzigo

Ufanisi ni jambo muhimu katika tovuti yenye mafanikio. Tovuti hiyo inapaswa kuwa na ufanisi katika jinsi inavyotumia picha mtandaoni . Hii itasaidia kuhakikisha kuwa tovuti hufanya vizuri kwa wageni na kupakia haraka kwenye vifaa vyake. Ufanisi lazima pia kuwa sehemu ya mchakato wako kwa ujumla, kukusaidia kuweka maendeleo ya tovuti kwa wakati na kwenye bajeti.

Hatimaye, ufanisi huwa na jukumu katika nyanja zote za uumbaji wa tovuti na ufanisi wa muda mrefu, ikiwa ni pamoja na katika mitindo iliyoandikwa kwa karatasi za tovuti za CSS. Kuwa na uwezo wa kuunda viungo, safi CSS files ni bora, na moja ya njia unaweza kufikia hili ni kwa kuunganisha wengi selectors CSS pamoja.

Kundi la Selection

Unapofanya wachunguzi wa CSS , unatumia mitindo sawa na mambo mbalimbali bila kurudia mitindo katika karatasi yako ya mtindo. Badala ya kuwa na sheria mbili au tatu au hata zaidi za CSS, zote zinafanya kitu kimoja (mfano, kuweka rangi ya kitu fulani nyekundu), una utawala wa CSS mmoja ambao unafanikisha ukurasa wako.

Kuna sababu kadhaa ambazo "kundi la wateuzi" hili linafaidika ukurasa. Vikwazo vya kwanza, karatasi yako ya mtindo itakuwa ndogo na kubeba haraka zaidi. Kweli, karatasi za mtindo sio mojawapo ya kosa kuu linapokuja kupungua kwa kupakia maeneo. Faili za CSS ni faili za maandishi, hivyo hata karatasi za CSS za muda mrefu sana ni za busara, za ukubwa wa faili, ikilinganishwa na picha zisizofaa. Bado, kila kidogo huhesabu, na kama unaweza kunyoosha ukubwa wa CSS yako na kupakia kurasa kwa kasi zaidi, hiyo ni jambo jema daima kufanya.

Kwa ujumla, juu ya kiwango cha wastani cha mzigo kwa maeneo ni chini ya sekunde 3; Sekunde 3 hadi 7 ni wastani, na zaidi ya sekunde 7 ni polepole sana. Nambari hizi za chini zinamaanisha kwamba, kufikia yao na tovuti yako, unahitaji kufanya kila kitu unachoweza! Hii ndio sababu unaweza kusaidia kuweka tovuti yako kwa haraka kutumia watoaji wa CSS waliojumuisha.

Jinsi ya Kikundi cha CSS Selectors

Ili kuwachagua wateuzi wa CSS pamoja kwenye safu ya mtindo wako, unatumia vito ili kutenganisha wateuzi wengi wa kikundi katika mtindo. Katika mfano ulio chini, mtindo huathiri vipengele vya p na div:

div, p {rangi: # f00; }

Comma kimsingi inamaanisha "na". Kwa hiyo mteuzi huyu hutumika kwa vipengele vyote vya kifungu na vipengele vyote vya mgawanyiko. Ikiwa comma haikuwepo, ingekuwa badala ya vipengele vya kifungu ambavyo ni mtoto wa mgawanyiko. Hiyo ni aina tofauti sana ya mchaguzi, hivyo comma hii kweli inabadilika maana ya mchezaji!

Aina yoyote ya mchezaji inaweza kuunganishwa na mteja mwingine yeyote. Katika mfano huu, mchezaji wa darasa amefungwa na mchaguzi wa ID:

p.red, #sub {rangi: # f00; }

Kwa hiyo mtindo huu unatumika kwa aya yoyote na sifa ya darasa ya "nyekundu", NA kipengele chochote (kwani hatukufafanua aina ipi) ambayo ina sifa ya ID ya "ndogo".

Unaweza kuunda namba yoyote ya wateuzi pamoja, ikiwa ni pamoja na wateuzi ambao ni maneno moja na kuchanganya wateuzi. Mfano huu unajumuisha chagua nne tofauti:

p, .red, #sub, div a: link {rangi: # f00; }

Kwa hiyo utawala huu wa CSS unatumika kwa zifuatazo:

Mchaguzi wa mwisho ni selector kiwanja. Unaweza kuona ni kwa urahisi pamoja na wateuzi wengine katika utawala huu wa CSS. Kwa utawala huo, tunaweka rangi ya # f00 (ambayo ni nyekundu) kwenye chagua hizi 4, ambazo ni bora kuandika vijumbe 4 tofauti ili kufikia matokeo sawa.

Faida nyingine ya kuchagua vikundi ni kwamba, ikiwa unahitaji kufanya mabadiliko, unaweza kubadilisha utawala mmoja wa CSS badala ya wengi. Hii inamaanisha kuwa njia hii inakuokoa uzito wa ukurasa na muda unapokuja kuhifadhi tovuti baadaye.

Chagua yoyote inaweza Kuunganishwa

Kama unaweza kuona kutoka kwa mifano hapo juu, chombo chochote cha halali kinaweza kuwekwa kwenye kikundi, na vipengele vyote katika waraka vinavyofanana na vipengele vyote vilivyo na kikundi vitakuwa na mtindo sawa kulingana na mali ya mtindo.

Watu wengine wanapendelea kuorodhesha mambo yaliyounganishwa kwenye mistari tofauti kwa uhalali wa kanuni. Kuonekana kwenye tovuti na kasi ya mzigo bado ni sawa. Kwa mfano, unaweza kuchanganya mitindo iliyotengwa na vitambaa katika mali moja ya mtindo katika mstari mmoja wa kificho:

th, td, p.red, div # kwanza {rangi: nyekundu; }

au unaweza kuandika mitindo kwenye mistari ya mtu kwa usahihi:

th,
td,
pred,
div # kwanza
{
rangi: nyekundu;
}

Njia yoyote unayotumia kwa kundi la chaguo nyingi za CSS inaharakisha tovuti yako na inafanya iwe rahisi kusimamia mitindo kwa muda mrefu.

Makala ya awali na Jennifer Krynin. Iliyotengenezwa na Jeremy Girard tarehe 5/8/17.