Esi zoo njikọta iji CSS

Icheta njikọ na CSS nwere ike ịme ọtụtụ ụzọ, mana anyị ga-ele anya ụzọ abụọ a ga-esi zoo URL kpamkpam. Ọ bụrụ na ịchọrọ ịchọta ịchụ nta ma ọ bụ akwa egg na saịtị gị, nke a bụ ụzọ dị mma iji zoo njikọ.

Ụzọ mbụ bụ site na iji "onye ọ bụla" dị ka ọnụ ọgụgụ ndị nwere ọnụahịa CSS. Ihe nke ozo bu site n'igbu ihe ederede ka o kwekọọ na ndabere nke ibe.

Buru n'uche na usoro ọ bụla ga - eme ka njikọ ahụ kwụsị kpamkpam site n'ịchọta ya mgbe ị na - achọ koodu ntinye. Otú ọ dị, ndị ọbịa agaghị enwe ụzọ dị mfe ma dị mfe iji hụ ya, na ndị ọbịa gị ndị na-amaghị na ha agaghị enwe ntụziaka maka ịchọta njikọ ahụ.

Rịba ama: Ọ bụrụ na ịchọrọ ntụziaka banyere otu esi ejikọta akwụkwọ mpempe akwụkwọ mpụta, ntụziaka ndị a abụghị ihe ị na-eme. Hụ Gịnị Bụ Mpempe akwụkwọ Mpụga? kama.

Gbanyụọ mmepe mmepe

Usoro mbụ anyị nwere ike iji zoo URL bụ ka njikọ ahụ ghara ime ihe ọbụla. Mgbe òké ahụ na-ekpuchi njikọ ahụ, ọ gaghị egosi ihe URL na-egosi na ọ gaghị ekwe ka ị pịa ya.

Dee HTML n'ụzọ ziri ezi

Otu ibe weebụ, jide n'aka na hyperlink na-agụ dị ka nke a:

ThoughtCo.com

N'ezie, "https://www.thoughtco.com/" kwesịrị igosi kpọmkwem URL ịchọrọ ị zoo, na ThoughtCo.com nwere ike gbanwere ọ bụla okwu ma ọ bụ ahịrịokwu ịchọrọ na-akọwa njikọ ahụ.

Echiche a bụ na ọrụ klas ga-eji CSS dị n'okpuru iji zoo njikọ ahụ n'ụzọ dị irè.

Jiri CSS Usoro a

CSS koodu choro igosi akwukwo ndi ozo ma kpughewa ihe omimi na ihe omume n'elu njikọ click, kwesiri ibu "onye obula," dika nke a:

.active {pointer-events: none; nkọ: ndabara; }

Ị nwere ike ịhụ usoro a na arụ ọrụ n'elu JSFiddle. Ọ bụrụ na ị wepụ CSS koodu n'ebe ahụ, wee weghachite data ahụ, njikọ ahụ na-eme ngwa ngwa ghọọ clickable na ọ bara uru. Nke a bụ n'ihi na mgbe ejighị CSS, njikọ ahụ na-akpa àgwà.

Rịba ama: Cheta na ọ bụrụ na onye ọrụ ahụ na-ele koodu ntinye akwụkwọ ahụ, ha ga-ahụ njikọ ahụ ma mara kpọmkwem ebe ọ na-aga n'ihi na dịka anyị na-ahụ n'elu, koodu ahụ ka dị, ọ bụghị naanị ya.

Gbanwee Njikọ & # 39; s Agba

N'ikpeazụ, onye na-emepụta weebụ ga-eme ka hyperlinks dị iche iche ka ndabere ka ndị ọbịa wee hụ ha ma mara ebe ha na-aga. Otú ọ dị, anyị nọ ebe a iji zoo njikọ , ya mere, ka anyị hụ otú e si agbanwe agba iji kwekọọ na nke ibe.

Kọwaa klaasị omenala

Ọ bụrụ na anyị ejiri otu ihe atụ ahụ site na usoro mbụ dị n'elu, anyị nwere ike ịgbanwe klas ahụ na ihe ọ bụla anyị chọrọ ka ọ bụrụ naanị njikọ pụrụ iche zoro ezo.

Ọ bụrụ na anyị ejighị otu klas ma jiri CSS mee ihe n'okpuru n'okpuru njikọ ọ bụla, ha niile ga-apụ n'anya. Nke ahụ abụghị ihe anyị na-eme mgbe a, ya mere, anyị ga-eji koodu HTML a nke na-eji klas ndị na-emechi omenala:

ThoughtCo.com

Chọpụta Ihe Agba Iji Jiri

Tupu anyị abanye koodu CSS kwesịrị ekwesị iji zoo njikọ ahụ, anyị kwesịrị ịchọpụta ụdị agba anyị chọrọ iji. Ọ bụrụ na ịnwere ezigbo ntọala ugbua, dị ka ọcha ma ọ bụ oji, mgbe ahụ ọ dị mfe. Otú ọ dị, àgwà ndị ọzọ pụrụ iche dị mkpa.

Dị ka ọmụmaatụ, ọ bụrụ na ụda ndabere gị nwere uru hex nke e6ded1 , ọ dị mkpa ka ị mara na maka CSS koodu rụọ ọrụ nke ọma maka ibe ịchọrọ ka ọ laa.

Enwere ọtụtụ n'ime "ihe nkedro" ma ọ bụ "eyedropper" ngwaọrụ, nke a na-akpọ ColorPick Eyedropper maka nchọgharị Chrome. Jiri ya iji nyochaa agba ocha nke ibe weebụ iji nweta agba hex.

Dezie CSS iji gbanwee agba

Ugbu a na ị nwere agba nke njikọ ahụ kwesiri ịbụ, oge eruro iji ya na ọnụahịa omenala site n'elu, dee CSS code:

.hedeme {agba: # e6ded1; }

Ọ bụrụ na ụcha agba gị dị mfe dị ka ọcha ma ọ bụ akwụkwọ ndụ akwụkwọ ndụ, ị gaghị etinye ntinye # n'ihu ya:

.hedeme {agba: ọcha; }

Lee usoro ntinye nke usoro a na JSFiddle a.