24 converter Ma'aunai · Kuɗi · Fayiloli

Mayar da px zuwa em Pixels ↔ Em Kyauta A kan layi Amintacce

Ku rubuta ƙima a px ku karanta ta a em nan take. Lissafin yana faruwa a cikin burauzarku, ba a aika komai ko'ina ba, kuma abin da mayarwar ta dogara da shi an rubuta shi a ƙasa maimakon a ɗauka.

Ku mayar da ƙima

Daidai ne ga tushen da kuka rubuta
px
1.5 em
px

24 px = 1.5 em (16 px)

Game da wannan mai canzawa
Dabara em = px ÷ base
Abin da yake riƙewa Gwargwado, dangane da girman rubutu da ke aiki inda ake amfani da ƙimar.
Abin da ba ya iyawa Wannan shi ne wanda ya kamata a yi hankali da shi: em yana dangane da girman rubutun element ɗin da kansa — ko, ga font-size, na iyayensa — ba tushen ba. Don haka babu amsa guda ga shafi: 1.5 em ɗaya yana 24 px a cikin element 16 px da 36 px a cikin na 24 px, kuma em cikin em yana ninkawa. Lambar da ke sama daidai ce ga tushen da ke cikin filin kawai; idan kuna son lamba ɗaya da ke tabbata a ko'ina, rem ne don haka.
Inda yake aiki A burauzarku. Ba a ɗora komai ba, don haka babu abin da za a share daga baya.

Ba a ɗora komai ba

Girman da aka fi amfani da su — Mayar da px zuwa em

px em
80.5
100.625
120.75
140.875
161
181.125
201.25
241.5
322
483
644

Daga ina waɗannan ma'aunai suka fito

Pixel a CSS ba shi ne pixel a allonku ba. Lokacin da yawan pixel na allo ya daina zama abin da za a iya hasashe, shafi da aka auna da pixel na gaske ya zama shafi da yake ƙanƙancewa yayin da allo ke ƙara kaifi, don haka aka sake bayyana CSS pixel a matsayin tsawon abin tunani: kusan 1/96 na inci da ake gani a nesa mai daɗin karatu. Duk sauran abubuwan da ke wannan shafin an gina su a kai. Em ya girmi yanar gizo — a rubutun ƙarfe ya kasance faɗin tubalin da aka yi, mai suna daga babban harafin M — kuma a CSS yana nufin girman rubutu da ke aiki, shi ya sa yake canzawa yayin da kuke saka abubuwa cikin juna. An ƙara rem don guje wa daidai wannan: shi ne em na tushen element kuma ba ya taruwa. Vw ya zo da zanen shafi mai daidaitawa (responsive design): kashi ɗaya cikin ɗari na faɗin viewport, komai ya zama.

Inda kuke haɗuwa da su

Waɗannan su ne ma'aunan kowane stylesheet. Pixels suna ba da girman iyaka, inuwa da duk abin da bai kamata ya canza girma ba; rem yana ba da girman rubutu, tazara da tsari, domin sauyi ɗaya a tushe ya sake girman duk mahaɗa; em yana ba da girman abubuwan da ya kamata su bi rubutunsu, kamar padding ɗin cikin maɓalli; vw yana ba da girman kanun labarai da sassan hero da dole su cika allo a kowace na'ura. Juyawa tsakaninsu shi ne lissafin yau da kullum na mayar da zane da aka ba da shi da pixel zuwa stylesheet da ke daidaita girma.

Tambayoyin da mutane ke yi

Me ya sa 16 px ne wurin farawa na kullum?

Domin shi ne girman rubutu na asali a kowane babban browser, kuma stylesheet da bai soke shi ba yana gadonsa. Rem ɗaya saboda haka daidai yake da 16 px a saitin asali, wanda shi ne asalin juyawar da aka saba da ita: 0.5 rem shi ne 8 px, 1.5 rem shi ne 24 px. Idan mai amfani ya ƙara girman asali a saitunan browser ɗinsa, waɗannan ƙimar rem ɗin suna girma tare da shi — wanda shi ne ainihin manufar amfani da su.

Rem zan yi amfani da shi ko em?

Rem ga duk abin da ya kamata ya bi shafi gaba ɗaya — ma'aunin rubutu, tazara, faɗin tsari — domin ana aunawa daga tushe kuma ba ya taruwa. Em ga duk abin da ya kamata ya bi rubutun da yake ciki: padding na maɓalli, tazara kusa da icon, shigar sakin layi na ambato. Kuskuren da aka fi yi shi ne saka abubuwa masu girman em cikin juna, inda 1.2 em a cikin 1.2 em ya zama 1.44, sannan 1.73, har rubutun ƙasan shafin ya ninka girman da aka nufa.

Shin amsar daidai ce?

Inda aka ayyana ma'aunai biyun ta hanyar juna da cikakkun lambobi, i — shafin yana faɗin haka a saman lambar, kuma zagaye kawai shi ne yawan lambobin da ake nunawa. Inda rabon ba shi da lambar goma mai ƙarewa, shafin yana nuna muhimman lambobi goma sha biyu kuma yana cewa alaƙar kintace ce maimakon ya yi kamar ba haka ba ne.

Shin wani abu da na rubuta yana barin na'urata?

A'a. Ana yin lissafin a cikin burauzarku; ba a ɗora komai ba, kuma babu uwar garke da za a ɗora zuwa gare ta. Ku buɗe shafin sau ɗaya zai ci gaba da aiki ko da an kashe hanyar sadarwa.

Dalilin da ya sa ake canza px zuwa em

Em ita ce tsohuwar naúrar da ke dangantaka a CSS kuma ita ce ke jawo mafi yawan muhawara. Kana da girma da pixel daga fayil ɗin ƙira, padding na 20 px a kan maɓalli, tazara ta 14 px kusa da alama, 36 px don taken labari, kuma kana son su a cikin em, don su bi rubutun da suke na shi. Idan ka canza px zuwa em kana yin wata tambaya ta musamman: sau nawa ne wannan na girman rubutu da ke aiki yanzu? Amsar ta dogara ne da lambar da shafi ba zai iya hasaso ba, wato girman rubutu da ke aiki a wurin da ake amfani da ƙimar, don haka mai canzawa yana sanya wannan lamba a cikin fili kuma yana amfani da ita a fili.

Dalilin rubuta girma da em shi ne abubuwan da suke na rubutu su yi girma tare da rubutun. Padding da ke cikin maɓalli ya kamata ya fi girma idan lakabin maɓallin ya fi girma. Tazarar da ke tsakanin alama da bayaninta ya kamata ta faɗaɗa idan bayanin ya faɗaɗa. Margin na ƙasan taken labari ya kamata ya kasance daidai da taken. A duk waɗannan lokuta ƙimar pixel ba daidai ba ce da zarar girman rubutu ya canza, amma ƙimar em daidai ce a kowane girma. Wannan shi ne cikakken dalilin amfani da em, kuma dalili ne mai ƙarfi.

Lissafin yana gudana a cikin burauzarka kuma ba a loda komai ba. A ƙasa za ka sami dabarar lissafi, dalilin da ya sa em yake buƙatar kulawa fiye da rem, tarkon ɗaiɗaice da ke haifar da girma masu ban mamaki, wuraren da em ita ce naúrar da ta dace, da hanyar zaɓi tsakanin em da rem a cikin takardar salo ta gaske.

Dabarar lissafi da tushe

em daidai yake da px a raba da girman rubutu

Dabarar ita ce rabawa guda ɗaya: em = px ÷ base. Idan tushe 16 px ne, ƙimar 24 px ta zama 1.5 em, 8 px ya zama 0.5 em kuma 20 px ya zama 1.25 em. Shafin yana nuna tushen kusa da sakamakon, kamar 24 px = 1.5 em (16 px), don ka ga abin da aka ɗauka. Lissafin iri ɗaya ne da na rem. Ma'anar ce ta bambanta.

Menene tushe

A rem, tushe shi ne girman rubutu na ɓangaren tushe. A em, shi ne girman rubutu na ɓangaren da ake amfani da ƙimar a cikinsa, ko, ga kadarar font-size kanta, na iyayen. Shi ya sa em ba ta da amsa ɗaya: ƙima ɗaya a cikin takardar salo tana nufin girman pixel daban-daban a wurare daban-daban. Idan kana canza padding na maɓalli wanda rubutunsa 14 px ne, rubuta 14 a matsayin tushe. Idan kana canza margin na taken labari na 32 px, rubuta 32.

Abin da za a yi idan ba ka sani ba

Idan kawai kana son lamba ta kimantawa, bar tushe a 16, wato girman rubutu na yau da kullum a burauza da babu wanda ya canza. Sakamakon daidai ne ga toshen rubutun jiki na yau da kullum, kuma yana ba ka fahimtar gwargwado ko da ɓangaren ya zama yana da girma daban.

Abin da canzawar ke riƙewa da abin da ba ta iya

Tana riƙe da gwargwado ga rubutu

Sakamakon shi ne gwargwado dangane da girman rubutu da ke aiki a wurin da ake amfani da ƙimar. Idan an rubuta shi da em, sarari yana girma yana ƙanƙancewa tare da rubutun da ke kusa da shi, kuma daidai haka ya kamata tazara a kewayen kalmomi ta yi.

Ba za ta iya ba ka lamba ɗaya ga shafin ba

Wannan shi ne wanda ya kamata a yi hankali da shi. Em tana dangantaka da girman rubutu na ɓangaren kansa, ko, ga font-size, na iyayensa, ba tushe ba. Don haka babu amsa ɗaya ga shafi: 1.5 em ɗaya yana zama 24 px a cikin ɓangare na 16 px da 36 px a cikin na 24 px, kuma em a cikin em yana ninkawa. Lambar da ke kan shafin daidai ce ga tushen da ke cikin filin kuma ba ga wani abu daban ba. Idan kana son lamba ɗaya da ke aiki a ko'ina, wannan shi ne abin da rem ke yi. Don kwatantawa, canza px zuwa rem ka ga yadda ƙimar pixel ɗaya take.

Zagayawa

Rabawa da 16 yana ba da ƙima mai tsabta ga girma da yawa kuma ƙananan adadi masu maimaituwa ga wasu. Ƙima kamar 0.8125 em ba laifi ba ce a cikin takardar salo, amma za ka iya fi son zagaya zuwa 0.8 ko 0.85 idan ainihin girman ba shi da muhimmanci. Ka riƙe cikakkiyar lamba inda daidaito yake da muhimmanci.

Tarkon ɗaiɗaice

Yadda em ke ninkawa

Ka ɗauka jeri yana da font-size: 0.875em kuma abubuwan da ke cikinsa ma suna da font-size: 0.875em. Jerin shi ne 87.5% na iyayensa. Kowane abu shi ne 87.5% na jerin, wato kusan 76.6% na iyayen. Jeri da ke cikin wani abu yana sake ƙanƙancewa, zuwa kusan 67%. Bayan matakai uku rubutun ya zama ƙarami sosai, kuma babu wanda ya rubuta hakan da gangan. Wannan shi ne abin da ake nufi idan aka ce em tana ninkawa.

Dalilin da ya sa yake da muhimmanci idan ka canza px zuwa em

Idan ka canza ƙimar pixel zuwa em don font-size, tushen da dole ne ka yi amfani da shi shi ne girman rubutu na iyayen, ba na ɓangaren kansa ba. Kuskure da yawa suna fitowa daga amfani da wanda bai dace ba. Ga wasu kadarori, kamar padding da margin, tushe shi ne girman rubutu na ɓangaren kansa. Ƙa'idar mai sauƙin faɗi ce kuma mai sauƙin mantawa: font-size yana duba sama, kowane abu daban yana duba kansa.

Yadda za a guji abubuwan mamaki

Yi amfani da em don tazara da ke bin rubutu, da rem don girman rubutu. Ta haka girman rubutu ba sa ninkawa, domin suna nuni zuwa tushe, kuma tazara tana bin rubutunta. Wannan haɗin ne yawancin takardun salo na zamani ke zaɓa.

Girma da aka fi amfani da su

Tebur a ƙasan shafin

