የpx ወደ rem እና em መቀየሪያ

የራስዎን root እና አውድ የጽሑፍ መጠኖች በመጠቀም በpx, rem እና em መካከል ይቀይሩ — ማንኛውንም ሳጥን ሲያስተካክሉ ሌሎቹ ሁለቱ ሲጽፉ ይዘመናሉ።

እሴቶች
የpx, rem ወይም em እሴት ያስገቡ — ሲጽፉ ሌሎቹ ሁለቱ ወዲያውኑ ይዘመናሉ።

እያንዳንዱ ልወጣ የሚከናወነው በብሮውዘርዎ ላይ ነው። የሚጽፉት ማንኛውም ነገር ወደ BroBroGo አይሰቀልም።

በተደጋጋሚ የሚነሱ ጥያቄዎች

በpx, rem እና em መካከል ያለው ልዩነት ምንድን ነው?

px ቋሚ ርዝመት ነው። rem የሚለካው ከገጹ root የጽሑፍ መጠን አንጻር ነው፣ ስለዚህ በ16px root ላይ 1rem ከ16px ጋር እኩል ይሆናል። em የሚለካው ከሚገኝበት ኤለመንት የጽሑፍ መጠን አንጻር ነው። የጽሑፍ እና የክፍተት መጠኖችን በrem ማድረግ አንባቢው ነባሪ የጽሑፍ መጠኑን ሲቀይር ሁሉም ነገር አብሮ እንዲያድግ ያስችላል።

ለምን የተለየ የem አውድ (context) መጠን አስፈልገ?

em የሚለካው ከራሱ ኤለመንት የጽሑፍ መጠን አንጻር ነው፣ ይህም ሁልጊዜ root ላይሆን ይችላል። emን በትክክል ለማስላት የem አውድ (context) በዚያ ኤለመንት የጽሑፍ መጠን ላይ ያድርጉት፣ እና ሁለቱ እኩል ሲሆኑ ደግሞ ከroot ጋር እኩል ያድርጉት።

የእኔ root የጽሑፍ መጠን 16px ካልሆነስ?

ከCSS ኮድዎ ጋር እንዲዛመድ የroot font size ሳጥኑን ይቀይሩ፣ በዚህ ጊዜ እያንዳንዱ የrem እሴት ወዲያውኑ ይዘመናል። ከታች ያለው ፈጣን ሰንጠረዥ አብዛኛዎቹ ድረ-ገጾች ለሚጀምሩበት የተለመደው 16px root ጠቃሚ መመሪያ ነው።

ይህ መሳሪያ ምን እንደሚያደርግ

ይህ መሳሪያ የፒክስል (px) ዋጋዎችን ወደ root em (rem) እና em ይቀይራል፣ እንዲሁም በተቃራኒው። ከሶስቱ ዩኒቶች በአንዱ ውስጥ ዋጋ ማስገባት ብቻ በቂ ነው፤ መሳሪያው በሌሎቹ ሁለት ዩኒቶች ውስጥ ተመጣጣኝ ዋጋዎችን ራሱ ያሰላል እና ያሳያል። ከዚህ በተጨማሪ፣ ለልዩ የንድፍ ፍላጎትዎ ልወጣዎቹ ትክክለኛ እንዲሆኑ የራስዎን Root የጽሑፍ መጠን እና የem አውድ የጽሑፍ መጠን ማስተካከል ይችላሉ።

ይህ መሳሪያ ቋሚ የፒክስል ዋጋዎችን ለምላሽ ሰጪ ንድፍ ወደ አንፃራዊ rem ወይም em ዩኒቶች መቀየር ለሚፈልጉ፣ የተለያዩ Root የጽሑፍ መጠኖች በrem ዋጋዎች ላይ የሚያሳድሩትን ተጽዕኖ ለመረዳት ለሚፈልጉ፣ በተወሰነ ኤለመንት የጽሑፍ መጠን ላይ የተመሰረተ em ዋጋ ማስላት ለሚፈልጉ፣ እና አንባቢ ነባሪ የጽሑፍ መጠኑን ሲቀይር የገጹ መጠኖች በትክክል እንዲመጠኑ ማረጋገጥ ለሚፈልጉ ሰዎች ይጠቅማል። ውጤቶቹም ራስዎ ያስገቡትን Root የጽሑፍ መጠን እና የem አውድ የጽሑፍ መጠን፣ እንዲሁም በሶስቱም ዩኒቶች መካከል የተቀየሩትን እሴቶች በአንድ ላይ ያሳያሉ።

