menu

۷- کار با رسانه ها در Materialize

فریم ورک Materialize کلاس ها و استایل های زیبایی برای کار با رسانه ها در خود جای داده است. کلاس هایی برای ریسپانسیو سازی، تصویر دایره ای و مدیا پلیر (که شبیه مدیا پلیر دیفالت کروم هست). در این مقاله به شما کار با رسانه ها در Materialize را به طور کامل آموزش خواهیم داد.

عکس ها

شما می‌توانید با استفاده از این فریم ورک محبوب، استایل های تصاویرتان را به راحتی عوض کنید و آنها را ریسپانسیو کنید.

تصاویر ریسپانسیو

با استفاده از کلاس responsive-img می‌توانید تصویر مورد نظر را به راحتی ریسپانسیو کنید. این کلاس حد اکثر پهنای تصویر را ۱۰۰% و ارتفاع تصویر را برابر با auto می‌کند.

تصویر دایره ای

برای تغییر ظاهر تصاویر به تصویر دایره ای، کافی‌است کلاس circle به آنها دهید. برای مثال:


فیلم ها

برای استفاده از استایل ویدئو پلیر متریالایز باید یک کلاس مادر به نام video-container داشته باشیم. برای نمونه:

ویدئوی ریسپانسیو

برای ریسپانسیو کردن ویدئو هم میتوانید از کلاس responsive-video استفاده کنید. برای مثال:

 

 

رفتن به نوارابزار