Navigation Menu



image

CSS - somo la 5: Njia tano zinazotumika kuweka rangi kwenye css

Katika somo hili utajifunza aina tano za kuweka rangi kw akutumia css

Tumesha jifunza katika masomo ya nyuma jinsi ya kuweka rangi. Rangi inaweza kuwa ni kwa ajilia backround ama kwa ajii ya text. Kama tulivyojifunza huko awali, property background hutumika kwa ajili ya ku set rangi kwa ajili ya background, na propert ya color hutumika ku set rangi ya text

p{

   background: black;

   color: blue;

}

 

Tofauti na hizo mbili kuna nyingine ya kuweka rangi kwenye borders. Hii inaitwa border 

Mfano:

p{

   border: solid #d00c0c;

}

 

Namna za uwekaji warangi

Katika css kuna aina tano za kuweka rangi kwenye faii la html. Njia hizo ni :-

 

  1. Kwa kutumia jina la rangi
  2. Kwa kutumia Hex color
  3. Kwa kutumia RGB
  4. Kwa kutumia HSL
  5. Kwa kutumia HSLA


 

  1. Kwa kutumia jina la rangi:

Kwa kutumia jina la rangi ni kama tulivyofanya hapo juu. Utaitaja rangi hyo kwa jina. Jambo la msingi ni kujuwa tu majina ya hizo rangi kwa ufasaha. Mfano red, blue, black, yellow, green, purple n.k. Nikama tulivyofanya hapo juu.

p{

   background: black;

   color: blue;

}

 

2. Kwa kutumia Hex color

Kuna baadhi ya rangi majina yake huyajui, saa utatumia thamani zake za hex color. Hex color zipo katika namna mbili ambzo ni kwa kutumia herufi ama kwa kutumia namba. Njia yeyote utakayotumia utaanza na alama ya reli yaani hash #. Baada ya kuandika # itafuatiwa na character 6 kama ni herufi ziwe 6 na kama ni namba ziwe 6. 

Mfano:

p{

   background: #000000;

   color: #160ee7;

}

Unaweza kuzi generate mwenyewe kwenye text editor. Ama w3schools wanayo system ya ku generate hex color free.

 

3. Kwa kutumia RGB

RGB ni kifupisho cha maneno Red, Green, Blue. kwa hiyo ni kitendo cha kuchanganya rangi hizo tatu ili kupata rangi nyingine. Kwa mfano ukicanganya rangi nyekundu, ya kijani na buluu kwa uwiano sawa utapata rangi nyeupe.

p{

   background: rgb(255, 255, 255);

   color: rgb(0,0,0);

}

 

Kwenye css editor itaonekana hivyo

...



Nicheki WhatsApp kwa maswali





           

Je! umeipenda hii post?
Ndio            Hapana            Save post

Rajabu Tarehe 2024-05-10 14:53:23 Topic: CSS Main: Masomo File: Download PDF     Share On Facebook or Whatsapp Imesomwa mara 692


Sponsored links
👉1 Kitabu cha Afya     👉2 Simulizi za Hadithi Audio     👉3 Kitau cha Fiqh     👉4 Madrasa kiganjani     👉5 kitabu cha Simulizi     👉6 Sira ya Mtume Muhammad (s.a.w)    

Post zifazofanana:-

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 1: Maana ya CSS, kazi zake na historia yake
Katika somo hili utakwenda kujifunza maana ya CSS, pia nitakujulisha kazi zake. Mwisho utatambuwa historia ya CSS toka kuanzishwa. Soma Zaidi...

CSS - somo la 4: Aina za css selecto
Katika somo hili uatkwenda kujifunza aina za css selectors 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 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...