Nzira Yokushandisa Nayo Span uye Div HTML Elements

Shandisa nzvimbo uye div neCSS kuti chimiro chikuru uye kuronga masvingo.

Vanhu vakawanda vari vatsva pakushamba kwewebhu uye HTML / CSS vanoshandisa uye

zvinhu nenzira inopesana sezvavanovaka mawebheji. Ichokwadi, zvisinei, ndeyekuti chimwe nechimwe chezvinhu izvi zve HTML zvinoshandisa zvinangwa zvakasiyana. Kudzidza kushandisa imwe neimwe nekuda kwechinangwa chayo chinokubatsira iwe kuwedzera mapeji akachena akavhara mazano ari nyore kutarisira zvakakwana.

Kushandisa
Element

Iyo div element inotsanangura kugovana kwakananga pane peji rako rewebhu.

Icho chinongoita bhokisi umo iwe unogona kuisa mamwe mazano eHTML anogadzirisa zvinonzwisisika pamwe chete. Kupatsanurwa kunogona kuva nezvimwe zvinhu zvakawanda mukati mazvo, sezvikamu, zvinyorwa, mazita, masangano, zvifananidzo, nezvimwe. Zvinogona kuva nezvimwe zvikamu mukati maro kuti zvive nehumwe hutano uye sangano ku HTML yako.

Kuti ushandise div element, isa pachena

tag pamberi pezvimbo peji rako iwe waunoda sechaparadzanisa, uye pedyo tag shure kwayo:

zviri mukati me div

Kana nzvimbo ye peji yako inoda mamwe mashoko aunoshandisa pakuita neCSS mushure mekunge, unogona kuwedzera imwe sarudzo (semuenzaniso,

id = "myDiv">), kana kirasi sarudzo (semuenzaniso, class = "bigDiv">). Zvose izvi zvinokwanisika zvinogona kusarudzwa uchishandisa CSS kana kushandiswa uchishandisa JavaScript. Ikozvino yakanakisisa miitiro inoshandiswa kushandiswa pakusarudza vasarudzo vekirasi panzvimbo yeAIDS, muchikamu nekuda kwekuti zvakananga sei vasarudzo veAIDS. Muzvokwadi, zvisinei, iwe unogona kushandisa rimwe chete uye unokwanisa kunyange kupa kuparadzanisa zvose chizivo uye kirasi sarudzo.

Nguva Yokushandisa

Versus

Iko div element yakasiyana neye HTML5 chikamu chechikamu nokuti haisi kupa zvinyorwa zvakapetwa chero zvese zvinoreva semantic. Kana iwe usingazivi kana bhokisi rehupenyu rinofanira kunge riri div kana chikamu, funga nezvechinangwa chechikamu chezvinhu izvi uye zvigadziro zvingakubatsira kuti usarudze chii chaunoshandisa:

  • Kana uchida chinhu ichocho kuti uwedzere maitiro kune iyo nzvimbo ye peji, unofanira kushandisa div element.
  • Kana zvinyorwa zvinenge zviripo zvine pfungwa yakasiyana uye zvinogona kumira pachazvo, iwe unogona kushandisa chikamu chechikamu pane.

Pakupedzisira, zvikamu zviviri uye zvikamu zvinofanana zvakafanana uye iwe unogona kupa mumwe wavo kuti anyore maitiro uye anozvifananidza neCSS kuti aone sewebsite yako yaunoda. Zvose izvi izvi zvikwereti zvakaenzana.

Achishandisa Element

Iko tsanangudzo yenhengo inline in element by default. Izvi zvinoritsanangurira kubva kune div uye chikamu chezvinhu. Nzvimbo yepakati inowanzoshandiswa kuvhara chimwe chikamu chezvakagadzirwa, kazhinji zvinyorwa, kuti zvive ne "hook" yakawedzerwa inogona kunyorwa gare gare. Inoshandiswa neCSS, inogona kushandura chimiro chemashoko inopinza; zvisinei, pasina chero maitiro echifambiro, chinongedzo chega chinenge chisina maturo pamashoko zvachose.

Uyu ndiwo musiyano mukuru pakati penguva uye div elements. Sezvambotaurwa pamusoro apa, div element inosanganisira chidimbu chemafuro, asi chinonzi span chinhu chinongoudza shanduro kuti ishandise mitemo yeCSS yemitauro kune izvo zvakapoteredzwa ne tags:


Nyaya yakanyatsonzwisiswa uye isina kunyanya kusimbiswa.

Wedzera kirasi = "kusimbisa" kana imwe chidzidzo kune imwe nzvimbo yep span kuti utaure zvinyorwa neCSS (p., Class = "highlight">).

Izvo zvinhu zvesimba hazvina zvido zvinoda, asi zvitatu izvo zvinobatsira zvikuru zvakafanana neaya e div element:

  • style
  • kirasi
  • id

Shandisa nguva iyo iwe uchida kuchinja mararamiro ezvinyorwa usinganzwisisi izvo zvinogadziriswa sechitsuwa chemazinga-level mubhuku racho.

Somuenzaniso, kana iwe uchida shoko rechipiri reh3 rinotungamira kuti rive rakatsvuka, unogona kukomberedza shoko iro neshoko re span rinogona kutora shoko iro segwaro rutsvuku. Izwi rinoramba riine chikamu cheH3 element, asi iye zvino rinoratidzawo mukundu:

Uyu ndiwo musoro wangu unotyisa

Yakarongedzwa naJeremy Girard musi we2/2/17