CSS এ Unit কি?
CSS Style দিয়ে HTML Elements, Id এবং class গুলোর উপর width এবং height প্রকাশ করার মাধ্যম কে CSS Unit বলা হয়। অনেক CSS Porperty length ভ্যালু নেয়, যেমন- width, height, margin, padding, font-size, border-width ইত্যাদি। Unit একটি নম্বর যা বিভিন্ন length এর একক অনুসরন করে, যেমন 10px, 2em ইত্যাদি। Unit ও length মধ্যে কোনো হোয়াইট স্পেস হবে না। যদি মান শূন্য হয় তাহলে ইউনিট এটিকে উপেক্ষা করতে পারে। তবে কিছু CSS Property এর জন্য, Negative মান গ্রহনযোগ্য।
CSS এ দু’ধরনের লেন্থ ইউনিট রয়েছেঃ Relative এবং Absolute.
CSS Relative Lengths
Relative Length বলতে এক Length এর সাথে অন্য Length এর Property মিল বুঝায়। Relative Length Unit পরিমাপের বিভিন্ন অনুবাদের ক্ষেত্রে ভালো।
ইউনিট | বর্ননা |
---|
em | এলিমেন্টের font-size এর সাথে সম্পর্কযুক্ত (2em অর্থ 2 বার বর্তমান ফন্টের আকার) |
ex | বর্তমান ফন্ট x-height এর সাথে সম্পর্কযুক্ত (কম ব্যবহৃত) |
ch | “0” (শূন্য) প্রস্থের সাথে সম্পর্কযুক্ত |
rem | রুট(Root) এলিমেন্টের font-size এর সাথে সম্পর্কযুক্ত |
vw | ভিউপোর্ট*(viewport*) এর 1% প্রস্থের সাথে সম্পর্কযুক্ত। |
vh | ভিউপোর্ট*(viewport*) এর 1% উচ্চতার সাথে সম্পর্কযুক্ত। |
vmin | ভিউপোর্ট*(viewport*) এর 1% ছোট ডাইমেনসনের(dimension) সাথে সম্পর্কযুক্ত। |
vmax | ভিউপোর্ট*(viewport*) এর 1% বড় ডাইমেনসনের(dimension) সাথে সম্পর্কযুক্ত। |
% | |
নোটঃ em এবং rem ইউনিট পুরোপুরি আকার পরিবর্তনযোগ্য layout তৈরিতে ব্যবহার হয়!
* Viewport = ব্রাউজার উইন্ডো সাইজ। যদি ভিউপোর্ট ৫০ সে.মি. প্রস্থ হয়, 1vw = ০.৫ সে.মি.
CSS Absolute Length
Absolute Length এর ইউনিট fixed এবং এর দৈর্ঘ্য তার ঠিক প্রকৃত সাইজেই হবে।
Absolute Length স্ক্রিনের জন্য ব্যবহার করা হয়না , কারন স্ক্রিন সাইজ পরিবর্তনশীল। আউটপুট মিডিয়াম জানা থাকলে এটি ব্যবহার করা যেতে পারে। যেমন প্রিন্ট layout এর জন্য ব্যবহার করা যায়।
ইউনিট | বর্ননা |
---|
cm | সেন্টিমিটার(centimeters) |
mm | মিলিমিটার(millimeters) |
in | ইঞ্চি(inches) (1in = 96px = 2.54cm) |
px * | পিক্সেল(pixels) (1px = 1/96th of 1in) |
pt | পয়েন্ট(points) (1pt = 1/72 of 1in) |
pc | পিকাস(picas) (1pc = 12 pt) |
ডিভাইস ভিউয়ের সাথে পিক্সেল সম্পর্কযুক্ত। low-dpi ডিভাইসের জন্য, 1px হলো ডিসপ্লের এক ডিভাইস পিক্সেল। প্রিন্টার ও উচ্চ রেজুলেশন স্ক্রিনের জন্য 1px বলতে মাল্টিপল ডিভাইস পিক্সেল বোঝায়।