A ƙarƙashin mai canzawa akwai tebur na girma da aka fi amfani da su a tushen da ka saita: 8 px shi ne 0.5 em, 10 px shi ne 0.625, 12 px shi ne 0.75, 14 px shi ne 0.875, 16 px shi ne 1, 18 px shi ne 1.125, 20 px shi ne 1.25, 24 px shi ne 1.5, 32 px shi ne 2, 48 px shi ne 3 kuma 64 px shi ne 4. A tushe na 16, waɗannan lambobin iri ɗaya ne da na rem, shi ya sa mutane ke rikita biyun. Bambancin yana cikin abin da 16 yake wakilta.

Canza tushe don ya dace da ɓangaren

Idan ka saita tushe zuwa 14 don ƙaramin maɓalli, teburin yana canzawa: 14 px yanzu shi ne 1 em, 7 px shi ne 0.5 em kuma 21 px shi ne 1.5 em. Gwada, za ka ga yadda padding na 1.5 em yake da girman pixel daban a cikin maɓalli na 14 px fiye da na 18 px, da kuma dalilin da ya sa hakan yake da amfani.

Yadda ake canza px zuwa em a nan

Rubuta ƙimar pixel

Shigar da girman da pixel a cikin filin farko. Ana karɓar ƙananan adadi.

Saita girman rubutu da em ɗin yake nuni zuwa gare shi

Rubuta girman rubutu na ɓangaren, ko na iyayensa idan kana canza font-size. Idan ba ka da tabbas, bar 16 ka ɗauki sakamakon a matsayin kimantawa.

Kwafe ƙimar em

Yi amfani da lambar a cikin CSS ɗinka tare da naúrarta, kamar padding: 1.25em. Lamba ba tare da naúra ba ba ta da inganci ga yawancin kadarori.

Daga ina waɗannan naúrori suka fito

Em a cikin harufan ƙarfe

Em ta girmi yanar gizo. A cikin harufan ƙarfe ita ce faɗin toshen da aka jefa, mai suna bayan babban harafin M, kuma ita ce naúrar sarari ta kwance ta halitta a layin da aka buga. Masu zane-zanen haruffa har yanzu suna magana game da em dash da em space. A CSS tunanin yana nan a siffa mafi sassauci: em ɗaya shi ne girman font ɗin da ke aiki.

Pixel da rem

Pixel na CSS tsayi ne na tunani na kusan 1/96 na inci da ake gani daga nisan karatu mai daɗi, ba digo a kan allonka ba. An ƙara rem don ba masu ƙirƙirar shirye-shirye naúrar da ke dangantaka amma ba ta ninkawa: ita ce em ta ɓangaren tushe. Tsakaninsu, pixel, em da rem suna rufe buƙatu uku: girma tsayayye, girma dangane da rubutu, da girma dangane da shafi.

Inda em ita ce zaɓi mai kyau

Padding a cikin maɓalli da filayen fom

Maɓalli mai padding: 0.5em 1em yana kama da gwargwado ɗaya a kowane girman rubutu. Ka sa lakabin ya fi girma kuma maɓallin duka yana girma tare da shi, wanda shi ne abin da kake so daga sashen da za a iya amfani da shi a mashigar kayan aiki da kuma a babban banner.

Tazara kusa da alamomi

Alama da bayani bayanta suna buƙatar tazara da ke girma tare da bayanin. Margin na 0.4em yana yin haka; margin na 6px ba ya yi.

Margin a kewayen taken labari da sakin layi

Ana samun sauƙin kiyaye ƙwaƙƙwafin tsaye a cikin takarda idan tazarar sakin layi tana cikin em, domin tana bin girman sakin layin. Margin na taken labari a cikin em yana kasancewa daidai da taken yayin da taken ke canza girma a wuraren karyewa daban-daban.

Media queries

Wuraren karyewa da aka rubuta da em suna amsa girman rubutun mai karatu, don haka tsarin shafi yana komawa siffarsa ta kunkuntar da wuri ga wanda ya faɗaɗa rubutunsa. A cikin media queries, em tana nuni zuwa tsohuwar saitin burauza ba wani ɓangare ba, don haka ba ta ninkawa.

Tarko lokacin da kake canza px zuwa em

Amfani da tushen da bai dace ba

Kuskuren da aka fi yi. Ga font-size, yi amfani da girman iyayen; ga duk sauran kadarori, na ɓangaren kansa. Duba kadarar da kake canzawa kafin ka rubuta tushen.

