Nā Kōkuke a me nā ID e kōkua i ka hoʻonuiʻana i kāu CSS
Ke kūkuluʻana i nā pūnaewele i ka pūnaewele o kēia lā, pono kaʻike hohonu o CSS (Cascading Style Sheets). Eia nā kuhikuhi āu e hāʻawi i kahi pūnaewele e hoʻoholo i kahi e hoʻolālāʻia ai ma ka puka polokalamu kele pūnaewele. Ke hoʻohana neiʻoe i keʻano o nā "kāhua" i kāu palapala HTML e hana i ka nānā a me ka manaʻo o kāu pūnaewele pūnaewele.
He nui nāʻano e hoʻopili ai i kēlāʻano i hanaʻia ma mua o kahi palapala, akā makemake pinepineʻoe e hoʻohana i kahiʻano ma kahi wale nō o nā kumuhana i loko o kahi palapala, akā,ʻaʻoleʻo nā hanana a pau o kēlā māhele.
Hiki paha iāʻoe ke hana i kahiʻano e hiki ai ke hoʻohana i nāʻano likeʻole ma kahi palapala, me kaʻole e hana hou i ka rule style no kēlā me kēia manawa. No ka hoʻokōʻana i kēia mauʻano i makemakeʻia, e hoʻohanaʻoe i ka papa a me nāʻano HTML ID. ʻO kēia mau'ulina ka mana honua e hiki ke hoʻohanaʻia i ka pau loa o kēlā me kēia HTML tag.ʻO ia hoʻi, ināʻoe e kapa nei i nā mahele, parakalaka, nā loulou, nā papa inoa a me nā'āpana'ē aʻe o ka HTML ma kāu palapala, hiki iāʻoe ke huli i ka papa a me nāʻano ID kōkua iāʻoe e hoʻopau i kēia hana!
Nā Papa koho
Hiki i ka papa ke koho iāʻoe e hoʻonoho i nāʻano lōʻihi i ka mea hoʻokahi a iʻole ka tag i kahi palapala. Eia kekahi laʻana, makemake pahaʻoe e kākau i kekahi mau māhele o kāu mau'ōlelo ma kekahiʻano'ē aʻe mai nā mea'ē aʻe o ka palapala. ʻO kēia mau māhele i hoʻonuiʻia e hiki ke lilo i "akāka" e hoʻonoho ana ma kaʻaoʻao. Hiki iāʻoe ke hoʻoili i kāu parapili me nā papa e like me kēia:
p #: 0000ff; }
p.alert {kala: # ff0000; }
ʻO kēia mauʻano e hoʻonohonoho i ka'ōlena o nā parakalaka a pau i ka polū (# 0000ff), akā, ma kahi o ka papa inoa i kapaʻia i kaʻulaʻula (# ff0000). Loaʻa kēia ma muli o ke kūlana kiʻekiʻe o ka papa ma mua o ka rule CSS mua, ka mea hoʻohana wale i kahi koho koho.
I ka hanaʻana me CSS, e hoʻopau kahi kulekeleʻoi aʻe i kahi mea kiko'ī. No laila, ma kēiaʻano hiʻohiʻona,ʻo kaʻoihana maʻamau ka mea e hoʻonohonoho ai i ka laula o nā paukū a pau, akāʻo ka lua,ʻoi aʻe o nā kulekeleʻoi aʻe ma luna o kekahi mau palakala.
Eia keʻano e hiki ai ke hoʻohana i kēia ma kahi hōʻailona HTML:
E hōʻikeʻia kēia māhele i ka polū,ʻo ia ka mea kūpono no kaʻaoʻao.
E lilo ana kēia paukū i ka uliuli.
A e hōʻikeʻia kēia pauku ma ka ulaula mai ka manawa o ka haumāna e kāʻili i ka'ahuʻula uliuli mai ka mea koho koho.
Ma kēlāʻano, e pili wale ana keʻano o "p.alert" i nā māhele o ka papahana e hoʻohana ana i kēlā papa "papa." Inā makemakeʻoe e hoʻohana i kēlā papa ma nā hanana HTML nui, ponoʻoe e wehe i ka mea HTML mai ka hoʻomakaʻana o ka kāhea kapa (pono e haʻalele i ka wā (.) ma kahi), e like me kēia:
.alert {kāʻala-kala: # ff0000;}
Aia kēia papa i kēia mau mea e pono ai. Ma kēlā me kēia'āpana o kāu HTML e loaʻa i kahi kelepona o ka "Aleki" e loaʻa i kēiaʻano kāhili. Ma ka HTML ma lalo, loaʻa iā mākou kekahi paukū a me kahi pane kiʻekiʻe 2 e hoʻohana ana i ka papa "nānā". Loaʻa i nā meaʻelua heʻulaʻula me kaʻulaʻula e pili ana i ka CSS a mākou i hōʻike wale ai.
E kākauʻia kēia paukū i kaʻulaʻula.
A iʻaneʻi hoʻi e h2 kēia hulu /
Ma nā pūnaewele i kēia lā, hoʻohana pinepineʻia nāʻano papa hana ma ka nui o nā kumuhana no ka mea,ʻoi aku ka maʻalahi o ka hana a me kahi hiʻohiʻona kiko'ī a nā ID. Hiki iāʻoe ke huli i nā palapala HTML e kū nei e hoʻopihaʻia me nāʻano papahana, a ua'ōlelo pinepineʻia kekahi o ia mau mea i loko o kahi palapala a me nā mea'ē aʻe i hiki keʻikeʻia i hoʻokahi.
Nā koho ID
Na ke koho koho ID eʻae iāʻoe e hāʻawi i kahi inoa i kekahiʻanoʻanoʻole e hoʻohanaʻia me kahi hōʻailona a iʻole kekahi mea HTML . E'ōlelo iāʻoe he mahele i kāu hōʻailona HTML e loaʻa nāʻike e pili ana i kahi hanana.
Hiki iāʻoe ke hāʻawi i kēia māhele i ka inoa ID o "ka hopena", a laila inā makemakeʻoe e wehewehe i kēlā māhele me ka palenaʻeleʻele āpau 1-pixel e kākauʻoe i kahi helu helu likeʻole penei:
#event ~ palena: 1px ikaika # 000; }
ʻO ka pilikia me nā koho koho ID ,ʻaʻole hiki ke'ōlelo houʻia i loko o kahi palapala HTML. Pono lākou he hoʻokahi (hiki iāʻoe ke hoʻohana i ka ID hoʻokahi ma nāʻaoʻao he nui o kāu pūnaewele, akā hoʻokahi wale nō i kēlā me kēia pepa HTML). No laila, inā he mau hanana 3 kāu e makemake ai i kēia palena, ponoʻoe e hāʻawi iā lākou i nāʻano ID o "event1", "event2" a me "event3" a me keʻano o kēlā me kēia. No laila,ʻoi aku ka maʻalahi o ka hoʻohanaʻana i ka manaʻo o ka "papahana" i'ōleloʻia ma mua a kāhiko aku ia mau mea a pau.
ʻO kekahi pahuhoʻa me nāʻano ID heʻoi aku ko lākou kiʻekiʻe ma mua o nāʻano papa. ʻO kēia keʻano inā ponoʻoe e loaʻa ka CSS e kāohi i kahi kālaiʻia i hoʻonohonoho muaʻia, hiki iāʻoe ke hana pēlā inā ua hilinaʻi nuiʻoe ma nā ID. No kēia kumu i neʻe aku ai nā mea hoʻomohala pūnaewele mai ka hoʻohanaʻana i nā ID i loko o kā lākou pahuhopu, inā lākou wale nō e manaʻo e hoʻohana i kēlā waiwai i hoʻokahi manawa, a ua huli i mua i nāʻanoʻano papa kūikawā no nāʻano a pau.
ʻO kahi kahi i hoʻokomoʻia ai ka hoʻoiho ID i ka wā e makemakeʻoe e haku i kahiʻaoʻao i loaʻa i nā pūnaewele o kahi heleuma. Eia kekahi lā, inā he pūnaewele papahana parallax āu e paʻa ana i nā mea a pau ma kahiʻaoʻao me nā loulou e "lele" i nāʻaoʻao likeʻole o kēlāʻaoʻao. Hanaʻia kēia ma ka hoʻohanaʻana i nāʻano ID a me nā loulou'ōlelo e hoʻohana ana i kēia mau loulou heleuma.
Eʻoluʻoluʻoe e hoʻohui i ka waiwai o kēlāʻano, i mua o ka # symbole, i ka inoa href o ka loulou, e like me kēia:
ʻO kēia ka loulou
I ka pāʻana a i ka pāʻana paha, e lele kēia pūlou ma kahiʻaoʻao o kaʻaoʻao i loaʻa kēiaʻano ID. Ināʻaʻohe kumuhana ma kaʻaoʻao i hoʻohana i kēia helu ID, hikiʻole i ka loulou ke hana i kekahi mea.
E hoʻomanaʻo, inā makemakeʻoe e hana i kaʻaoʻao e pili ana i kahi pūnaewele, e koiʻia ka hoʻohanaʻana i nāʻano ID, akā hiki iāʻoe ke huli i nā papa no nā kumu hana CSS nui. ʻO kēia keʻano o koʻu nānāʻana i nāʻaoʻao i kēia mau lā - hoʻohana wau i nā mea koho i ka papa i ka mea hiki a hiki wale i nā ID inā makemake au i ka mea e hana aiʻaʻole ka lou no CSS wale nō ma kahi link link.
Ka'ōlelo kumu mua na Jennifer Krynin. Hoʻoponoponoʻia e Jeremy Girard ma 8/9/17