He aha ka ʻokoʻa ma waena o ka papa koho CSS a me ka id? id a me ka hoʻohana papa ma HTML

He aha ka ʻokoʻa ma waena o ka papa koho CSS a me ka id? id a me ka hoʻohana papa ma HTML

Chen Weiliange hoʻokō nei i kēia manawaSEO, hoʻonui i ka pūnaeweleWordPresskumuhana

ʻOiai ua aʻo mua au i kekahi mau ʻike HTML a me CSS ma mua, akā ʻaʻole wau i hoʻohana iā ia no kekahi manawa, ʻoi aku ka hoʻohana ʻana i ka ʻāpana CSS, maʻalahi ke poina.

No laila, e hoʻopaʻa a hōʻuluʻulu i ka ʻokoʻa a me ka hoʻohana ʻana i ka CSS koho id a me ka papa ma aneʻi:

• id pili me #div
• pili ka papa me .div

ʻO ka ʻokoʻa ma waena o ka id a me ka papa

id wehewehe

• ʻO ka id he hōʻailona paʻa, i hoʻohana ʻia e wehewehe i ke ʻano nui ma ka ʻaoʻao pūnaewele, i wehewehe ʻia ma ke ʻano o #div
• No ka laʻana: hoʻokaʻawale i nā kolamu, luna, kino, lalo, etc.
• Hoʻohana ʻia e wehewehe i kahi mea kikoʻī, hiki ke ʻike ʻia i hoʻokahi wale nō ʻaoʻao a ʻaʻole hiki ke kāhea pinepine ʻia.

wehewehe papa

• ʻO ka papa he pūʻulu kaila, i hoʻohana ʻia e wehewehe i nā ʻano kikoʻī o ka ʻaoʻao pūnaewele. Ua wehewehe ʻia ma ke ʻano o .div a hiki ke hana hou.
• No ka laʻana: kahi papa kuhikuhi kikoʻī, kahi laina kikokikona, etc.
• Ma ka ʻaoʻao hoʻokahi, hiki ke kāhea pinepine ʻia e nā mea he nui

ʻAʻohe waiwai o ka mea koho div. Ma ka wehewehe ʻana i kāna css, hoʻomalu ʻo ia i kekahi mau hoʻolālā e like me ka laula, ke kiʻekiʻe, ke kala hope a me ka nui kikokikona o ka div.

KinohiKālepa uilapūnaewele puni honua,kūkulu i kahi pūnaeweleʻO ka ʻaoʻao pūnaewele html i hana ʻia e ka papahana e ʻike i ka hoʻolālā ʻaoʻao ma o CSS.

He aha ka mea koho?

ʻO ka wehewehe ʻana o kēlā me kēia ʻano CSS he ʻelua ʻāpana:

选择器 {样式}

• ʻO ka ʻāpana ma mua o ka {} ka "koho".
• Hōʻike ka "koho" i ke "ʻano" o {} e hana ai.
• ʻO ia hoʻi, ma kahi o ka ʻaoʻao pūnaewele e hana ai kēia "style"?

laʻana code

Eia ke ʻano e koho ai a hoʻohua i kahi mea class="sidebar":

.sidebar
{ 
background-color:black;
}

Eia ke ʻano e koho ai a e kāhiko i kahi mea me ka id="footer":

#footer
{ 
background-color:black;
}