استفاده از خاصیت width
با تنظیم خاصیت width به ۱۰۰٪، پخشکننده ویدیو به صورت واکنشگرا عمل کرده و اندازه آن با تغییر اندازه صفحه تغییر خواهد کرد:
مثال:
video {
width: 100%;
height: auto;
}در این مثال، پخشکننده ویدیو میتواند بزرگتر از اندازه اصلی ویدیو شود. در بسیاری از موارد، استفاده از خاصیت max-width راهحل بهتری است تا ویدیو از اندازه اصلی خود بزرگتر نشود.
استفاده از خاصیت max-width
اگر خاصیت max-width روی ۱۰۰٪ تنظیم شود، پخشکننده ویدیو در صورت نیاز کوچک میشود اما هرگز از اندازه اصلی ویدیو بزرگتر نخواهد شد:
مثال:
video {
max-width: 100%;
height: auto;
}افزودن ویدیو به صفحه وب
میخواهیم یک ویدیو به صفحه وب خود اضافه کنیم که اندازه آن همیشه فضای موجود را پر کند:
مثال:
video {
width: 100%;
height: auto;
}این روش باعث میشود ویدیو بهطور خودکار با عرض صفحه سازگار شود و بدون تغییر نسبت ابعاد، به درستی مقیاسبندی شود.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام