Dizanin ka çiqas gerokên web-ê bi karanîna nirxên%
Gelek xwendekarên ku paqijkirina malpera nermalavê bi nirxên rêjîmê re bi kar tengas e. Bi taybetî, hingî ye ku bi geroka wan bi sedî wan hejmare dike. Li jêr hûn ê ravekirina berfirehtirîn ku ji sedemên ku ji bo malpera berpirsyariya çarçoveya karanîna kar dikin çi bibînin.
Ji bo Pîvana Bûyera Pixel Bikaranîna
Dema ku hûn peldankek wek çarçoveya çarçoveyê bikar bînin, encamên pir zelal in. Heke hûn bikarhênerên CSS-ê bikaribin ji hêla hêla pelê ya 100-pîrek pîrek, hêja wê heman rengê be, wekî ku hûn li ser malpera an naveroka malperê ya malpera 100 pîrek pîrek dabeşînin. rûpel. Pencilên wateya yekgirtî ye, da ku hûn 100 pencil 100 pîlan in. Bêguman, nirxên pixel hêsanî ku fêm dikin, ew malperên bersivên baş ên baş dixebite.
Ethan Marcotte peyva "sêwirmendiya mimûne malper" tête dan, ev nêzîkî nîqaşkirina ku rêgezên sereke yên sereke hene:
- Gridek a fluid
- Çapemeniya flûk
- Pirsên medyayê
Ew du du xalên pêşîn, çapemeniyek mîkrob û mûzîdê, ji hêla nirxên sizingê ve, ji hêla pîvanên bi kar tînin, têne kirin.
Ji sedî ji bo Nirxên bihayên bihêztirîn
Dema ku hûn ji sedî bikar bînin ku çarçoveya ji hêla elementek ava bikin, hejmara rastîn ku elementa wê nîşan dide dê dê li gorî ku li belgeyê de cihê cuda ye. Ji sedî pirtûka nirxên hevpeyman in, wateya ku nimûne nimûne we bi dokumentên din ên din re ye.
Ji bo nimûne, eger hûn çarçoveya wêneyê 50% bikin, wateya ku wêneyê wê di nîvê normalê normal ya normal de nîşan bide. Ev xeletiyek hevpar e.
Heke wêne natively 600 pixel wide, hingê wê wateya CSS-ê bikar bînin ku li% 50 nîşan bide, wateya ku ew di gerokera webê de 300 pixel wide. Nirxê vê sedî ya bingehîn li ser bingeha ku wêne ye, ne nirxa nirxa xwe ya wêneyê. Heke konserer (ku dibe ku parçeyek an jî hinek HTML-elementê be) dibe 1000 pencilên mezin e, wê wêneyê dê 500 pencilan nîşan bidin, ji ber ku ev nirxê 50% qutiyeke qonax e. Heke hebê elementek 400 pîrek pile ye, wê wêneyê wê tenê 200 pîkselan nîşan bide, ji ber ku ew nirxê 50% qutiyeke ye. Di vê pirsê de li vir pirsa 50% pîvana ku bi temamî li elementê ye ku ew e.
Bîr bînin, sêwirîna bersivê şewitandin. Pêvek û sîgortan wekî guhertinê / peldanka paceyê biguherînin . Heke hûn li ser fikrên fîzîkî, nîqaşên ne-web difikirînin, ew e ku wekî qutiyeke kartê ye ku hûn bi materyalê pakkirinê ne. Heke hûn dibêjin ku qonaxê wê bi materyalê tije ye, hejmarê ku hûn hewceyê hewceyê hewceyê wê di çarçoveya kûpê de cûda dike. Bi heman rengî ji sedî pîvanên di designê malperê de rast e.
Li gorî Percentages Li ser%
Di nimûne wêneyê / kantonê de, min ji bo hêmanên pixel bikar anîn ku nîşan bide ka wêneyê bersiv çawa bide. Di rastiyê de, hêmanek pêkhatî jî dê sedî û wêneyê, an jî elementên din veguherin, di nav de konserer wê nirxên wan bi sedî sedî perçeyek bingehîn.
Li vir nimûneyeke din e ku ev di pratîkê nîşan dide.
Ji we re malpera we heye ku malpera tevahiya malperê di parzimanî de çîna kategoriya "konser" ((pratîka sêwirmend a hevpar). Di hundirê sêyemîn de parçeyek sê parçeyek in, ku hûn ê di dawiyê de werin xuya bikin ku wek sê-bertên vertical. Ew HTML dikare vî rengî bibînin:
Niha, hûn dikarin CSS bikar bînin ku hebûna sîteya "konserek" dabeş bikin ku ji 90% re dibêjin. Di vê nimûneyê de, parçeya konseya qutiyeke din tune ye ku ji bilî bedena din, wê ku me ne diyariyek taybet e. Bi rêkûpêk, bedenê wekî paceya sêwirînerê% 100 ê pêşkêş dike. Ji ber vê yekê, ji sedî beşa dabeşkirina "konserek" dê di çarçoveya paceya gerdûnê de bête kirin. Wekî ku ew paceyê paceyê di pîvana guhertinê de guhertin, wusa wê mezinbûna vê "konser". Ji ber ku eger paceya sêwirdar 2000 pile-pîrek pile ye, ev dabeş dê di 1800 pencilan de berbi. Ew ji sedî 90-sed 2000 (2000 x .90 = 1800)), ku mezinahiya gerokê ye.
Heke her yek parçeyên "col" di hundirê "konserer" de têne damezrandin 30-ê% sî, paşê her yek wê di mînakê de 540 pixel wide. Ew wekî% 30 ya 1800 pencilan tête hesab kirin ku qutiyeke xerîb li (1800 x .30 = 540) render dike. Heke ji sedî kantonê veguherîn,, parçeyên van hundir jî di nav sîteyê de ji wan re veguherînin wê ji ber ku ew girêdayî elementek in.
Bila bawer bikin ku paceyên gerokê 2000 pîrek pencre dimîne, lê em ji hêla 90% ji hêla% 80 re% nîrek nirxê nirxê ye. Ev tê wateyê ku ew dê li 1600 pencilên dirêjtir (1200 x .80 = 1600) pêşkêş bikin. Heke ku em ji bo dabeşên 3 "col" de, ji bo CD-ê veguherîna CSS-ê biguherînin û ji wan 30% ji wan veguherînin, ew dê ji hêla elementên ku ew hêsantir e ku bi sîteyê têne guhertin, cûda wê cûda bidin. Her sê parçeyên niha dê wek 480 pixel xuyan pêşkêş dikin, ku ji sedî 30% 1600, an qonaxa qonaxa (1600 x .30 = 480).
Heke ev wêne yek ji van dabeşên "col" de hebû û ev wêneyê bi% anî bikar tîne, heya wê ji bo sizingê wê dê "col" bibe. Wekî ku "col" dabeş di mezinbûnê de guhertin, hingê wêneyê wê di hundurê de. Ji ber vê yekê eger hejmarê gerokê an jî "konser" guhertin, dê dê parçeyên sê "col", bandor bike ku dê di rûyê wêneyê de bi "col.". Ew ji hêla nirxên sizing-ê ve girêdayî ye.
Dema ku hûn di bifikirin ka elementek hundurê malperê dê dema ku nirxa nirxa wê ji çarçoveya wê re tê bikaranîn, dê hewce dike ku hûn li ser vê çarçoveya têgihîştina têgihîştinê, ku ew element di çarçoveya pîvanê de dimîne.
Di naveroka
Ji sedemên ku di navnîşan de ji bo malperên bersivên çêbikin . Heke hûn wêneyên sizing sembolî an jî bi sedî% anî bikar bînin ku ji rastiya gêlê bi rastî rastî kîjan sîgortên hev re bi hev re ne, ew têgihîştin ku ev hesabên ku hûn dixwazin dixwazin.