Waa maxay faraqa u dhexeeya fasalka xulashada CSS iyo aqoonsiga? id iyo isticmaalka fasalka HTML

Waa maxay faraqa u dhexeeya fasalka xulashada CSS iyo aqoonsiga? id iyo isticmaalka fasalka HTML

Chen Weiliang ayaa dhawaan ka shaqeynayay SEO , isagoo hagaajinaya mawduuca WordPress ee bogga internetka.

In kasta oo aan hore u bartay qaar ka mid ah aqoonta aasaasiga ah ee HTML iyo CSS, laakiin ma aan shaqayn in muddo ah, gaar ahaan isticmaalka qaybta CSS, way fududahay in la iloobo.

Haddaba, diiwaan geli oo soo koob kala duwanaanshaha iyo adeegsiga aqoonsiga xulashada CSS iyo fasalka halkan:

• id u dhigma #div
• fasalka u dhigma .div

Farqiga u dhexeeya id iyo fasalka

sharaxaad id

• id waa sumad go'an, oo loo isticmaalo in lagu qeexo qaabka weyn ee bogga shabakadda, kaas oo lagu qeexay qaabka #div
• Tusaale ahaan: qaybinta tiirarka, sare, jirka, hoose, iwm..
• Waxaa loo isticmaalaa in lagu qeexo shay gaar ah, kaas oo soo bixi kara hal mar oo keliya oo aan lagu soo celin karin.

sharaxaad fasalka

• Fasalka waa koox qaabaysan, kaas oo loo isticmaalo in lagu qeexo qaababka faahfaahsan ee bogga shabakadda.Waxa lagu qeexaa qaabka .div waana lagu soo celin karaa.
• Tusaale ahaan: menu gaar ah, xariiq qoraal ah, iwm...
• Isla bogga, waxaa loogu yeeri karaa si isdaba joog ah xubno badan

Div selector laftiisu ma laha wax sifooyin ah, marka uu qeexo css-kiisa, waxa uu kontoroolo qaar ka mid ah jaantusyada sida ballaca, dhererka, midabka asalka iyo cabbirka qoraalka div.

Mareegaha ganacsiga elektaroonigga ah iyo boggaga internetka ee HTML ee ay sameeyaan barnaamijyada dhismaha mareegaha waxay isticmaalaan CSS si ay u gaaraan qaab-dhismeedka bogga.

Waa maxay dooriye?

Qeexida qaab kasta oo CSS ah waxa uu ka kooban yahay 2 qaybood:

选择器 {样式}

• Qaybta ka horeysa {} waa "dooriyaha".
• "dooriyaha" ayaa tilmaamaya "qaabka" {} ee uu u dhaqmo.
• Taasi waa, qaybtee ka mid ah bogga shabakadda ayuu "qaabka" ka shaqeeyaa?

tusaale code

Waa kan sida loo doorto oo loo qaabeeyo curiyaha class="sidebar":

.sidebar
{ 
background-color:black;
}

Waa kan sida loo doorto oo loo qaabeeyo curiye leh id="footer":

#footer
{ 
background-color:black;
}