តើ CSS Overflow មានតួនាទីយ៉ាងដូចម្តេច?
CSS overflow ត្រូវបានគេប្រើសំរាប់កំណត់ របៀបបង្ហាញអត្ថបទក្នុងទ្រង់ទ្រាយណាមួយ។ តាមរយៈCSS overflow គេអាចកំណត់របៀបបង្ហាញអត្ថបទ៖ អោយបង្ហាញទាំងអស់ ឬមិនបង្ហាញអត្ថបទណាដែលហួសដែនដែលបានកំណត់ ឬបង្ហាញរបារសំរាប់ទាញមើលអត្ថបទទាំងអស់។
លក្ខណៈសម្បត្តិ overflow មានតម្លៃដូចខាងក្រោម៖
- visible – លំនាំដើម (default)។ ប្រើសំរាប់បង្ហាញអត្ថបទទាំងអស់។
- hidden -មិនបង្ហាញអត្ថបទណាដែលវែងហួសដែនដែលបានកំណត់។
- scroll -បង្ហាញរបារសំរាប់ទាញមើលអត្ថបទទាំងអស់។
- auto -បង្ហាញរបារសំរាប់ទាញមើលអត្ថបទប្រសិនបើអត្ថបទណាដែលវែងហួសដែនដែលបានកំណត់។
# Visible
តាមលំនាំដើម, overflow គឺអាចមើលឃើញមានន័យថាវាមិនត្រូវបានខ្ទាស់ហើយវាបង្ហាញនៅខាងក្រៅប្រអប់ធាតុនេះ។ សូមមើលឧទាហរណ៍ខាងក្រោម៖
នោះនឹងបង្ហាញលទ្ធផលដូចខាងក្រោម៖
# Hidden
ជាមួយនឹងតម្លៃ hidden, overflow ត្រូវបានខ្ទាស់, ហើយអត្ថបទដែលនៅសល់ត្រូវបានលាក់។ សូមមើលឧទាហរណ៍ខាងក្រោម៖
នោះនឹងបង្ហាញលទ្ធផលដូចខាងក្រោម៖
# Scroll
ការកំណត់តម្លៃទៅជា scroll នោះ overflow ត្រូវបានខ្ទាស់និងរបាររមូរមួយត្រូវបានបន្ថែមទៅរមូរនៅក្នុងប្រអប់។ ចំណាំថាការវានឹងបន្ថែមរបាររមូរទាំងផ្ដេកហើយនិងបញ្ឈរ (ទោះបីជាអ្នកមិនត្រូវការវាក៏ដោយ)។ សូមមើលឧទាហរណ៍ខាងក្រោម៖
នោះនឹងបង្ហាញលទ្ធផលដូចខាងក្រោម៖
# Auto
តម្លៃ auto នេះគឺស្រដៀងគ្នាទៅនឹង scroll ដែរ, តែវាបន្ថែមរបាររមូរនៅពេលចាំបាច់។ សូមមើលឧទាហរណ៍ខាងក្រោម៖
នោះនឹងបង្ហាញលទ្ធផលដូចខាងក្រោម៖
# overflow-x ហើយនិង overflow-y
លក្ខណៈសម្បត្តិ overflow-x និង overflow-y គ្រាន់តែបញ្ជាក់ថាតើត្រូវប្តូរ overflow នៃអត្ថបទមួយទៅជាផ្ដេកឬបញ្ឈរ (ឬទាំងពីរ)៖
- overflow-x បញ្ជាក់ពីអ្វីដែលត្រូវធ្វើជាមួយនឹងគែមឆ្វេង / ស្តាំនៃអត្ថបទ។
- overflow-y បញ្ជាក់ពីអ្វីដែលត្រូវធ្វើជាមួយនឹងគែមលើ / ក្រោមនៃអត្ថបទ។
សូមមើលឧទាហរណ៍ខាងក្រោម៖
នោះនឹងបង្ហាញលទ្ធផលដូចខាងក្រោម៖
