Pehea e hoʻololi ai i nā huʻi pūnaewele pūnaewele me CSS

ʻO ka hoʻonohonohoʻilima maikaʻi he wahi nui o kahi pūnaewele kūpono. Hiki iā CSS ke hāʻawi iāʻoe i ka mana nui no kaʻikeʻana i nā mea ma nā pūnaewele pūnaewele āu e kūkulu nei. Loaʻa kēia i ka hiki ke hoʻololi i ke kala o kekahi momotuhi āu e hoʻohana ai.

Hiki ke hoʻololiʻia nā lula momona me kahi pepaʻokoʻa waho , kahi pepaʻokoʻa i loko , aiʻole paha e hoʻololiʻia me ka hoʻohanaʻana i ka hua'ōlelo i loko o ka palapala HTML. Hanaʻia nā hana maikaʻi e hoʻohanaʻoe i kahi kāʻei style waho no kāu mau kāleka CSS. ʻO ka pepa pepaʻaoʻao, nāʻano i kākauʻia ma ka "poʻo" o kāu palapala, e hoʻohana waleʻia no nā wahi liʻiliʻi, hoʻokahiʻaoʻao. E kāpaeʻia nāʻano o ka inline mai ka wā e pili ana lākou i nā inoa "font" kahiko a mākou i hana ai i nā makahiki he nui aku nei. ʻO ia mauʻano kelepona i mea paʻakikī i ka mālamaʻana i ke kālai'āinaʻoihana no ka mea e pono anaʻoe e hoʻololi iā lākou i kēlā me kēia manawa o keʻano o ke kikowaena.

Ma kēiaʻatikala, e aʻo aiʻoe pehea e hoʻololi ai i keʻano momona e hoʻohana ana i kahi pepaʻokoʻa o waho a me kahiʻano i hoʻohanaʻia ma kahi pāpili palakala. Hiki iāʻoe ke hoʻohana i ka waiwai hoʻohālike hoʻokahi e hoʻololi i ke kaha momona ma kekahi mea e hoʻopuni ana i ka kikokikona, me ka inoa .

Hoʻohui i nā kālepa e hoʻololi i ke kala momona

No kēia hiʻohiʻona, ponoʻoe e loaʻa i kahi palapala HTML no kāu hōʻailona palapala a me kahi waihona CSS i pili i kēlā palapala. Hiki paha i ka palapala HTML ke hana i kekahi mauʻano o ia mau mea. ʻO ka mea a mākou e hopohopo nei no ka manaʻo o kēiaʻatikala,ʻo ia ka māhele o ka paukū.

Eia keʻano e hoʻololi ai i keʻano momona o nā kikokikona ma loko o nā pāʻali palakala e hoʻohana ana i kāuʻaoʻao kāhili.

Hiki ke hoʻohālikeʻia nā loli kala e like me nā hua'ōlelo laulā, nā hua helu RGB, aiʻole nā ​​helu kala hexadecimal.

  1. Hoʻohui i ka huaʻano style no ka pā'ālua tag:
    1. p '
  2. E kau i ka waiwai leʻaleʻa i keʻano. E kau i kahi pan ma hope o kēlā waiwai:
    1. pā'ālua:}
  3. A laila e hoʻohui i kāuʻano kala ma hope o ka waiwai. E hōʻoia e hoʻopau i kēlā kumukūʻai me ka semi-colon:
    1. p 'eleʻele:ʻeleʻele;}

Eʻeleʻele nā ​​parakalaka ma kāuʻaoʻao.

Ke hoʻohana nei kēiaʻano i ka hua'ōlelo kala - "ʻeleʻele". ʻO kēlā kahi kahi e hoʻonui ai i ke kala i CSS, akā, he palena loa. Hoʻohana pololei ka hoʻohanaʻana i nā hua'ōlelo no ka "ʻeleʻele" a me ka "keʻokeʻo" no ka mea uaʻano pololei kēia mau kalaʻelua, akā pehea kāu hana inā hoʻohanaʻoe i nā hua'ōlelo e like me "uila", "blue", "green"? E nānā pono i ke aka o kaʻulaʻula, kaʻulaʻula, a me ka'ōmaʻomaʻo paha e loaʻa ai iāʻoe? ʻAʻole hiki iāʻoe ke koho pololei i keʻano o ka malu aniani āu e makemake ai me nā hua'ōlelo. ʻO kēia ke kumu e hoʻohana pinepineʻia ai nā waiwai hexadecimal i kahi o nā hua'ōlelo laulā.

p. #: 000000; }

Hiki i kēia CSS style ke kau i ke kala o kāu palakule i kaʻeleʻele, no ka mea, ka unuhi hex o # 000000 i unuhi i kaʻeleʻele. Hiki iāʻoe ke hoʻohana i ka pōkole me kēlā hex hex a kākauʻia me he # 000 wale nō a loaʻa iāʻoe ka mea like.

E like me kā mākou i'ōlelo mua ai, pono ke hana maikaʻi nā hex i ka wā e pono aiʻoe i kaʻaʻahuʻaʻole iʻeleʻele a i keʻokeʻo wale nō. Eia kekahi hiʻohiʻona:

p. helu # 2f5687; }

Ma kēiaʻano hex pono e hoʻonohonoho i nā paukū i ka'ahuʻula, akā,ʻaʻole e like me ka hua'ōlelo "blue", hāʻawi kēia hex code i ka hiki iāʻoe ke hoʻonohonoho pono i ka malu o ka uliuli -ʻano paha ka mea a ka mea koho e koho ai i ka wā e hana ana lākou i ke kelepona. kēia pūnaewele. I kēia kūʻana,ʻo kaʻilima he kikowaena waena, a heʻulaʻula like.

I ka hopena, hiki iāʻoe ke hoʻohana i nā koina kala RGBA no nā kala momona. Ke kākoʻo neiʻo RGCA i nā polokalamu hou o nā mea hou, no laila hiki iāʻoe ke hoʻohana i kēia mau waiwai me ka hopohopo nuiʻole iʻole e kākoʻoʻia i kahi pūnaewele pūnaewele, akā hiki iāʻoe ke hoʻonohonoho i ka hāʻule iʻole.

p. color: rgba (47,86,135,1); }

ʻO kēia kūlana RGBA like ia me keʻano kalaʻula kala i hōʻike muaʻia. ʻO nā helu muaʻekolu i hoʻonohonoho i nā kumukūʻai Red, Green, a me Blue aʻo ka helu hope loaʻo ia ka'ōkuhi alpha. Hoʻonohonohoʻia i "1",ʻo ia hoʻi, "100%", no lailaʻaʻole eʻikeʻia kēia kaha. Inā hoʻonohoʻoe i kēlā i ka helu decimal, e like me .85, hiki ke unuhi i 85% opacity aʻo ke kala eʻike maopopo loaʻia.

Inā makemakeʻoe e pale i nā koina o kāu lei, e hanaʻoe i kēia:

p '
ʻike: # 2f5687;
lepe: rgba (47,86,135,1);
}

Hoʻonohonoho kēia kikowaena i ka wae hex. A laila, kākauʻo ia i kēlā kumukūʻai me ka helu RGBA. ʻO kēia keʻano o kēlā me kēia pūnaeweleʻoi aku i kākoʻoʻole iā RGBA e loaʻa i ka waiwai mua a haʻalele i ka lua. E hoʻohana nā polokalamu kelepona hou i ka lua no ka hoʻopiʻi CSS.