Indlela yokusebenzisa i-Span ne-Div HTML Elements

Sebenzisa isikhala ne div nge CSS ngesitayela esikhulu nesilawuli sokuhlela.

Abantu abaningi abasha kumklamo wewebhu kanye ne-HTML / CSS basebenzisa futhi

izakhi ngokungahambisani njengoba zakha amakhasi ewebhu. Kodwa-ke, okuyiqiniso ukuthi yilowo nalowo walezi zici ze-HTML usebenza ngezinhloso ezahlukene. Ukufunda ukusebenzisa ngayinye ngenjongo yalo okuhloswe kuyokusiza ukuba uhlakulele amakhasi ewebhu ahlanzekile, ikhodi kulula ukuphatha jikelele.

Ukusebenzisa i-
Element

Isici se-div sichaza ukuhlukana okunengqondo ekhasini lakho lewebhu.

Ngokuyisisekelo ibhokisi lapho ungafaka khona ezinye izakhi ze-HTML ezihamba ngokuvumelana. Ukuhlukaniswa kungaba nezinye izinto eziningi, njengamahlathi, izihloko, izinhlu, izixhumanisi, izithombe, njll. Kungaba nokunye ukuhlukaniswa phakathi kwalo ukunikeza isakhiwo esengeziwe nokuhlelwa kwidokhumenti yakho ye-HTML.

Ukuze usebenzise i-div element, faka ithegi evulekile

ngaphambi kwendawo yekhasi lakho oyifunayo njengecala elihlukile, kanye negama eliseduze ngemva kwalo:

okuqukethwe kwe div

Uma indawo yekhasi lakho idinga olunye ulwazi oluthe xaxa ozolisebenzisa ngesitayela nge-CSS kamuva, ungangeza umkhethi we-id (isib.

id = "myDiv">), noma i-class selector (isib, class = "bigDiv">). Zombili lezi zimfanelo zingase zikhethwe kusetshenziswa i-CSS noma ziguquliwe usebenzisa i-JavaScript. Izindlela ezihamba phambili zanamuhla zixhomeke ekusebenziseni abakhethi beklasi esikhundleni sama-ID, ngokwengxenye ngenxa yokuthi abakhethi be-ID abathile bangabani. Nokho, eqinisweni, ungasebenzisa eyodwa futhi ungenza ngisho nokuhlukanisa kokubili i-ID nomkhethi weklasi.

Isikhathi sokusebenzisa

Versus

Isici se-div sihlukile kusiqephu sesigaba se-HTML5 ngoba asiniki okuqukethwe okuhlanganisiwe noma yimuphi umqondo we-semantic. Uma ungaqiniseki ukuthi i-block yokuqukethwe kufanele ibe yi-div noma isigaba, cabanga ngalokho injongo yento kanye nokuqukethwe okuzokusiza ukuthi unqume ukuthi yini ongayisebenzisa:

  • Uma udinga isici nje ukufaka izitayela kuleyo ndawo yekhasi, kufanele usebenzise i-div element.
  • Uma okuqukethwe okumele kube khona kunokugxila okuhlukile futhi kungahle kume uqobo, ungase ufune ukusebenzisa isigaba sesigaba kunalokho.

Ekugcineni, kokubili ama-divs nezigaba ziziphatha ngendlela efanayo futhi unganika noma yiziphi zazo izimfanelo kanye nesitayela nge-CSS ukuze zibukeke isayithi lakho eliyidingayo. Zombili lezi yizici zezinga lokuvimba.

Ukusebenzisa i- Element

I-span element isici esinqunyiwe ngokuzenzakalelayo. Lokhu kuyisihlukanisa ne div kanye nezigaba zesigaba. I-span element ivame ukusetshenziselwa ukugoqa ucezu oluthile lokuqukethwe, evamile umbhalo, ukunikeza "hook" eyengeziwe engabhalwa kamuva. Isetshenziswe nge-CSS, ingashintsha isitayela sombhalo esiyifaka; Kodwa-ke, ngaphandle kwezimpawu zesitayela, i-span element kuphela ayinayo umphumela kumbhalo nhlobo.

Lona umehluko omkhulu phakathi kwesigaba kanye nezici ze-div. Njengoba kuphawuliwe ngenhla, i-div element ihlanganisa ukuhlukaniswa kwesigcawu, kanti isici se-span sitshela isiphequluli ukuthi sisebenzise imithetho ehambisanayo yesitayela se-CSS kulokho okufakwe amathegi:


Umbhalo okhanyisiwe nombhalo ongaqanjwanga.

Engeza isigaba = "ukugqamisa" noma esinye isigaba esakhiweni se-span ukuze isitayela umbhalo nge-CSS (isb., Class = "ukugqamisa">).

Isici se-span asinayo izimfanelo ezidingekayo, kodwa ezintathu eziwusizo kakhulu zifana nalezo ze-div element:

  • isitayela
  • ekilasini
  • id

Sebenzisa isikhathi lapho ufuna ukushintsha isitayela sokuqukethwe ngaphandle kokuchaza lokho okuqukethwe njengesici esisha se- block-level kudokhumenti.

Isibonelo, uma ufuna igama lesibili le-h3 elibhekene nokubomvu, ungayungeza lelo gama ngesici sendawo esingaba nesitayela lelo gama njengombhalo obomvu. Igama lisaqhubeka liyingxenye ye-h3 element, kodwa manje futhi libonisa obomvu:

Lona isihloko esiyinhloko sami

Ihlelwe nguJeremy Girard ngomhlaka 2/2/17