طراحی ریسپانسیو وب – ویدیو
یادگیری CSS
تعداد بازدید :
1731
تاریخ و ساعت انتشار :
چهار شنبه 30 خرداد 1397 21:49
استفاده از ویژگی width
اگر ویژگی width 100٪ تنظیم شده باشد، پخش کننده ویدیویی ریسپانسیو خواهد بود
ویژگی width
video {
width: 100%;
height: auto;
}
مشاهده مثالتوجه داشته باشید که در مثال بالا، پخش کننده ویدیویی می تواند بزرگتر از اندازه اصلی آن باشد. در بسیاری از موارد یک راه حل بهتر، استفاده از ویژگی max-width است.
استفاده از ویژگی max-width
ویژگی max-width
video {
max-width: 100%;
height: auto;
}
مشاهده مثالیک ویدیو را به صفحه مثال وب اضافه کنید
ما می خواهیم یک ویدیو در صفحه وب ما مثال بزنیم. این ویدیو تغییر خواهد کرد تا همیشه فضای موجود را پر کند.
اضافه کردن ویدیو به مثال وب
video {
width: 100%;
height: auto;
}
مشاهده مثال
نظر شما
>