ইউনিট Relative Lengths উদাহরণ পেজ
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
p {
font-size: 16px;
line-height: 2em;
}
div {
font-size: 30px;
border: 1px solid teal;
}
span {
font-size: 0.5em;
}
</style>
</head>
<body>
<p>এই প্যারাগ্রাফ গুলোর line-height calculate করা আছেঃ ২*১৬ পিক্সেল = ৩২ পিক্সেল। </p>
<p>এই প্যারাগ্রাফ গুলোর line-height calculate করা আছেঃ ২*১৬ পিক্সেল = ৩২ পিক্সেল।</p>
<p>এই প্যারাগ্রাফ গুলোর line-height calculate করা আছেঃ ২*১৬ পিক্সেল = ৩২ পিক্সেল।</p>
<div> Div এলিমেন্ট এর font-size ৩০ পিক্সেল করা হয়েছে। <span>Div এলিমেন্ট এর ভেতরে span এলিমেন্ট এর font-size ০.৫em যেটি ০.৫*৩০=১৫ পিক্সেলের সমান।</span> </div>
</body>
</html>
ফলাফল
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
div {
font-size: 30px;
border: 1px solid teal;
}
span {
font-size: 1ex;
}
</style>
</head>
<body>
<div> Div এলিমেন্ট এর font-size ৩০ পিক্সেল করা হয়েছে। <span>Div এলিমেন্ট এর ভেতরে span এলিমেন্ট এর font-size ১ex। </span></div>
</body>
</html>
ফলাফল
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-size: 20vw;
}
</style>
</head>
<body>
<h1>SATT</h1>
<p> ব্রাউজারের উইন্ডোর width এর মাপ পরিবর্তন করুন h1 এর font-size কিভাবে পরিবর্তন হয় সেটা দেখার জন্য। </p>
<p> viewport এর width 1vw = 1%।</p>
<p> vw unit আই ই ৮ এবং আগের ভার্সনে সাপোর্ট করে না। </p>
</body>
</html>
ফলাফল
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-size: 20vh;
}
</style>
</head>
<body>
<h1>SATT</h1>
<p> ব্রাউজারের উইন্ডোর width এর মাপ পরিবর্তন করুন h1 এর font-size কিভাবে পরিবর্তন হয় সেটা দেখার জন্য।</p>
<p>viewport এর width 1vw = 1%।</p>
<p>vw unit আই ই ৮ এবং আগের ভার্সনে সাপোর্ট করে না। </p>
</body>
</html>
ফলাফল
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-size: 15vmin;
}
</style>
</head>
<body>
<h1>SATT</h1>
<p> ব্রাউজারের উইন্ডোর width and height দুটিরি মাপ পরিবর্তন করুন h1 এর font-size কিভাবে পরিবর্তন হয় সেটা দেখার জন্য।</p>
<p>1vmin = 1vw or 1vh, যেটি অপেক্ষাকৃত ছোট।</p>
<p>vmin unit আই ই ৮ এবং আগের ভার্সনে সাপোর্ট করে না।</p>
</body>
</html>
ফলাফল
animatable এর উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-size: 15vmax;
}
</style>
</head>
<body>
<h1>SATT</h1>
<p>ব্রাউজারের উইন্ডোর width and height দুটিরি মাপ পরিবর্তন করুন h1 এর font-size কিভাবে পরিবর্তন হয় সেটা দেখার জন্য।</p>
<p>1vmax = 1vw অথবা 1vh, যেটি অপেক্ষাকৃত বড়।
<p> vmax unit ইন্টানেট এক্সপ্লোরার এবং সাফারি সাপোর্ট করে না। </p>
</body>
</html>
ফলাফল