Menu

مقالات

22

واحدهای اندازه گیری vh و vw عناصر صفحه وب سایت را متناسب با محدوده نمایش کاربر بدون استفاده از جاوااسکریپت نشان میدهد.به طور معمول در طراحی صفحات ریسپانسیو از واحدهای درصد استفاده می کنیم .در برخی مواقع ترجیح می دهیم که سایز یک قسمت را بر حسب سایز پنجره مرورگر مشخص کنیم بنابراین می توانیم این واحدها را به کار ببریم.

 

معرفی واحدهای vm و vw

واحد vh برابر با یک صدم (0.01) ارتفاع مرورگر و واحد vw برابر یک صدم (0.01) پهنای مرورگر است که به طور مثال اگر اندازه مانیتور ما 1080*1920 باشد 1vw مساوی خواهد بود با 19.2 پیکسل و 1vh مساوی با 10.8 پیکسل خواهد شد.برای مثال اگر بخواهیم یک عنصر کل صفحه مانیتور را دربربگیرد بایستی کد زیر را استفاده کنیم:

.cms-iran{

width:100vw;

height:100vh;

}

این دو واحد را برای هر پراپرتی در css می توانید به کار ببرید.

معرفی واحد های vmax و vmin

واحدهای vh و vw به طول و عرض مرورگر وابسته هستند و واحدهای vmin و vmax کوچکترین و بزرگترین اندازه از بین طول و عرض مرورگر را مشخص می کنند.به عنوان مثال اگر عرض مرورگر برابر 1900 پیکسل و ارتفاع آن برابر 1000 پیکسل باشد vmin آن برابر 19 و vmax آن برابر 10 است و حال اگر اندازه مرورگر را تغییر دهیم و عرض آن برابر 700 و ارتفاع آن برابر 300 باشد vmin و vmax آن به ترتیب برابر 7 و 3 خواهد بود.این حالت برای زمانی است که به طور مثال کاربر گوشی خود را بچرخاند و از حالت از عمودی به افقی تغییر دهد.

و به طور کلی :

vmin یعنی 1 واحد vh  یا vw می باشد ( هر واحدی که کوچکتر باشد )

vmax یعنی 1 واحد vh  یا vw می باشد ( هر واحدی که بزرگتر باشد )


 

 

عملیات: ایمیل | لینک مستقیم |