Panga HTML _

Jinsi upambaji wa HTML unavyofanya kazi

Kiremba kinasoma alama yako lebo kwa lebo, kinafuatilia kina cha kila kipengele kilichowekwa ndani, na kukitoa tena na upachikaji wa kawaida. Hakibadilishi kinachofanya ukurasa kuwakilishwa — ni jinsi chanzo kinavyoonekana tu.

1. Gawanya Lebo. Maktaba inascanisha ingizo lako kuwa mkondo wa tokeni: lebo za ufunguzi, lebo za ufungaji, maudhui ya maandishi, maoni, na maudhui ya vitalu vya script na style. Thamani za sifa zilizowekwa kati ya alama za kurejesha na miili ya vipengele vya pre na textarea inashughulikiwa kama vitengo vimoja, hivyo nafasi ndani yao inabaki bila kuguswa.
2. Fuatilia Uwekaji wa Ndani. Kinaposonga mkondo wa tokeni, kiremba kinadumisha kiwango cha kina cha sasa. Kila lebo ya ufunguzi ambayo si ya kujifunga husogeza kiwango kwa hatua moja kirefu zaidi; kila lebo ya kufunga inayolingana hulichomoa. Kina hicho kinaamua idadi ya vitengo vya kina vilivyo mbele ya kila mstari unaorejeshwa.
3. Tumia Mipangilio Yako. Chaguo lako la kina — nafasi 2, nafasi 4, au tab — linaweka upana wa kiwango kimoja. Thamani ya kufunga kwa kolamu huvunja mistari mirefu ya sifa au maandishi inapopita kolamu unayochagua. Kikomo cha mistari tupu hukunja mfululizo mrefu wa mistari tupu hadi mpaka unaoweka.
4. Toa Alama. Hatimaye kipanga kinachapisha lebo kurudi na upachikaji na mapumziko ya mistari kilichofanya kazi. Ikiwa umewasha uumbizaji wa ndani, maudhui ya kila kitalu cha style hupita kupitia kipanga cha CSS na kila kitalu cha script kupitia kipanga cha JS, hivyo msimbo uliowekwa ndani unaoana na alama inayoizunguka.

Kwa nini upange HTML

• Soma kurasa zilizobungwa. HTML ya uzalishaji inasafirishwa bila mapumziko ya mistari ili kuokoa baiti. Kupanga kunarudisha muundo ili uweze kupata sehemu unayotafuta, kuona lebo ya kufunga iliyopotea, na kufuatilia jinsi hati inavyowekwa ndani kweli kweli.
• Panga violezo visivyo na mpangilio. Alama ambayo watu kadhaa wameihariri inaendelea kupata upachikaji uliochanganyika na uwekaji wa lebo. Kupita mara moja kupitia kiremba kunasawazisha faili nzima, hivyo kujitolea kunachofuata kunaonyesha mabadiliko uliyofanya badala ya ukuta wa nafasi zilizoandikwa upya.
• Haiodhi ukurasa wako. Viremba vingi vya mtandaoni hupakia maktaba yao yote wakati unafungua ukurasa. Hii inapakia js-beautify tu unaposhinikiza Panga au kuwasha hali ya moja kwa moja, hivyo kufungua ukurasa kunagharimu kilobytes chache badala ya mamia, na utekelezaji wa awali unabaki wa haraka.
• Hakuna kinachoacha kivinjari chako. Kiremba kinafanya kazi kabisa kwenye kifaa chako. Alama yako haipakiwa kwenye seva kamwe — hii ni muhimu ukurasa unaomilikiwa na mteja, una URL za ndani, au unashughulikiwa na makubaliano ya usiri uliyosaini.

Matumizi ya kawaida

Kupanga HTML hutokea wakati wowote mtu anahitaji kusoma alama ambayo haikuandikwa kuwa inasomeka.

• Kukagua ukurasa wa moja kwa moja: bandika chanzo kilichobungwa kutoka Angalia Chanzo ili kupata alama nyuma ya hitilafu ya mpangilio ambayo huwezi kuizalisha mahali pengine.
• Kusafisha matokeo ya CMS: andika upya kiolezo ambacho kijenzi cha ukurasa kilisafirisha katika mstari mmoja kabla ya kukirudisha kwenye hifadhi.
• Ukaguzi wa ufikiaji na SEO: panua hati ili uweze kuangalia mpangilio wa vichwa, muundo wa alama, na sifa za alt dhidi ya DOM halisi.

Mfano uliofanyiwa kazi

Chukua kipande kilichobungwa: <div><p>hi</p><span>x</span></div>. Ibandike hapo juu na upachikaji umewekwa kwa nafasi 2, kisha bonyeza Panga. Unapata bloku inayoweza kusomeka: <div> kwenye mstari wake wenyewe, <p>hi</p> na <span>x</span> kila moja imepachikwa kiwango kimoja kirefu zaidi, na </div> inayolingana iliyopangwa chini yake. Badilisha upachikaji hadi Tab na kila kiwango kitabadilika kutoka nafasi mbili hadi herufi ya tab. Ongeza kitalu cha <style>a{color:red}</style>, washa "Pia panga CSS na JS zilizowekwa ndani," na sheria itapanuka hadi mistari yake yenye upachikaji badala ya kubaki kwenye mstari mmoja.

FAQ

Je, hii inafanya kazi kwenye kivinjari changu?

Ndiyo. Maktaba ya js-beautify inapakia mara ya kwanza unapobonyeza Panga au kuwasha hali ya moja kwa moja, kisha inawekwa kwenye akiba. Alama yako hauachi ukurasa kamwe — hakuna safari ya seva na hakuna upakiaji.

Je, kupanga kutabadilisha jinsi ukurasa wangu unavyowakilishwa?

Hapana. Kiremba kinaongeza na kuondoa nafasi na mapumziko ya mistari kati ya lebo tu. Kivinjari kinapuuza nafasi hizo kinapojenga ukurasa, hivyo matokeo yanayowakilishwa yanafanana kabisa. Jambo moja la kuangalia ni maudhui yanayotegemea nafasi ndani ya pre, textarea, au vipengele vya mstari, ambavyo kipanga kimakusudi hakivigusi.

Kitufe cha CSS na JS za ndani kinafanya nini?

Kikizimwa, maudhui ya vitalu vya style na script yanabaki hasa kama ulivyovibandika. Kiwashwa, CSS ndani ya kila kitalu cha style hupita kupitia kipanga cha CSS na JavaScript ndani ya kila kitalu cha script kupitia kipanga cha JS, hivyo msimbo uliowekwa ndani unaoana na alama inayoizunguka.

"Funga kwa kolamu" inafanya nini?

Inaweka urefu wa mstari ambapo lebo yenye sifa nyingi, au mfululizo mrefu wa maandishi, huvunjwa hadi mistari mingi. Iacha sifuri ili kuweka kila kipengele kwenye mstari mmoja bila kujali urefu. Iweke 80 au 120 na kipanga kitavunja chochote kinachopita kolamu hiyo, kikifanya vipengele vipana visomeke katika kihariri nyembamba.

Upambaji wa HTML upande wa kivinjari unakupa alama inayoweza kusomeka bila hatua ya kujenga au upakiaji. Bandika ukurasa uliobungwa au usio nadhifu, chagua upachikaji na upana wa kufunga, amua kama unataka kuandika upya CSS na JS zilizowekwa ndani, kisha nakili au pakua matokeo. Hakuna kinachoacha kifaa chako, hakuna akaunti, na maktaba inapakia tu uiombapo — hivyo kufungua ukurasa huu kukuwa ghali kilobytes chache, si megabyte.