Je! Tag ya Ukubwa wa HTML iko?

Mara tu unapoanza kujenga wavuti na HTML, utaanza kufanya kazi na ukubwa. Ili kufanya tovuti yako kuangalia njia unayotaka kuiangalia, inawezekana kulinganisha na kubuni wewe au designer mwingine umetengeneza, utahitaji kubadilisha ukubwa wa maandiko kwenye tovuti hiyo, pamoja na vipengele vingine kwenye ukurasa. Ili kufanya hivyo unaweza kuanza kutafuta taa ya "ukubwa" wa HTML, lakini utaipata haraka.

Lebo ya ukubwa wa HTML haipo katika HTML. Badala yake, ili kuweka ukubwa wa fonts zako, picha au mpangilio unapaswa kutumia Majarida ya Sinema ya Nyaraka. Kwa kweli, mabadiliko yoyote ya kuona ambayo unahitaji kufanya kwenye maandishi ya tovuti au kipengele kingine kinapaswa kushughulikiwa na CSS! HTML ni kwa muundo tu.

Kitambulisho cha karibu zaidi kwenye lebo ya ukubwa wa HTML ni lebo ya zamani ya font, ambayo kwa kweli imejumuisha sifa ya ukubwa. Uelewe kuwa lebo hii imepunguzwa katika matoleo ya sasa ya HTML na haiwezi kuungwa mkono na wavuti katika siku zijazo! Hutaki kutumia lebo ya font katika HTML yako! Badala yake, unapaswa kujifunza CSS kwa ukubwa vipengele vya HTML na mtindo wa ukurasa wako wa wavuti kwa usahihi.

Ukubwa wa Font

Fonti ni shaka jambo rahisi zaidi kwa ukubwa na CSS. Moreso kuliko kuzingatia maandishi hayo, na CSS unaweza kuwa na maelezo zaidi kuhusu uchapaji wa tovuti yako. Unaweza kufafanua ukubwa wa font, rangi, casing, uzito, uongozi, na zaidi. Kwa lebo ya font, unaweza tu kufafanua ukubwa, na kisha tu kama namba inayohusiana na ukubwa wa kawaida wa kivinjari wa kivinjari ambao hutofautiana kwa kila mteja.

Ili kuweka aya yako kuwa na ukubwa wa font ya 12pt, tumia mali ya style ya ukubwa wa font:

h3 {font-size = 24px; }

Mtindo huu utaweka ukubwa wa font wa vipengele vya headiing3 vipiseli 24. Unaweza kuongeza hii kwa karatasi ya nje ya mtindo na H3s yako yote ya tovuti itatumia mtindo huu.

Ikiwa unataka kuongeza mitindo ya ziada ya uchapaji kwenye maandishi yako, unaweza kuongezea kwenye utawala huu wa CSS:

h3 {font-size: 24px; rangi: # 000; font-uzito: kawaida; }

Hii haikuweka tu ukubwa wa font kwa H3s, pia itaweka rangi kwa nyeusi (ambayo ni nini kanuni ya hex ya # 000 maana) na itaweka uzito kwa "kawaida". Kwa default, browsers hutoa kichwa 1-6 kama maandishi ya ujasiri, hivyo style hii ingekuwa override kwamba default na kimsingi "un-bold" maandiko.

Ukubwa wa picha

Picha inaweza kuwa ngumu kufafanua ukubwa kwa sababu unaweza kutumia kivinjari ili kurekebisha picha. Bila shaka, resizing picha na kivinjari ni wazo mbaya kwa sababu husababisha kurasa kupakia polepole zaidi na browsers mara nyingi kufanya kazi mbaya ya resizing, na kufanya picha kuangalia mbaya. Badala yake, unapaswa kutumia programu ya graphics kurekebisha picha na kisha kuandika ukubwa wao halisi kwenye ukurasa wa HTML wa wavuti.

Tofauti na fonts, picha zinaweza kutumia HTML au CSS ili kufafanua ukubwa. Unafafanua upana wa picha na urefu. Unapotumia HTML, unaweza kufafanua ukubwa wa picha kwenye saizi. Ikiwa unatumia CSS, unaweza kutumia vipimo vingine ikiwa ni pamoja na inchi, sentimita, na asilimia. Thamani hii ya mwisho, asilimia, ni muhimu sana wakati picha zako zinahitajika kuwa fluid, kama katika tovuti ya msikivu.

Ili kufafanua ukubwa wa picha yako kwa kutumia HTML, tumia urefu na sifa za upana wa tag img. Kwa mfano, picha hii ingekuwa saizi 400x400 mraba:

urefu = "400" upana = "400" alt = "picha" />

Ili kufafanua ukubwa wa picha yako kwa kutumia CSS, tumia urefu wa mitindo ya urefu na upana. Hapa ni picha sawa, kwa kutumia CSS ili kufafanua ukubwa:

style = "urefu: 400px; upana: 400px;" alt = "picha" />

Ukubwa wa Mpangilio

Ukubwa wa kawaida unayofafanua katika mpangilio ni upana, na jambo la kwanza unahitaji kuamua ni kutumia mpangilio wa upana wa kudumu au tovuti ya msikivu. Kwa maneno mengine, je! Utafafanua upana kama idadi halisi ya saizi, inchi, au pointi? Au utaweka upana wako wa mpangilio uwe rahisi kubadilika kwa kutumia asilimia au asilimia? Ili kufafanua ukubwa wa mpangilio wako, unatumia mali ya upana na urefu wa CSS kama vile utakavyokuwa kwenye picha.

Upana usiohamishika:

style = "upana: 600px;">

Upana wa maji:

style = "upana: 80%;">

Unapofanya uamuzi juu ya upana wa mpangilio wako, unapaswa kukumbuka kwa vipindi tofauti vya kivinjari ambavyo wasomaji wako wanaweza kutumia na vifaa vinginevyo watatumia. Hii ndio sababu tovuti zisizoitikia , ambazo zinaweza kubadilisha mpangilio wao na ukubwa kulingana na vifaa tofauti na ukubwa wa skrini, ni mazoezi bora zaidi leo.