Mantawa cewa iyayen ma na iya zama a cikin em

Idan girman rubutu na iyayen shi kansa yana cikin em, dole ne ka bi jerin zuwa sama don sanin ainihin girman. Lokacin da takardar salo ta yi rikitarwa, canza girman rubutu zuwa rem ka bar em don tazara.

Tsammanin lamba ɗaya ga duka sashe

Sashen da ke ɗauke da rubutu na girma daban-daban ba shi da ƙimar em ɗaya ga sassansa. Canza kowane sashi da tushensa.

Haɗa em da rem ga kadara ɗaya

Padding na 1rem kusa da margin na 1em halal ne kuma sau da yawa yana rikitarwa. Zaɓi ƙa'ida, kamar rem don girman rubutu da em don tazara, ka riƙe ta.

Tambayoyin da mutane ke yi kafin su canza

Em nawa ne 16 px?

Ɗaya, idan girman rubutu da ke aiki 16 px ne. Idan girman rubutu na ɓangaren 20 px ne, to 16 px shi ne 0.8 em.

Shin em ta fi rem?

Babu wadda ta fi. Rem ta fi dacewa ga girman rubutu da tsarin shafi na gaba ɗaya. Em ta fi dacewa ga tazara da ya kamata ta bi rubutunta.

Me ya sa padding ɗina ya fi yadda ake tsammani girma?

Domin yana dangantaka da girman rubutu na ɓangaren, wanda zai iya zama ya fi yadda ka ɗauka. Duba girman rubutu da aka ƙididdiga a cikin kayan aikin masu ƙirƙirar shirye-shirye na burauza.

Zan iya amfani da ƙananan adadi?

Eh. Ƙima kamar 0.625em da 1.333em na yau da kullum ne.

Ana loda lambata?

A'a. Lissafin yana gudana a cikin burauzarka kuma ba a aika komai ko'ina ba.

Ta yaya zan koma baya?

Da em zuwa px, wanda ke ninkawa maimakon rabawa.

Zaɓi cikin hikima lokacin da kake canza px zuwa em

Yanke shawarar abin da ƙimar take na shi

Idan na rubutu ne, em ta dace. Idan na shafi ne, kamar faɗin ginshiƙi ko tazarar sashe, rem ko naúrar viewport ta fi dacewa. Px zuwa vw yana bayyana girma a matsayin rabon faɗin allo.

Rubuta manufa a cikin sharhi

Layi kamar padding: 0.75em 1.25em; /* 12px 20px at 16px */ yana sa dalilin ya bayyana. Lokacin da girman rubutu ya canza daga baya, za ka san abin da lambobin ke nufi.

Ajiye girman rubutu na sashe a wuri ɗaya

Saita girman rubutu a ɓangaren tushen sashen ka bar duk abin da ke ciki ya yi nuni zuwa gare shi. Sai ƙimar em da ke ciki su zama iri ɗaya a ko'ina cikin sashen, kuma za ka iya canza px zuwa em da tushe ɗaya.

Kyawawan al'adu lokacin da kake canza px zuwa em

Canza px zuwa em sashe ɗaya a lokaci guda

Kada ka yi ƙoƙarin canza px zuwa em ga takardar salo gaba ɗaya a lokaci guda. Ɗauki sashe ɗaya, kamar kati ko maɓalli, ka yanke shawarar girman rubutunsa, ka canza kowace ƙimar tazararsa da wannan girman. Idan sashen ya gama, gwada shi da girman rubutu biyu ko uku. Sannan ka ci gaba zuwa na gaba.

Yi amfani da kalkuleta don ƙimar da ba ta zagaye ba, ba masu zagaye ba

Ƙima kamar pixel 8, 16 da 24 suna komawa lambobin em masu tsabta a tushe na 16. Ƙima marasa daidaito kamar 22 ko 13 suna ba da dogayen ƙananan adadi. Lokacin da ka canza px zuwa em ga waɗannan, yanke shawara ko ƙirar tana buƙatar ainihin lambar ko ƙimar em mafi kusa mai zagaye za ta yi kyau daidai. Masu zane sau da yawa suna farin cikin zagayawa, kuma takardar salo mai tsabta ta fi sauƙin kulawa.

Ajiye bayanin tushe

