CSS - somo la 4: Aina za css selecto
Katika somo hili uatkwenda kujifunza aina za css selectors
Aina za selector
Katika css selectors unaweza kuzigawa katika makundi ma nne abayo ni kama:-
- Element selectors
- Class selectors
- Id selectors
- Group selectos
- Universal selector
1. Element selectors
Hizi ni zile selector ambazo zinatarget element za html, kama vile heading kwa <h1>, paragraph kwa <p>, bolding kwa <b> na kuendelea.
b{color: red;
font-family: "Times New Roman";
text-align: center;
}
Hii imetagget b
2. Class selectors
Hizi hutumika wakati ambapo unataka ku target element zaidi ya moja. Unapotumia class selector internal css na external css hazitaweza kufanya kazi katika element husika tu na sio kwa parent element ya hiyo child element. Hii ni nzuri sana kwa kuwa haiwezi kuathiri element nyinginezo kwani haifanyi kazi mpaka iitwe.
Uandishi wa class
Kwanza utaweka nukta yaani period (.) ama doti ilifuatiwa na jina la class likifuatiwa na mabano{} ambapo ndani ya mabano hayo ndipo utaweka code za css. Mfano tunatengeneza claaa tutakayoiita muhimu hii itakuwa na style hizi: rangi nyekundu, font 200%, font-family arial
No.muhimu{
font-size: 200%;
font-family: Arial;
color: red;
}
Ili kuweza kuitumia class hiyo kwenye element unayo target utaiitwa kwa kuanza kuandika neno class likifuatiwa na alama ya = likufuatiwa na alama za kunukuu, ndani yake weka jina la class.
<p class="muhimu">Karibu bongoclass</p>
Class hiyo unaweza kuitumia katika element yeyote ile unayohitaji iwe na style hiyo. Na hakuna kikomo juu ya matumiazi yake. Jambo la kuzingatia ni kuwa class itaathiriwa na parent style. Kwa mfano kwenye <body> tuliweka text background colo iwe red, sasa hiyo background color itaendelea kwenye class yetu lamda na sisi kwenye class tu set background ntingine.
Pia zingatia kuwa jina la class halitakiwi kuanza na namba ama space (empty space)
3. ID selectors
Hizi hutumika pale unapo target element moja tu. Element inaweza kuwa na class zaidi ya Moja, lak...
Umeionaje Makala hii.. ?
Share On:
👉1 Kitabu cha Afya 👉2 web hosting 👉3 Sira ya Mtume Muhammad (s.a.w) 👉4 Kitau cha Fiqh 👉5 Madrasa kiganjani 👉6 Tafasiri ya Riyadh Swalihina
Post zinazofanana:
CSS - SOMO LA 20: Media Queries na Responsive Design
Katika somo hili, utajifunza jinsi ya kutumia media queries kwa ajili ya kutengeneza tovuti zinazojibadilisha kulingana na ukubwa wa skrini. Tutazungumzia @media rules, breakpoints, na dhana ya mobile-first design.
Soma Zaidi...CSS - SOMO LA 25: CSS Shorthand Properties
Katika somo hili tutajifunza kwa kina kuhusu CSS Shorthand Properties — ni nini, jinsi zinavyofanya kazi, faida zake, na mifano mbalimbali ya kutumia shorthand kuandika CSS kwa njia fupi na bora zaidi.
Soma Zaidi...Jinsi ya kumsaidia Mtoto mdogo aliyekabwa na kitu kooni
Mfano wa kitu kinachoweza kumaba mtoto kooni ni kama chagula kigumu, pesa ya sarafu, kijiwe na mengineyo. Endapo hili litataokea msaada wa haraka unahitajika kwa ulazima.
Soma Zaidi...CSS - somo la 3: syntax za css yaani sheria za uandishi wa css
Katika somo hili utakwenda kujifunza sheria za uandish wa css yaani syntax za css
Soma Zaidi...CSS - SOMO LA 10: Box Model katika CSS
Katika somo hili utajifunza muundo wa boksi (Box Model) katika CSS. Box model ni mfumo wa msingi wa kupanga vipengele katika ukurasa wa HTML, ukiwa na sehemu kuu nne: content, padding, border, na margin.
Soma Zaidi...CSS - SOMO LA 21: CSS Units
Katika somo hili, utajifunza vipimo vinavyotumika kwenye CSS kama vile px, em, rem, %, vw, na vh. Vipimo hivi hutumika kuweka ukubwa wa maandishi, padding, margin, urefu, na upana wa vipengele kwenye tovuti.
Soma Zaidi...