CSS3 يمنحنا وحدات ذات منفذ عرض. 100vw تعني 100٪ من عرض منفذ العرض. 100vh ؛100٪ من الارتفاع.
هل 100vh هو نفسه 100٪؟
على سبيل المثال ، يمكن أن تكون وحدات منفذ العرض مفيدة عند محاولة إنشاء مجموعة متساوية الارتفاع / العرض من العناصر. … في المقابل ، الارتفاع:100vh سيكون 100٪ من ارتفاع منفذ العرضبغض النظر عن مكان وجود العنصر في DOM.
ماذا يعني VH في CSS؟
vh & vw. vh تعنيارتفاع منفذ العرضو vw لعرض منفذ العرض. ومن ثم ، فإن تعيين عنصر على قيمة عرض 50vw يعني أن عرض العنصر سيكون 50٪ من حجم منفذ العرض ، ويظل هذا صحيحًا عند تغيير حجم إطار العرض.
كيف يمكنني تغيير طولي إلى 100vh؟
ارتفاع: 100vh ؛ يعني ارتفاعلهذا العنصر يساوي 100٪ من ارتفاع منفذ العرض. مثال: الارتفاع: 50vh ؛ إذا كان ارتفاع شاشتك 1000 بكسل ، فسيكون ارتفاع العنصر مساويًا لـ 500 بكسل (50٪ من 1000 بكسل). الارتفاع: احسب (100٪ - 100 بكسل) ؛ سيحسب حجم العنصر باستخدام قيمة العنصر.
لماذا لا يعمل الارتفاع بنسبة 100٪؟
إذا كنت ستحاول ضبط ارتفاع حاوية div على 100٪ من نافذة المتصفح باستخدام ارتفاع قاعدة النمط: 100٪ ؛ لا يعمل ، لأن النسبة المئوية (٪) هيوحدة نسبيةلذا فإن الارتفاع الناتج يعتمد على ارتفاع ارتفاع العنصر الأصل.
