ఫాంట్ పరిమాణం మార్చడానికి ఎమ్స్ ను ఉపయోగించడం
మీరు వెబ్ పేజీని నిర్మిస్తున్నప్పుడు, చాలా నిపుణులు మీరు ఎమ్మ్స్, ఎక్స్, శాతాలు లేదా పిక్సెల్లు వంటి సాపేక్ష కొలతతో మీ పరిమాణం ఫాంట్లను (మరియు వాస్తవానికి, ప్రతిదీ) సిఫార్సు చేస్తారు. ఇది మీ కంటెంట్ను ఎవరైనా వీక్షించే వివిధ మార్గాల్లో మీకు నిజంగా తెలియదు. మరియు మీరు ఒక ఖచ్చితమైన కొలత (అంగుళాలు, సెంటీమీటర్లు, మిల్లీమీటర్లు, పాయింట్లు, లేదా పికాస్) ఉపయోగిస్తే, వివిధ పరికరాల్లోని పేజీ యొక్క డిస్ప్లే లేదా రీడబిలిటీని ప్రభావితం చేయవచ్చు.
మరియు W3C మీరు పరిమాణాలకు EMS ను ఉపయోగించాలని సిఫార్సు చేస్తోంది.
కానీ ఎమ్ బి హౌ బి?
W3C ప్రకారం ఒక em:
"ఇది ఉపయోగించే మూలకం యొక్క 'ఫాంట్-సైజ్' ఆస్తి యొక్క గణిత విలువకు సమానం.ఇది 'em' సంభవిస్తుంది 'font-size' ఆస్తి విలువలో, పేరెంట్ మూలకం యొక్క ఫాంట్ పరిమాణం వరకు. "
మరో మాటలో చెప్పాలంటే, ems కు సంపూర్ణ పరిమాణం లేదు. వారు తమ పరిమాణ విలువలను వారు ఎక్కడ ఆధారపడి తీసుకుంటారు. చాలామంది వెబ్ డిజైనర్ల కోసం , వారు ఒక వెబ్ బ్రౌజర్లో ఉన్నారని అర్థం, అందుచేత 1 వ పొడవు ఉన్న ఫాంట్ ఆ బ్రౌజర్ యొక్క డిఫాల్ట్ ఫాంట్ పరిమాణంగా సరిగ్గా అదే పరిమాణం.
కానీ డిఫాల్ట్ పరిమాణం ఎంత పొడవుగా ఉంది? వినియోగదారులు వారి బ్రౌజర్లలో వారి డిఫాల్ట్ ఫాంట్ పరిమాణాన్ని మార్చవచ్చు, కానీ చాలా మంది ప్రజలు మీరు చాలా బ్రౌజర్లు 16px ఒక డిఫాల్ట్ ఫాంట్ పరిమాణం కలిగి ఊహించుకోవటం లేదు ఎందుకంటే 100% కొన్ని మార్గం లేదు. కాబట్టి చాలా సమయం 1em = 16px .
పిక్సల్స్ లో థింక్, కొలత కోసం ఎమ్స్ ఉపయోగించండి
మీరు డిఫాల్ట్ ఫాంట్ పరిమాణం 16px అని మీరు ఒకసారి, అప్పుడు మీరు మీ ఖాతాదారులకు సులభంగా పేజీ పరిమాణాన్ని అనుమతిస్తుంది మీ ఫాంట్ పరిమాణాలు కోసం పిక్సెళ్ళు అనుకుంటున్నాను ems ఉపయోగించవచ్చు.
మీరు ఇలాంటి పరిమాణపు నిర్మాణాన్ని కలిగి ఉన్నారని చెప్పండి:
- హెడ్లైన్ 1 - 20px
- హెడ్లైన్ 2 - 18px
- హెడ్లైన్ 3 - 16px
- ప్రధాన వచనం - 14px
- సబ్ టెక్స్ట్ - 12px
- ఫుట్నోట్స్ - 10px
కొలత కోసం పిక్సెల్లను ఉపయోగించి వాటిని ఆ విధంగా నిర్వచించవచ్చు, కాని అప్పుడు IE 6 మరియు 7 ను ఉపయోగించి ఎవరైనా మీ పేజీని సరిగ్గా మార్చలేరు. సో మీరు EMS పరిమాణాలు మార్చాలి మరియు ఈ కేవలం కొన్ని గణిత విషయం:
- హెడ్లైన్ 1 - 1.25 ఎం (16 x 1.25 = 20)
- హెడ్లైన్ 2 - 1.125ఎం (16 × 1,125 = 18)
- హెడ్లైన్ 3 - 1 ని (1 ని = 16px)
- ప్రధాన టెక్స్ట్ - 0.875em (16 x 0.875 = 14)
- సబ్ టెక్స్ట్ - 0.75 ఎం (16 x 0.75 = 12)
- ఫుట్నోట్స్ - 0.625 (16 x 0.625 = 10)
వారసత్వం మర్చిపోవద్దు!
కానీ అన్ని కాదు EMs ఉంది. మీరు గుర్తుంచుకోవాల్సిన ఇతర విషయం ఏమిటంటే వారు తల్లిదండ్రుల పరిమాణం మీద పడుతుంది. మీరు వేర్వేరు ఫాంట్ పరిమాణాలతో ఉన్న సమూహ మూలకాలు ఉంటే, మీరు ఊహించిన దానికంటే చాలా చిన్న లేదా పెద్ద అక్షరాలతో ముగుస్తుంది.
ఉదాహరణకు, మీరు ఇలాంటి శైలి షీట్ కలిగి ఉండవచ్చు:
p {font-size: 0.875em; }
.footnote {font-size: 0.625em; }
ఇది 14px మరియు 10px ప్రధాన అక్షరాలకు మరియు ఫుట్నోట్లకు వరుసగా ఫాంట్లకు దారి తీస్తుంది. కానీ మీరు ఒక పేరా లోపల ఒక ఫుట్నోట్ ఉంచితే, మీరు 10px కంటే 8.75px అని టెక్స్ట్ తో ముగించవచ్చు. దీన్ని మీరే ప్రయత్నించండి, పైన పేర్కొన్న CSS మరియు క్రింది HTML ను ఒక పత్రంలో ఉంచండి:
ఈ ఫాంట్ ఎత్తు 14px లేదా 0.875 ఎమ్స్.
ఈ పేరాలో అది ఒక ఫుట్నోట్ ఉంది.
ఇది కేవలం ఫుట్నోట్ పేరా అయితే.
ఫుట్నోట్ టెక్స్ట్ 10px వద్ద చదవడానికి కష్టం, ఇది దాదాపు 8.75px వద్ద అస్పష్టంగా ఉంది.
కాబట్టి, మీరు EMs ను వాడుతున్నప్పుడు, పేరెంట్ వస్తువుల పరిమాణాల గురించి మీరు బాగా తెలుసుకుంటారు, లేదా మీ పేజీలో కొన్ని నిజంగా బేసి పరిమాణంలోని అంశాలతో ముగుస్తుంది.