Sa sandaling simulan mo ang paggawa ng mga webpage gamit ang HTML, magsisimula kang magtrabaho sa sizing. Upang gawing hitsura ng iyong site ang gusto mong hitsura nito, malamang na tumutugma sa isang disenyo na nilikha mo o ng ibang designer, gusto mong baguhin ang laki ng teksto sa site na iyon, pati na rin ang iba pang mga elemento sa pahina. Upang gawin ito maaari kang magsimulang maghanap ng isang HTML na "laki" na tag, ngunit mabilis mong mahanap ito nawawala.
Ang tag ng laki ng HTML ay hindi umiiral sa HTML. Sa halip, upang itakda ang laki ng iyong mga font, larawan o layout dapat mong gamitin ang Cascading Style Sheets. Sa katunayan, ang anumang pagbabago sa visual na kailangan mong gawin sa teksto ng isang site o ibang elemento ay dapat na hawakan ng CSS! Ang HTML ay para sa istraktura lamang.
Ang pinakamalapit na tag sa tag ng laki ng HTML ay ang lumang tag ng font, na kung saan ay talagang kasama ang isang sukat na katangian. Magpaalaala na ang tag na ito ay hindi na ginagamit sa mga kasalukuyang bersyon ng HTML at maaaring hindi suportado ng mga browser sa hinaharap! Hindi mo nais na gamitin ang tag ng font sa iyong HTML! Sa halip, dapat mong matutunan ang CSS upang laki ang iyong mga elemento ng HTML at estilo nang naaayon ang iyong webpage.
Laki ng Font
Ang mga font ay arguably ang pinakamadaling bagay sa laki sa CSS. Moreso kaysa sa pagsukat ng teksto, sa CSS maaari kang maging mas tiyak tungkol sa palalimbagan ng iyong website . Maaari mong tukuyin ang laki ng font, ang kulay, ang pambalot, ang timbang, ang nangungunang, at higit pa. Gamit ang tag ng font, maaari mo lamang tukuyin ang laki, at pagkatapos ay lamang bilang isang bilang na may kaugnayan sa default na laki ng font ng browser na naiiba para sa bawat customer.
Upang itakda ang iyong talata upang magkaroon ng laki ng font na 12pt, gamitin ang estilo ng estilo ng laki ng font:
h3 {font-size = 24px; }Ang estilo na ito ay magtatakda ng laki ng font ng headiing3 elemento na 24 pixels. Maaari mong idagdag ito sa isang panlabas na estilo ng sheet at ang lahat ng iyong site H3s ay gagamit ng estilo na ito.
Kung nais mong magdagdag ng karagdagang mga estilo ng pag-type sa iyong teksto, maaari mong idagdag ang mga ito sa panuntunang CSS na ito:
h3 {font-size: 24px; kulay: # 000; font-weight: normal; }Hindi lamang ito itakda ang sukat ng font para sa H3s, itatakda din nito ang kulay sa itim (na kung saan ay ang ibig sabihin ng hex code ng # 000) at itatakda nito ang timbang sa "normal". Bilang default, nag-render ang mga browser ng mga heading na 1-6 bilang naka-bold na teksto, kaya't i-override ng estilo na ito ang default at mahalagang "hindi naka-bold" ang teksto.
Laki ng Larawan
Ang mga imahe ay maaaring nakakalito upang tukuyin ang mga laki dahil maaari mong aktwal na gamitin ang browser upang baguhin ang laki ng imahe. Siyempre, ang pagbabago ng mga imahe sa browser ay isang masamang ideya dahil nagdudulot ito ng mga pahina na mag-load nang mas mabagal at ang mga browser ay kadalasang gumagawa ng mahinang trabaho ng pagbabago ng laki, na ginagawang mas masahol ang mga larawan. Sa halip, dapat mong gamitin ang software ng graphics upang baguhin ang laki ng mga imahe at pagkatapos ay isulat ang kanilang mga aktwal na laki sa iyong HTML sa Web pahina.
Hindi tulad ng mga font, maaaring gamitin ng mga imahe ang alinman sa HTML o CSS upang tukuyin ang laki. Tinutukoy mo ang lapad ng imahe at taas. Kapag gumamit ka ng HTML, maaari mo lamang tukuyin ang laki ng imahe sa pixel. Kung gumagamit ka ng CSS, maaari mong gamitin ang iba pang mga sukat kabilang ang mga pulgada, sentimetro, at mga porsyento. Ang huling halaga, porsiyento, ay kapaki-pakinabang kapag ang iyong mga imahe ay kailangang tuluy-tuloy, tulad ng sa isang tumutugon na website.
Upang tukuyin ang laki ng iyong imahe gamit ang HTML, gamitin ang taas at mga katangian ng lapad ng tag ng img. Halimbawa, ang larawang ito ay magiging 400x400 pixel square:
taas = "400" width = "400" alt = "image" />Upang tukuyin ang laki ng iyong imahe gamit ang CSS, gamitin ang mga katangian ng taas at lapad ng estilo. Narito ang parehong imahe, gamit ang CSS upang tukuyin ang laki:
style = "height: 400px; width: 400px;" alt = "larawan" />Laki ng Layout
Ang pinakakaraniwang laki na iyong tinukoy sa isang layout ay ang lapad, at ang unang bagay na kakailanganin mong magpasya ay kung gumamit ka ng isang nakapirming layout ng lapad o isang tumutugon na website. Sa madaling salita, ipapaliwanag mo ba ang lapad bilang isang eksaktong bilang ng mga pixel, pulgada, o mga puntos? O gusto mo bang itakda ang iyong lapad ng layout upang mai-flexible gamit ang em o porsyento? Upang tukuyin ang sukat ng iyong layout, gumamit ka ng lapad at taas ng mga katangian ng CSS tulad ng nais mo sa isang imahe.
Fixed width:
style = "width: 600px;">Lapad ng likido:
style = "width: 80%;">Kapag nagpasya ka sa lapad para sa iyong layout, dapat mong tandaan ang iba't ibang mga lapad ng browser na maaaring gamitin ng iyong mga mambabasa at ang iba't ibang mga device na gagamitin din nila. Ito ang dahilan kung bakit ang mga tumutugon na mga website , na maaaring baguhin ang kanilang layout at sizing batay sa iba't ibang mga aparato at laki ng screen, ay ang pinakamahusay na pamantayan ng pagsasanay ngayon.