العرض والارتفاع
<div class="w-64">عرض ثابت (16rem)</div>
<div class="w-full">عرض كامل</div>
<div class="w-1/2">نصف العرض</div>
<div class="h-32">ارتفاع ثابت</div>
<div class="h-screen">ارتفاع الشاشة كاملًا</div>
الحدّ الأقصى والأدنى
<div class="max-w-md">حدّ أقصى متوسّط</div>
<div class="max-w-3xl mx-auto">حاوية محتوى متوسّطة موسّطة</div>
<div class="min-h-screen">أقلّ ارتفاع = الشاشة</div>
أحجام شائعة
w-full، w-screen، w-1/2، w-1/3، w-64، max-w-sm/md/lg/xl/2xl.
مربّع متساوي
<div class="w-16 h-16 rounded-full bg-purple-500"></div>
مثال: بطاقة بعرض محدود
<div class="max-w-sm mx-auto p-6 bg-white rounded-xl shadow">
بطاقة
</div>
🎯 التالي: الطباعة (Typography).