CSS - SOMO LA 11: Mitindo ya Border (Border Styles)
Katika somo hili, utajifunza jinsi ya kudhibiti mipaka (borders) ya vipengele kwa kutumia CSS. Tutajifunza namna ya kuweka unene wa border, rangi, aina ya mstari, na pia jinsi ya kutumia border kwa upande mmoja tu.
Vizuri! Tuendelee na:
📘 Utangulizi
Borders ni mipaka inayoizunguka element yoyote ya HTML. Unaweza kuitumia kuonyesha vizuri sehemu maalumu, kutenganisha vipande vya maandishi au picha, au kufanya design iwe ya kuvutia. CSS hukupa uwezo mkubwa wa kubadilisha muonekano wa border kwa njia nyingi tofauti.
✅ 1. border Property (shorthand)
Hii ni njia fupi ya kuweka border. Unachanganya aina ya mstari, unene, na rangi.
div {
border: 2px solid green;
}
-
2px= unene -
solid= aina ya mstari -
green= rangi
✅ 2. Aina za Mistari ya Border (border-style)
p {
border-style: solid;
}
Aina zinazopatikana:
-
none– hakuna border -
solid– mstari wa kawaida -
dashed– mstari wa vipande -
dotted– mistari ya nukta -
double– mistari miwili -
groove– mstari unaoonekana kama unaingia ndani -
ridge– mstari unaotoka juu kama reli -
inset– mstari unaoonekana kuingia ndani -
outset– mstari unaoonekana kutoka juu
✅ 3. border-width
Inatumika kudhibiti unene wa border.
p {
border-width: 5px;
}
Unaweza pia kuweka tofauti kwa kila upande:
p {
border-width: 1px 2px 3px 4px;
/* top right bottom left */
}
✅ 4. border-color
Inadhibiti rangi ya border.
p {
border-color: red;
}">Jiunge nasi WhatsApp kupata update zetu
help_outlineZoezi la Maswali
Umeionaje Makala hii.. ?
Share On:
👉1 Dua za Mitume na Manabii 👉2 Sira ya Mtume Muhammad (s.a.w) 👉3 Madrasa kiganjani 👉4 Tafasiri ya Riyadh Swalihina 👉5 Kitau cha Fiqh 👉6 ai web app
Post zinazofanana:
CSS - SOMO LA 31: CSS Filters (blur, brightness, contrast.)
Katika somo hili tutajifunza kuhusu CSS Filters — mitindo inayotumika kuhariri mwonekano wa picha, video, au elementi nyingine kwa kuongeza athari kama blur, brightness, contrast, grayscale, na nyinginezo. Hii huifanya tovuti kuwa ya kisasa, ya kuvutia, na yenye mwingiliano mzuri.
Soma Zaidi...CSS - SOMO LA 33: CSS Frameworks
Katika somo hili tutajifunza kuhusu CSS frameworks mbalimbali zinazosaidia kuharakisha uundaji wa mitindo kwenye tovuti. Tutazungumzia frameworks maarufu kama W3.CSS, Bootstrap, Google Fonts, na nyinginezo, faida, matumizi, na tofauti zao.
Soma Zaidi...CSS - SOMO LA 13: Display Property
Katika somo hili utajifunza kuhusu property muhimu ya CSS inayoitwa display, ambayo huamua jinsi element inavyoonyeshwa kwenye ukurasa. Tutachambua aina kuu za display: block, inline, inline-block, na none.
Soma Zaidi...CSS - SOMO LA 8: Upambaji wa Maandishi (Text Styling)
Katika somo hili, utajifunza mbinu mbalimbali za kubadilisha muonekano wa maandishi kwa kutumia CSS, kama vile kupamba maandishi kwa mistari, kivuli, nafasi kati ya herufi, na mpangilio wa maneno.
Soma Zaidi...CSS - somo la 4: Aina za css selecto
Katika somo hili uatkwenda kujifunza aina za css selectors
Soma Zaidi...CSS - somo la 2: Jinsi ya ku weka code za css kwenye HTML
katika somo hili utajifunza jinsi ya ku install css kwenye ukurasa wa html
Soma Zaidi...CSS - SOMO LA 14: Position Property
Katika somo hili utajifunza kuhusu property ya position katika CSS, ambayo hutumika kuamua jinsi element inavyowekwa ndani ya ukurasa. Tutajifunza aina tano kuu za position: static, relative, absolute, fixed, na sticky.
Soma Zaidi...CSS - SOMO LA 30: CSS Functions – calc(), clamp(), var(), min(), max() na Custom Functions
Katika somo hili, tutajifunza kuhusu CSS functions muhimu zinazotumika kufanya mahesabu, kuweka vipimo vya kisasa vinavyobadilika kulingana na hali ya kifaa, na kutumia variables. Tutazingatia functions kama: calc(), clamp(), var(), min(), max(), na mwishoni tutajifunza jinsi ya kutengeneza custom function kwa kutumia variables.
Soma Zaidi...CSS - somo la 5: Njia tano zinazotumika kuweka rangi kwenye css
Katika somo hili utajifunza aina tano za kuweka rangi kw akutumia css
Soma Zaidi...CSS - SOMO LA 7: Kutumia Fonti (Fonts) kwenye CSS
Katika somo hili utajifunza jinsi ya kudhibiti mwonekano wa maandishi kwa kutumia fonti kwenye CSS. Utajifunza jinsi ya kubadilisha aina ya fonti, ukubwa, mtindo, unene, na mpangilio wa maandishi ili yaweze kuonekana kwa mvuto na usomaji bora.
Soma Zaidi...