Video Width Versus Max Widthالعرض الكامل والأقصى للفيديو
تعلّم بناء مشغلات الفيديو والإطارات المضمنة المتجاوبة في CSS عبر موازنة العرض الأقصى والعرض الكامل، وتثبيت النسبة السينمائية القياسية لمنع تشوه الأبعاد، واحتواء الفيديو داخل البطاقات على جميع الأجهزة.
3 صفوف تعليمية
لغة CSS
3,929 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
يحدد الاختيار بين width: 100% و max-width: 100% طريقة تصرف مشغل الفيديو على الشاشات المكتبية الواسعة:
القاعدة max-width: 100%; height: auto;: تقلص المشغل على الهواتف وتمنعه من التمدد فوق عرضه الأصلي المسجل، مما يحمي المقاطع القصيرة ذات الدقة المحدودة من التكبير الضبابي.
القاعدة width: 100%; height: auto;: تمدد مشغل الفيديو عالي الدقة ليملأ كامل عرض عمود المحتوى بنسبة 100% صعوداً وهبوطاً بتناسق تام.
الصف 2
صورة توضيحية
الصف 3
ملاحظة هامة
جميع فقرات هذا الدرس (فيديو متجاوب مع جميع الأجهزة في لغة CSS)