ግቤቶችዎን ማዘጋጀት፡ Root የጽሑፍ መጠን፣ የem አውድ መጠን እና እሴቶች

መሳሪያው ሶስት ግቤት ሳጥኖች አሉት። Root የጽሑፍ መጠን (px) የገጹን መሰረታዊ የጽሑፍ መጠን በፒክስል የሚወክል ቁጥር ሲሆን፣ ነባሪ ዋጋው 16px ነው። የem አውድ የጽሑፍ መጠን (px) ለem ልወጣዎች የኤለመንቱን የጽሑፍ መጠን በፒክስል የሚወክል ቁጥር ሲሆን፣ ይህም ነባሪ ዋጋ 16px ነው። እሴቶች ሳጥኑ ደግሞ በpx, rem ወይም em የተገለጸ ርዝመት ዋጋ የሚያስገቡበት ነው። ከ px, rem ወይም em ሳጥኖች በአንዱ ውስጥ ሲጽፉ፣ ሌሎቹ ሁለቱ ወዲያውኑ ይዘመናሉ፣ በይነገጹ ላይም እንደተገለጸው “የpx, rem ወይም em እሴት ያስገቡ — ሲጽፉ ሌሎቹ ሁለቱ ወዲያውኑ ይዘመናሉ።” መሳሪያው አሉታዊ የፒክስል ዋጋዎችንም ይቀበላል። Root የጽሑፍ መጠን ከ0 የሚበልጥ ቁጥር መሆን አለበት፣ እንዲሁም የem አውድ የጽሑፍ መጠንም ከ0 የሚበልጥ ቁጥር መሆን አለበት።

rem እና Root የጽሑፍ መጠን

rem የሚያሰላው ከ Root የጽሑፍ መጠን ጋር ተያይዞ ነው። መሳሪያውን ሲከፍቱ Root የጽሑፍ መጠን በነባሪነት 16px ተቀናብሮ ይጀምራል፣ በዚህም መነሻ ላይ 16px ከ1rem እና ከ1em ጋር እኩል ነው። ለምሳሌ፣ ይህ ነባሪ ቅንብር ሳይለወጥ በእሴቶች ሳጥን ውስጥ 8px ቢያስገቡ ውጤቱ 0.5rem ይሆናል፣ 32px ቢያስገቡ ደግሞ 2rem ያገኛሉ፣ 40px ቢያስገቡም 2.5rem ያገኛሉ - ምክንያቱም 8, 32 እና 40 ከ16 ጋር ሲነጻጸሩ በቅደም ተከተል ግማሽ፣ እጥፍ እና 2.5 እጥፍ ስለሆኑ ነው። ለንድፍዎ ትክክለኛ ልወጣ እንዲኖርዎት Root የጽሑፍ መጠን ሳጥኑን ከራስዎ የገጽ መሰረታዊ የጽሑፍ መጠን ጋር በሚዛመድ ዋጋ ማስተካከል ይችላሉ፣ በዚህ ጊዜ የተቀየሩት rem ዋጋዎችም ከአዲሱ መነሻ ጋር እንዲስማሙ ተደርገው ይታያሉ።

em እና የአውድ የጽሑፍ መጠን

em ግን ከ Root የጽሑፍ መጠን ሳይሆን ከተወሰነው ኤለመንት ራሱ የጽሑፍ መጠን ጋር ይሰላል፣ ይህም መሳሪያው በ“የem አውድ የጽሑፍ መጠን” ሳጥን ውስጥ በሚያስገቡት ግቤት ይወከላል። ይህ ሳጥንም በነባሪነት 16px ተቀናብሮ ይጀምራል፣ ይህም መሳሪያውን ሲከፍቱ 16px ከ1em ጋር እኩል እንዲሆን ያደርገዋል። ለምሳሌ፣ የem አውድ የጽሑፍ መጠን በነባሪው 16px እያለ በእሴቶች ሳጥን ውስጥ 20px ቢያስገቡ 1.25em ያገኛሉ፣ ይህም 20 ከ16 ጋር ሲነጻጸር 1.25 እጥፍ ስለሆነ ነው። የተለየ ኤለመንት የጽሑፍ መጠን ላይ የተመሰረተ em ዋጋ ማስላት ለሚፈልጉ፣ የem አውድ የጽሑፍ መጠን ሳጥኑን ከዚያ ኤለመንት ትክክለኛ የጽሑፍ መጠን ጋር በማዛመድ ትክክለኛ ውጤት ማግኘት ይችላሉ፣ ይህ ደግሞ em ከ rem የሚለይበት ዋና ነጥብ ነው፡ rem ሁልጊዜ ከ Root የጽሑፍ መጠን ጋር ይሰላል፣ em ግን ከተጠቀሰው ኤለመንት አውድ ጋር ይሰላል።

