যখন আপনি একটি ওয়েব পৃষ্ঠা তৈরি করছেন, তখন বেশিরভাগ পেশাদার প্রস্তাব করেন যে আকারের ফন্টগুলি (এবং আসলে, সবকিছুই) আপেক্ষিক পরিমাপ যেমন ems, exs, percentages, বা pixels সহ। এটি এমন কারণ যেহেতু কেউ আপনার সামগ্রীটি দেখতে পারে এমন সমস্ত ভিন্ন উপায়ে আপনি জানেন না। এবং যদি আপনি পরম পরিমাপ (ইঞ্চি, সেন্টিমিটার, মিলিমিটার, পয়েন্ট, বা পিকাস) ব্যবহার করেন তবে এটি বিভিন্ন ডিভাইসগুলিতে পৃষ্ঠাটির প্রদর্শন বা পঠনযোগ্যতা প্রভাবিত করতে পারে। এবং W3C আপনাকে মাপের জন্য ems ব্যবহার করার সুপারিশ করে।
কিন্তু একটি এম কত বড়?
W3C অনুযায়ী একটি এম:
"এটি ব্যবহৃত হয় এমন উপাদানটির 'ফন্ট সাইজ' সম্পত্তির গণিত মানের সমান। ব্যতিক্রমটি যখন 'ফন্ট সাইজ' সম্পত্তির মানের মধ্যেই হয় তখন ব্যতিক্রমটি, যা ক্ষেত্রে এটি উল্লেখ করে মূল উপাদান এর ফন্ট সাইজ। "
অন্য কথায়, ems একটি পরম আকার নেই। তারা যেখানে তাদের উপর ভিত্তি করে তাদের আকার মান নিতে। বেশিরভাগ ওয়েব ডিজাইনারের জন্য, এটি একটি ওয়েব ব্রাউজারে রয়েছে, তাই 1 ম লম্বা ফন্টটি সেই ব্রাউজারটির ডিফল্ট ফন্ট সাইজের মতোই আকার।
কিন্তু ডিফল্ট আকার কত লম্বা? গ্রাহকরা তাদের ব্রাউজারে তাদের ডিফল্ট ফন্টের আকার পরিবর্তন করতে পারে এমন 100% নিশ্চিত হওয়ার কোন উপায় নেই, কিন্তু বেশিরভাগ লোকেরা আপনি অনুমান করতে পারেন যে বেশিরভাগ ব্রাউজারগুলিতে 16px এর ডিফল্ট ফন্টের আকার থাকে। তাই সময় অধিকাংশ 1em = 16px.
পিক্সেলগুলিতে চিন্তা করুন, পরিমাপের জন্য EMS ব্যবহার করুন
একবার আপনি ডিফল্ট ফন্ট সাইজ 16 পিক্সের পরে জানেন, তখন আপনি আপনার ক্লায়েন্টদের পৃষ্ঠাটি সহজেই আকার পরিবর্তন করতে অনুমতি দিতে EMS ব্যবহার করতে পারেন তবে আপনার ফন্ট মাপের জন্য পিক্সেলগুলিতে মনে করুন। আপনি এই মত কিছু একটি মাপের গঠন আছে বলুন:
- শিরোনাম 1 - 20px
- শিরোনাম 2 - 18px
- শিরোনাম 3 - 16px
- মূল টেক্সট - 14px
- সাব টেক্সট - 12px
- পাদটীকা - 10px
আপনি পরিমাপের জন্য পিক্সেলগুলি ব্যবহার করে সেইভাবে তাদের সংজ্ঞায়িত করতে পারেন, তবে IE 6 এবং 7 ব্যবহার করে যে কেউ আপনার পৃষ্ঠাটি ভাল আকারে পরিবর্তন করতে পারবে না। সুতরাং আপনাকে মাপকে ems রূপান্তর করা উচিত এবং এটি কেবল কিছু গণিতের বিষয়:
- শিরোনাম 1 - 1.25em (16 x 1.25 = 20)
- শিরোনাম 2 - 1.125em (16 × 1.125 = 18)
- শিরোনাম 3 - 1em (1em = 16px)
- মূল পাঠ্য - 0.875em (16 x 0.875 = 14)
- সাব টেক্সট - 0.75em (16 x 0.75 = 12)
- পাদটীকা - 0.625em (16 x 0.625 = 10)
ঐতিহ্য ভুলে যাবেন না!
কিন্তু যে সব ems আছে না। আপনি মনে রাখতে হবে যে অন্য জিনিস তারা পিতামাতার আকার নিতে। তাই যদি আপনার ফন্টের বিভিন্ন আকারের নীচের উপাদান থাকে তবে আপনার প্রত্যাশার চেয়ে ছোট বা বড় একটি ফন্টের সাথে আপনি শেষ করতে পারেন।
উদাহরণস্বরূপ, আপনার কাছে স্টাইল শীট থাকতে পারে:
পি {ফন্ট সাইজ: 0.875em; }.footnote {font-size: 0.625em; }
এটি মূল পাঠ্য এবং পাদটীকাগুলির জন্য যথাক্রমে 14px এবং 10px ফন্টের ফলস্বরূপ হবে। কিন্তু যদি আপনি একটি অনুচ্ছেদের ভিতরে একটি পাদটীকা রাখেন, তবে আপনি 10px এর পরিবর্তে 8.75px পাঠ্যটি শেষ করতে পারেন। এটি নিজে চেষ্টা করুন, উপরে দেওয়া CSS এবং নিম্নলিখিত HTML টি একটি নথিতে রাখুন:
এই ফন্টটি উচ্চতা 14px বা 0.875 ems হয়।এই অনুচ্ছেদের এটি একটি পাদটীকা আছে।এই শুধু একটি পাদটীকা অনুচ্ছেদ যদিও।
পাদটীকা পাঠ্যটি 10px এ পড়তে কঠিন, এটি 8.75px এ প্রায় অসামঞ্জস্যপূর্ণ।
সুতরাং, যখন আপনি ems ব্যবহার করছেন, তখন আপনাকে প্যারেন্ট অবজেক্টের মাপের বিষয়ে খুব সচেতন থাকা দরকার, অথবা আপনার পৃষ্ঠার কিছু অসাধারণ আকারের উপাদানগুলি শেষ হয়ে যাবে।
