مدیریت سرریز و اسکرول
با ماوس، لمس و صفحه کلید آزمایش کنید. برای رسیدن به کادرهای قابل اسکرول از Tab استفاده کنید.
visible؛ نمایش بیرون از کادر
این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید.
hidden؛ برش بدون نوار اسکرول
scroll؛ حالت اسکرول
این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید.
auto؛ اسکرول در صورت نیاز
این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید.
clip؛ برش بدون ساخت کادر اسکرول
این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید.
جدول عریض
در صفحه باریک، جدول را افقی حرکت دهید. کل صفحه نباید اسکرول افقی بگیرد.
| درس | موضوع | نوع تمرین | وضعیت |
|---|---|---|---|
| 31 | حالت تعاملی | پروژه عملی | آماده تمرین |
| 32 | شبه عناصر | پروژه عملی | آماده تمرین |
| 33 | انتخاب ساختاری | پروژه عملی | آماده تمرین |
| 34 | مدیریت سرریز | پروژه عملی | آماده تمرین |
شکستن رشته بلند
https://example.com/very-long-unbroken-reference-abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz
عنوان تک خطی
این یک عنوان طولانی برای مشاهده سه نقطه در انتهای کادر است؛ با باریک کردن صفحه نتیجه را ببینید.
نسخه کامل عنوان در همین پروژه و کد HTML موجود است؛ برای اطلاعات ضروری در محصول واقعی مسیر دسترسی به متن کامل طراحی کنید.
تمرین مستقل
بدون تغییر متن، کادر زیر را قابل اسکرول کنید. سپس متن را کوتاه کنید و نتیجه را مقایسه کنید.
این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید. این متن نمونه از ارتفاع کادر بیشتر است. با اسکرول می توانید ادامه متن را بخوانید و تفاوت رفتار کادرها را مقایسه کنید.