የተለመዱ px → rem ሰንጠረዥ

ከዋናዎቹ ሶስት ሳጥኖች በተጨማሪ፣ መሳሪያው በ16px root መነሻ ላይ የተመሰረቱ የተለመዱ የፒክስል ዋጋዎችን ወደ rem የተቀየሩ አድርጎ የሚያሳይ ሰንጠረዥ ይዟል። ለምሳሌ በዚህ 16px መነሻ፣ 12px ከ0.75rem ጋር፣ 16px ከ1rem ጋር፣ 24px ከ1.5rem ጋር፣ እና 48px ከ3rem ጋር እኩል ይሆናል። ይህ ሰንጠረዥ ሁልጊዜ የ16px መነሻን የሚያሳይ በመሆኑ፣ Root የጽሑፍ መጠን ሳጥኑን ወደ ሌላ ዋጋ ቢቀይሩም እንኳ አብዛኛዎቹ ድረ-ገጾች ለሚጀምሩበት የተለመደው ሁኔታ ፈጣን ማጣቀሻ ሆኖ ይቆያል።

ስህተት መልእክቶች እና ግላዊነት

ወደ እሴቶች ሳጥን ትክክል ያልሆነ ግቤት ካስገቡ፣ መሳሪያው “እባክዎ ለመቀየር ቁጥር ያስገቡ።” የሚል መልእክት ያሳያል። Root የጽሑፍ መጠን ሳጥን ከ0 የማይበልጥ ወይም ትክክለኛ ያልሆነ ዋጋ ከያዘ፣ “Root የጽሑፍ መጠን ከ0 የሚበልጥ ቁጥር መሆን አለበት።” የሚል መልእክት ይታያል። የem አውድ የጽሑፍ መጠን ሳጥንም ተመሳሳይ ችግር ካጋጠመው፣ “የem አውድ የጽሑፍ መጠን ከ0 የሚበልጥ ቁጥር መሆን አለበት።” የሚል መልእክት ያገኛሉ። እነዚህ የስህተት መልእክቶች የሚታዩት Root የጽሑፍ መጠን እና የem አውድ የጽሑፍ መጠን ሳጥኖች ላይ ብቻ ሲሆን፣ እሴቶች ሳጥን ውስጥ አሉታዊ የፒክስል ዋጋ ማስገባት ግን የተፈቀደ በመሆኑ ስህተት አያስከትልም።

ከዚህ ጎን ለጎን፣ እያንዳንዱ ልወጣ የሚከናወነው በብሮውዘርዎ ላይ ነው። የሚጽፉት ማንኛውም ነገር ወደ BroBroGo አይሰቀልም።

ተደጋግመው የሚጠየቁ ጥያቄዎች

ነባሪው Root የጽሑፍ መጠን ስንት ነው? ነባሪው Root የጽሑፍ መጠን 16px ሲሆን፣ የem አውድ የጽሑፍ መጠንም በተመሳሳይ በነባሪነት 16px ተቀናብሮ ይጀምራል፤ በዚህም መነሻ ላይ 16px ከ1rem እና ከ1em ጋር እኩል ነው።

አሉታዊ የፒክስል ዋጋ ማስገባት እችላለሁ? አዎ፣ መሳሪያው አሉታዊ የፒክስል ዋጋዎችን ይፈቅዳል።

ከሶስቱ ሳጥኖች በአንዱ ውስጥ ስጽፍ ሌሎቹ መቼ ይዘምናሉ? በ px, rem ወይም em ሳጥን ውስጥ በምትጽፉበት ቅጽበት ሌሎቹ ሁለቱ ሳጥኖች ወዲያውኑ ይዘመናሉ።

የማስገባቸው ዋጋዎች ወደ ሌላ ቦታ ይላካሉ? አይ። እያንዳንዱ ልወጣ የሚከናወነው በብሮውዘርዎ ላይ ብቻ ነው፣ የሚጽፉት ማንኛውም ነገር ወደ BroBroGo አይሰቀልም።