எழுத்துரு அளவுகள் மாற்ற Ems பயன்படுத்தி
நீங்கள் ஒரு வலைப்பக்கத்தை உருவாக்கும்போது, பெரும்பாலான தொழில்முறை வல்லுநர்கள், எக்ஸ், எக்ஸ், சிஸ்டம்ஸ் அல்லது பிக்சல்கள் போன்ற ஒரு ஒப்பீட்டு அளவைக் கொண்ட அளவு எழுத்துருக்கள் (மற்றும் உண்மையில் எல்லாம்) பரிந்துரைக்கிறார்கள். யாராவது உங்கள் உள்ளடக்கத்தை காணக்கூடிய பல்வேறு வழிகளை நீங்கள் உண்மையில் அறியவில்லை என்பதால் இது தான். நீங்கள் ஒரு முழுமையான அளவை (அங்குலங்கள், சென்டிமீட்டர்கள், மில்லிமீட்டர்கள், புள்ளிகள் அல்லது பைசஸ்) பயன்படுத்தினால், அது வெவ்வேறு சாதனங்களில் உள்ள பக்கத்தின் காட்சி அல்லது வாசிப்பதை பாதிக்கும்.
மற்றும் W3C நீங்கள் அளவீடுகளுக்கு ems பயன்படுத்த பரிந்துரைக்கிறது.
ஆனால் எம் எப்படி பெரியது?
W3C இன் படி ஒரு em:
"font-size 'சொத்தின் மதிப்பு கணக்கிடப்பட்ட மதிப்புக்கு சமமாக இருக்கும்.' font-size 'சொத்தின் மதிப்பில்' em 'ஏற்படும் போது விதிவிலக்கு இது, பெற்றோர் உறுப்பு எழுத்துரு அளவுக்கு. "
வேறு வார்த்தைகளில் சொன்னால், ems ஒரு முழுமையான அளவு இல்லை. அவர்கள் எங்கு இருக்கிறார்கள் என்பதன் அடிப்படையில் அவர்கள் அளவிலான மதிப்புகளை எடுத்துக்கொள்கிறார்கள். பெரும்பாலான இணைய வடிவமைப்பாளர்களுக்கு , இது ஒரு இணைய உலாவியில் இருப்பதாக அர்த்தம், எனவே 1em உயரம் கொண்ட ஒரு எழுத்துரு அந்த உலாவியின் இயல்புநிலை எழுத்துரு அளவுக்கு அதே அளவுதான்.
ஆனால் இயல்புநிலை அளவு எவ்வளவு உயரம்? வாடிக்கையாளர்கள் தங்கள் உலாவிகளில் தங்கள் இயல்புநிலை எழுத்துரு அளவு மாற்ற முடியும் என, 100% சில இருக்க வழி இல்லை, ஆனால் பெரும்பாலான மக்கள் நீங்கள் பெரும்பாலான உலாவிகளில் 16px ஒரு இயல்புநிலை எழுத்துரு அளவு என்று கருத முடியாது என்பதால். எனவே பெரும்பாலான நேரம் 1em = 16px .
பிக்ஸல்களில் சிந்தியுங்கள், அளவிற்கான ஈஸ் ஐப் பயன்படுத்துங்கள்
இயல்புநிலை எழுத்துரு அளவு 16px என்று நீங்கள் அறிந்தவுடன், உங்கள் வாடிக்கையாளர்களை பக்கம் எளிதாக அளவை மாற்ற அனுமதிக்க, ஆனால் உங்கள் எழுத்துரு அளவுகளில் பிக்சல்களில் சிந்திக்கலாம்.
நீங்கள் இதைப் போன்ற ஒரு அளவிலான அமைப்பு ஒன்றைக் கூறுங்கள்:
- தலைப்பு 1 - 20px
- தலைப்பு 2 - 18px
- தலைப்பு 3 - 16px
- முக்கிய உரை - 14px
- துணை உரை - 12px
- அடிக்குறிப்புகள் - 10px
அளவீட்டுக்கு பிக்சல்களைப் பயன்படுத்துவதன் மூலம் அவற்றை நீங்கள் வரையறுக்கலாம், ஆனால் IE 6 மற்றும் 7 ஐப் பயன்படுத்தி யாரும் உங்கள் பக்கத்தை அளவை மாற்ற முடியாது. எனவே நீங்கள் அளவுகள் அளவை மாற்ற வேண்டும் மற்றும் இது சில கணித விஷயம்:
- தலைப்பு 1 - 1.25 மணி (16 x 1.25 = 20)
- தலைப்பு 2 - 1.125 அ (16 × 1,125 = 18)
- தலைப்பு 3 - 1 அ (1 ஏ = 16px)
- முக்கிய உரை - 0.875 (16 x 0.875 = 14)
- துணை உரை - 0.75 எ. (16 x 0.75 = 12)
- அடிக்குறிப்புகள் - 0.625 மணி (16 x 0.625 = 10)
மரபுரிமை மறந்துவிடாதே!
ஆனால் அது எல்லாமே ஈஸ்ஸில் இல்லை. நீங்கள் நினைவில் கொள்ள வேண்டிய மற்றொரு விஷயம் அவர்கள் பெற்றோரின் அளவுக்கு எடுத்துக்கொள்வதாகும். நீங்கள் பல்வேறு எழுத்துரு அளவுகள் கொண்ட உள்ளமை உறுப்புகள் இருந்தால், நீங்கள் எதிர்பார்க்கும் விட சிறிய அல்லது பெரிய ஒரு எழுத்துரு முடிவடையும்.
உதாரணமாக, உங்களுக்கு இது போன்ற நடை தாள் இருக்கலாம்:
p {font-size: 0.875em; }
.footnote {font-size: 0.625em; }
இது முக்கிய உரை மற்றும் அடிக்குறிப்புகள் முறையே 14px மற்றும் 10px ஆகும். ஆனால் ஒரு பத்தி உள்ளே ஒரு அடிக்குறிப்பை வைத்தால், நீங்கள் 10px ஐ விட 8.75px என்று உரை மூலம் முடிவடையும். அதை நீங்களே முயற்சி செய்து, மேலே உள்ள CSS மற்றும் பின்வரும் HTML ஐ ஒரு ஆவணத்தில் வைக்கவும்:
இந்த எழுத்துரு உயரம் 14px அல்லது 0.875 ems ஆகும்.
இந்த பத்தியில் ஒரு அடிக்குறிப்பு உள்ளது.
இது ஒரு அடிக்குறிப்பு பத்தி என்றாலும்.
அடிக்குறிப்பு உரையானது 10px இல் படிக்க கடினமாக உள்ளது, இது 8.75px இல் கிட்டத்தட்ட சாத்தியமற்றதாகும்.
எனவே, நீங்கள் EMs ஐப் பயன்படுத்தும் போது, பெற்றோர் பொருட்களின் அளவுகள் பற்றி நன்கு அறிந்திருக்க வேண்டும் அல்லது உங்கள் பக்கம் சில வித்தியாசமான அளவிலான கூறுகளுடன் முடிவடையும்.