మూల ఎలిమెంట్ ఫాంట్ పరిమాణం, పేరెంట్ ఎలిమెంట్ ఫాంట్ పరిమాణం, DPIతో pxను rem, em, pt, పైకాలు, అంగుళాలు, mmగా మార్చండి. CSSలో 1 in = 96 px = 72 pt స్థిరంగా ఉంటుంది.
రచయిత: AdminAI రచనా సాధనాలతో ముసాయిదా సిద్ధం చేశారునవీకరించబడింది తనిఖీ చేసిన ఉదాహరణలు: 7
మూల ఫాంట్ 16 px, అంగుళానికి 96 పిక్సెల్లు ఉన్నప్పుడు 24px అంటే 1.5rem.
| ప్రమాణం | విలువ | నిర్వచనం |
|---|---|---|
| పిక్సెల్లు (px) | 24px | 1 px |
| పాయింట్లు (pt) | 18pt | 1 pt = 1/72 in |
| పైకా (pc) | 1.5pc | 1 pc = 12 pt = 1/6 in |
| అంగుళాలు (in) | 0.25in | 1 in = DPI px |
| సెంటీమీటర్లు (cm) | 0.635cm | 1 cm = 1/2.54 in |
| మిల్లీమీటర్లు (mm) | 6.35mm | 1 mm = 1/25.4 in |
| పావు మిల్లీమీటరు (Q) | 25.4Q | 1 Q = 0.25 mm |
| em (పేరెంట్ ఫాంట్ పరిమాణం) | 1.5em | 1 em = parent font size |
| rem (మూల ఫాంట్ పరిమాణం) | 1.5rem | 1 rem = root font size |
| పేరెంట్ ఫాంట్ పరిమాణంలో శాతం (%) | 150% | 100% = parent font size |
1 px
1 rem = root font size
CSS పొడవులను పిక్సెల్‌ల ద్వారా మారుస్తుంది. నిరపేక్ష యూనిట్లు స్థిరం: 1 in = 2.54 cm = 96 px = 72 pt = 6 pc; 1 Q పావు మిల్లీమీటరు. ఫాంట్ సాపేక్ష యూనిట్లు పేజీపై ఆధారం: 1 rem మూల ఫాంట్, font-sizeపై 1 em (లేదా 100%) పేరెంట్ ఫాంట్. ముందుగా pxకు మార్చి లక్ష్య యూనిట్ pxతో భాగిస్తుంది.
ఫ్రంట్‌ఎండ్ డెవలపర్లు డిజైన్ pxను remగా మార్చి బ్రౌజర్ ఫాంట్ సెట్టింగ్‌ను అనుసరింపజేస్తారు: మూలం డిఫాల్ట్ 16 px అయితే 24 px అంటే 1.5 rem. ప్రింట్ డిజైన్‌కు అంగుళానికి పిక్సెల్‌ల ఫీల్డ్; 300 DPIపై 10 mm లోగోకు సుమారు 118 పిక్సెల్లు. పాఠకుడి ఎంపికకు అనుగుణంగా మారాలంటే మూల ఫాంట్ పరిమాణమూ ఆ ఎంపికను అనుసరించాలి.
CSS అంగుళం తెరపై కొలిచిన అంగుళంతో సమానం కావాల్సిన అవసరం లేదు. CSS ప్రకారం అంగుళానికి 96 px; సూచన పిక్సెల్ దృశ్య కోణం సుమారు 0.0213°. అమలు absolute ప్రమాణాలను భౌతిక కొలతలకు లేదా పిక్సెల్లకు అనుసంధానించవచ్చు; పరికర మ్యాపింగ్, చూసే దూరం, ముద్రణ స్కేలు రూలర్‌తో సరిపోలికను ప్రభావితం చేస్తాయి.
సూత్రంలో xₛ, xₜ మూల, లక్ష్య విలువలు; pₛ, pₜ మూల, లక్ష్య యూనిట్‌కు పిక్సెల్లు. గుణకాలు ఇచ్చిన ఫాంట్ పరిమాణాలు, పిక్సెల్ సాంద్రత వాడతాయి.
విలువ, ప్రమాణాలతో పాటు మూల ఫాంట్, పేరెంట్ ఫాంట్ పరిమాణాలు ఇవ్వండి. మూలం 16 px అయితే 24 px = 1.5 rem; మూలం 20 px అయితే 24 px = 1.2 rem. ఒకే px విలువకు కూడా ఆధారం మారితే rem సంఖ్య మారుతుంది.
| విలువ | మూల ప్రమాణం | లక్ష్య ప్రమాణం | లెక్క పరిస్థితి | మారిన విలువ |
|---|---|---|---|---|
| 24 | px | rem | మూలం 16 px | 1.5 |
| 24 | px | rem | మూలం 20 px | 1.2 |
| 12 | pt | px | 96 పిక్సెల్/in | 16 |
| 1 | pc | pt | 96 పిక్సెల్/in | 12 |
| 100 | % | em | పేరెంట్ ఫాంట్ 16 px | 1 |
| 10 | mm | px | 300 పిక్సెల్/in | 118.110236 |
CSS సంబంధం 1 in = 96 px = 72 pt. మరో సాంద్రతను ఎంచుకున్న మోడ్ ఆ సాంద్రతలో భౌతిక పిక్సెల్లను లెక్కిస్తుంది: 10 mm × 300 ÷ 25.4 ≈ 118.110236 px. ఇది బ్రౌజర్ CSS సంబంధాన్ని మార్చదు; తెరపై నిజ పొడవును స్వయంగా కొలవదు.
ఇక్కడ em, %లు font-size సందర్భంలో పేరెంట్ ఫాంట్ను, rem మూల ఫాంట్ను ఆధారంగా తీసుకుంటాయి. అన్ని CSS ప్రాపర్టీల శాతాలకు ఒకే ఆధారం ఉండదు; em కూడా వాడిన చోటుపై ఆధారపడుతుంది. జూమ్ లేదా పరికర పిక్సెల్ నిష్పత్తితో మాత్రమే నిజ పొడవు నిర్ణయించవద్దు.
తనిఖీ చేసిన మూలం: ఉదాహరణ తనిఖీ: CSS Values 3 §6.1: 1rem = మూల ఫాంట్ పరిమాణం (16 px బ్రౌజర్ డిఫాల్ట్); 24 / 16 = 1.5
తనిఖీ చేసిన మూలం: ఉదాహరణ తనిఖీ: CSS Values 3 §6.2: 1pt = 1/72 in, 1in = 96px; 12 × 96/72 = 16
తనిఖీ చేసిన మూలం: ఉదాహరణ తనిఖీ: CSS Values 3 §6.2: 1in = 96px
తనిఖీ చేసిన మూలం: ఉదాహరణ తనిఖీ: 1 rem = మూల ఫాంట్ పరిమాణం (16 px); 1.5 × 16
డిఫాల్ట్ 16 పిక్సెల్లు. rem మూల html ఫాంట్ పరిమాణం; వినియోగదారు లేదా html { font-size } మార్చకపోతే ప్రధాన బ్రౌజర్లు 16 px ఉంచుతాయి. ఈ డిఫాల్ట్పై html { font-size: 62.5% }తో 1 rem = 10 px. W3C CSS Values and Units remను నిర్వచిస్తుంది; 16 px బ్రౌజర్ డిఫాల్ట్, ప్రమాణ నిర్వచనం కాదు.
పిక్సెల్లను 0.75తో గుణించండి; పాయింట్ల నుంచి పిక్సెల్లకు 4/3 (సుమారు 1.333). W3C CSS నియమం 1 in = 96 px = 72 pt కాబట్టి 1 px = 72/96 pt. 16 px పాఠ్యం 12 pt; వర్డ్ ప్రాసెసర్ 11 pt సుమారు 14.67 px.
rem ఎల్లప్పుడూ మూల ఫాంట్ను, em ప్రస్తుత ఫాంట్ను సూచిస్తుంది; font-sizeకే వాడితే పేరెంట్ ఫాంట్. కాబట్టి em లోపల లోపల గుణిస్తుంది: 1.2em జాబితాలో మరో 1.2em జాబితా రెండు జాబితాల అమరికలకు ముందున్న ఆధార ఫాంట్ పరిమాణానికి 1.44 రెట్లు. మూలం 16 px అయితే 1.2rem ఎంత లోపలైనా 19.2 px.
పాఠకుడి బ్రౌజర్ ఫాంట్ పరిమాణ ఎంపికకు అనుగుణంగా మారాలంటే rem వాడి, మూల ఫాంట్ పరిమాణమూ ఆ ఎంపికను అనుసరించేలా చేయండి. పేజీ zoom px, rem రెండింటినీ పెంచుతుంది; rem, em, శాతాలు మూల లేదా పేరెంట్ సందర్భం ద్వారా ఎంపికను అనుసరించవచ్చు. WCAG 2.1 ప్రమాణం 1.4.4 (AA) ప్రకారం విషయం, పనితీరు కోల్పోకుండా పాఠ్యాన్ని 200%కు పెంచగలగాలి. px కూడా browser zoomతో దీన్ని సాధించవచ్చు; మూల సందర్భం అనుమతిస్తే rem ఫాంట్ ఎంపికనూ అనుసరిస్తుంది.
CSS inch తెరపై కొలిచిన inchతో సమానం కావాల్సిన అవసరం లేదు. CSSలో 1 in = 96 px. W3C సూచన పిక్సెల్ అంటే 96 DPI తెరను 28 in దూరం నుంచి చూసే ఒక పిక్సెల్, దృశ్య కోణం సుమారు 0.0213°. పరికర మ్యాపింగ్, చూసే దూరం మారతాయి కాబట్టి ఫోన్‌పై 96 px పెట్టె నిజమైన inch కంటే చిన్నగా ఉండవచ్చు. అసలు పరిమాణ ముద్రణలో 1 in అంటే 25.4 mm; ముద్రణ స్కేలు, కాలిబ్రేషన్ కూడా అసలు పరిమాణాన్ని ప్రభావితం చేస్తాయి.
ఈ కాలిక్యులేటర్‌లో స్వతంత్ర ఆధారాల నుంచి సమాధానాలు పొందిన 7 సాధించిన ఉదాహరణలు ఉన్నాయి. ఇవి పరీక్షల సమూహంలో అమలవుతాయి; మీరు ఇక్కడ కూడా వాటిని అమలు చేయవచ్చు.