Gajeren sharhi kusa da kowace ƙimar em, yana cewa menene tushe, yana taimaka wa mutum na gaba. Idan wani ya canza girman rubutu na sashen daga baya, zai san cewa tazarar tana bin sa da gangan ba kwatsam ba. Rubuta hakan sau ɗaya ya cancanci lokacin da yake ɗauka.

Kwatanta da daidai na rem

Idan ba ka da tabbas ko em ko rem ce ta dace da ƙima, canza px zuwa em da rem ka tambayi abin da ya kamata ya faru idan girman rubutu ya canza. Idan ƙimar ya kamata ta bi rubutun ɓangaren kansa, ɗauki em. Idan ya kamata ta bi shafin, ɗauki rem.

Masu canzawa masu alaƙa

Iyali ɗaya na kayan aiki yana rufe canzawa maƙwabta. Don komawa zuwa pixel, yi amfani da em zuwa px. Ga girma masu dangantaka da tushe, akwai px zuwa rem da rem zuwa px, kuma ga girma masu dangantaka da allo, px zuwa vw da vw zuwa px. Ga launuka na takardar salo ɗaya, HEX zuwa RGB da HEX zuwa HSL suna sarrafa rubuce-rubucen.

Misali da aka yi aiki da shi

Ka ɗauka lakabin maɓalli 14 px ne kuma ƙirar ta ba maɓallin padding na 10 px a tsaye da 20 px a kwance. Ka rubuta 14 a matsayin tushe, 10 ka karanta 0.714 em, ka rubuta 20 ka karanta 1.429 em. A cikin takardar salo ka rubuta padding: 0.714em 1.429em. Lokacin da aka yi amfani da maɓalli ɗaya a cikin babban banner mai lakabi na 18 px, padding ya zama 12.9 px da 25.7 px, daidai gwargwado. Da ka rubuta 10px da 20px, maɓallin zai yi kama da siriri a kewayen rubutu mafi girma.

Ɗan jerin dubawa

Kafin canzawa

Yanke shawarar kadarar da ƙimar take na ta, ka nemo girman rubutu da ya kamata ta dangana da shi.

Yayin canzawa

Rubuta ƙimar pixel da tushe daidai, ka kwafi lambar em tare da naúrarta.

Bayan canzawa

Canza girman rubutu na sashen a burauza ka duba cewa tazarar tana bi. Nemi ƙimar em masu ɗaiɗaice da ke ninkawa.

Kura-kurai na gama gari

Amfani da girman tushe a matsayin tushe na padding

Wannan aikin rem ne. Em tana nuni zuwa girman rubutu na ɓangaren kansa.

Amfani da em ga kowane girman rubutu

Girman rubutu na em masu ɗaiɗaice suna ninkawa kuma suna ba ka mamaki. Yi amfani da rem don girman rubutu.

Zagayawa zuwa lamba mai kyau a gani amma ba daidai ba

1.43 ba daidai yake da 1.5 ba idan aka ninka da babban font. Ka riƙe isassun lambobi.

Lambobinka suna nan a na'urarka

Lissafin yana faruwa a cikin na'urarka. Burauzarka ce ke amfani da ƙimarka kuma ba a aika komai ko'ina ba. Babu abin da za a share daga baya kuma babu asusu da za a ƙirƙira. Wannan ita ce hanya mai sauƙi ta canza px zuwa em.

Taƙaitawa

Don canza px zuwa em a nan, rubuta girman da pixel da girman rubutu da yake dangantaka da shi, ka karanta sakamakon nan take, ta amfani da dabarar em = px ÷ base. Canzawar tana riƙe da gwargwado dangane da girman rubutu da ke aiki a wurin da ake amfani da ƙimar. Ba za ta iya ba da amsa ɗaya ga shafi ba: em tana dangantaka da girman rubutu na ɓangaren kansa, ko na iyayen ga font-size, don haka 1.5 em ɗaya yana zama 24 px a cikin ɓangare na 16 px da 36 px a cikin na 24 px, kuma em a cikin em yana ninkawa. Don lamba ɗaya da ke aiki a ko'ina, yi amfani da rem. Ba a loda komai ba.

Tsayi da fili Nauyi da girman sarari Zafi Kuɗi