Funso lofunsidwa kawirikawiri pa webusaitiyi ndi "Kodi mumayika bwanji kutalika kwa chinthu choyenera ku 100%"?
Izi zingawoneke ngati yankho losavuta. Mukungogwiritsa ntchito CSS kukhazikitsa kutalika kwa chinthu cha 100%, koma izi sizikutanthauza nthawi zonse kuti zigwirizane ndi zenera zonse. Tiyeni tipeze chifukwa chake izi zikuchitika ndi zomwe mungachite kuti mukwaniritse zojambulazo.
Ma Pixel ndi Peresenti
Mukafotokozera kutalika kwa chinthucho pogwiritsira ntchito CSS katundu ndi mtengo umene umagwiritsa ntchito pixelesi, gawolo lidzatenga malo ochuluka kwambiri mu msakatuli.
Mwachitsanzo, ndime ndi kutalika: 100px; idzatenga mapikisilosi 100 a malo owonekera mumapangidwe anu. Ziribe kanthu momwe msakatuli wanu wamasewera ali wamkulu, chigawo ichi chidzakhala ma pixel 100 mu msinkhu.
Miyeso amagwira ntchito mosiyana kuposa ma pixel. Malinga ndi mafotokozedwe a W3C, kutalika kwaperesenti kumawerengedwa polemekeza kutalika kwa chidebecho. Kotero ngati muyika ndime ndi kutalika: 50%; mkati mwa div ndi kutalika kwa 100px, ndimeyi idzakhala mapikseli 50 mu msinkhu, zomwe ndi 50% zazolowera za kholo.
Chifukwa Chiyani Maperesenti Amalephera
Ngati mukupanga tsamba lamasamba, ndipo muli ndi ndondomeko yomwe mungakonde kukwera pawindo, chizoloŵezi chachilengedwe ndi kuwonjezera kutalika: 100%; ku gawo limenelo. Pambuyo pa zonse, ngati muika m'lifupi m'lifupi: 100%; gawoli lidzatenga malo osasunthika a tsamba, kotero kutalika kuyenera kugwira chimodzimodzi, molondola? Tsoka ilo, izi siziri choncho.
Kuti mumvetse chifukwa chake izi zikuchitika, muyenera kumvetsetsa momwe asakatuli amamasulira kutalika ndi m'lifupi. Masakatuli a intaneti amawerengera chiwerengero chonse chopezekapo monga momwe mawindo osatsegula amatsegulira. Ngati simukuyika malingaliro amtundu uliwonse pamabuku anu, osatsegulayo adzangoyendetsa zokhazokha kuti adzaze lonse lonse lawindo (100% width ndi osasintha).
Kulemera kwamtengo kumawerengeka mosiyana ndi kukula. Ndipotu, osatsegula samapenda kutalika konse pokhapokha zomwe zilipo nthawi yaitali kuti zimatuluka kunja kwa chithunzi (chomwechi chimafuna mipiringidzo) kapena ngati webusaitiyo akukhazikitsa kutalika kwa chinthu chomwe chili patsamba. Kupanda kutero, osatsegula amangolola zomwe zili m'munsi mkati mwawonetsero kufikira zitatha. Kutalika sikuneneretsedwe konse.
Mavuto amabwera pamene iwe uika kutalika kwa peresenti pa chinthu chomwe chiri ndi zinthu za kholo popanda zopanda kuika - mwazinthu zina, zinthu za makolo ziri ndi kutalika kwake: auto; . Inu muli, kwenikweni, kupempha osatsegulayo kuti awerengetse kutalika kwa mtengo wosadziwika. Popeza kuti zingakhale zofanana ndi mtengo wopanda pake, zotsatira zake ndi kuti osatsegula alibe kanthu.
Ngati mukufuna kukhazikitsa kutalika kwa masamba anu pa intaneti, muyenera kukhazikitsa kutalika kwa chinthu chilichonse cha kholo chomwe mukufuna kuti kutalika kwanu kukufotokozedwe. Mwa kuyankhula kwina, ngati muli ndi tsamba monga ili:
Zokhudzana pano
Mwinamwake mukufuna div ndi ndime yomwe ili mmenemo kukhala ndi 100% msinkhu, koma div imeneyo kwenikweni ili ndi zinthu ziwiri za makolo:
ndi. Pofuna kufotokozera kutalika kwa div kuti mufike kutalika, muyenera kuika kutalika kwa thupi ndi zinthu zina.
Kotero mufunikira kugwiritsa ntchito CSS kuti muike kutalika kwa div, koma komanso thupi ndi html. Izi zingakhale zovuta, chifukwa mukhoza kuthamanga kwambiri ndi zonse zomwe zakhala zikukwera kwa 100%, kuti mukwaniritse zotsatirazi.
Zina Zofunika Kuzindikira Pamene mukugwira ntchito ndi 100% Mapiri
Tsopano kuti mukudziwa momwe mungakhazikitsire kutalika kwa zinthu zanu pa tsamba 100%, zingakhale zosangalatsa kutuluka ndikuchita izo kumasamba anu onse, koma pali zinthu zingapo zomwe muyenera kuzidziwa:
- Mazenera ndi padding akhoza kuwonjezera kapukutu kamphindi komwe simukufuna. Chimodzi mwa zinthu zowopsya kwambiri zomwe ndapeza ndi kugwira ntchito ndizitali (ndi widths) ndizomwe padding ndi m'mitsinje pazinthu zomwezo zingathe kuwonjezera mipiringidzo pa tsamba, ngakhale zilizonse zikuwonetsa popanda kusowa mipukutu. Ichi ndi chifukwa kutalika kapena kupatulira kwa chinthucho ndi chinthu choyamba chomwe chiwerengedwa. Ndiye m'mphepete mwazitali ndi paddings akuwonjezeredwa. Kotero ngati muli ndi chinthu chokhala ndi kutalika kwa 100% ndi m'munsimu ndi pansi pansi pa pixel 10 iliyonse, padzakhala mpukutu wa mpukutu wa pixels 20. Kumbukirani, CSS bokosi lachitsanzo limapanga malire, malire, ndi padding pa kukula kwa chinthucho, choncho 100% ndi zina mwazimenezo zimakhala zoposa 100%.
- Ngati zokhazo zimatenga zambiri kuposa zomwe zimatanthauzidwa kutalika, izo zidzalemba chirichonse pambuyo pake. Mwa kuyankhula kwina, ngati muli ndi mapangidwe omwe ali ndi 80% m'litali, ndipo zomwe zili mkati mwake zidzatenga kutalika kwa 100%, kuti 20% apitirize kupitirira pansi pa chithunzicho wa tsamba lanu. Ngati pali zokhudzana ndizomwe zili pansipa, ndimeyi ikanalembera pamwamba pake. Nthawi zambiri ndimawona izi zikuchitika pamene webusaitiyo amayesa kukakamiza kutalika kwa tsamba ndikuyamba kugwira ntchito mwakhama kuti atsegulidwe, koma ngati zomwe zili patsambali zikusintha mtsogolomu, zovuta zawo zonse zimathetseratu kutuluka kwa tsamba. Izi ndizowonadi pamene mukukumanga mawebusaiti awo omwe maulendo awo ndi msinkhu wawo ayenera kusintha ndi kukula kwazithunzi.
Kuti mukonze izi, mukhoza kukhazikitsa kutalika kwa chinthucho. Ngati mwaiyika pamoto, mipukutu idzawoneka ngati ikufunika koma idzawonongeka ngati ilibe. Izi zimapangitsa kuti pulogalamuyo iwonongeke, koma imapanga scrollbars komwe simungafune.
Mukugwiritsa Ntchito Zogulitsa Zojambula
Njira inanso yomwe mungathetsere vutoli ndi kuyesa Zogwirizira za CSS. Pogwiritsa ntchito unit height measurement of measurement, mukhoza kukula zinthu kuti mutenge kutalika kwa kasitomala, ndipo izi zidzasintha ngati kasitomala akusintha! Imeneyi ndi njira yabwino kwambiri yowonjezeretsa 100% yanu pazithunzi koma imakhalabe yosinthika kwa zipangizo zosiyanasiyana ndi kukula kwake.