ការបង្ហាញ
របៀបបង្ហាញខ្លួន (CSS Display)
Property display គឺជា "ចៅហ្វាយនាយ" ដែលកំណត់ពីអត្តចរិតរបស់ Element នីមួយៗនៅលើគេហទំព័រ។ អ្នកអាចប្រើ CSS ដើម្បីប្តូរអត្តចរិតរបស់ Element ណាមួយក៏បាន ឧទាហរណ៍ ប្តូរពី Inline (ធាតុរួសរាយ) ទៅជា Block (ធាតុផ្តាច់មុខ)។
១. តម្លៃសំខាន់ៗទាំង ៤ របស់ Display
display: block;: ធ្វើអោយ Element នោះស៊ីទំហំទទឹង ១០០% ពេញ និងបង្ខំអោយអ្នកផ្សេងធ្លាក់ទៅបន្ទាត់ថ្មី ដូចជា<div>។ (អស្ចារ្យណាស់ ក្នុងការប្តូរ Link ធម្មតា អោយទៅជាប៊ូតុងធំៗ)។display: inline;: ធ្វើអោយ Element តូចស៊ីកន្លែងតែបន្តិច និងនៅជួរជាមួយគេបាន ដូចជា<span>។ (ចំណាំ៖ អ្នកមិនអាចកំណត់កម្ពស់ ឬទទឹងអោយវាបានទេ!)display: inline-block;: ពិសេសបំផុត! វាស្ថិតនៅកណ្តាលរវាង Block និង Inline។ វាអាចរស់នៅក្បែរអ្នកដទៃលើបន្ទាត់តែមួយបាន (ដូច Inline) ហើយអ្នកក៏អាចកំណត់កម្ពស់និងទទឹងអោយវាបានដែរ (ដូច Block)។ គេប្រើវាសម្រាប់តម្រៀបប្រអប់រូបភាពជាជួរ។display: none;: បំបាត់ខ្លួន! លាក់ Element នោះមិនអោយអ្នកណាមើលឃើញ ហើយក៏មិនស៊ីកន្លែងនៅលើអេក្រង់ដែរ (ដូចជាមិនធ្លាប់មានវាអញ្ចឹង)។
២. ភាពខុសគ្នារវាង display: none និង visibility: hidden
សំនួរនេះតែងតែចេញរាល់ពេលប្រឡងចូលធ្វើការ!
display: none;: លាក់បាត់ស្រមោល ហើយ ទុកចន្លោះប្រហោងនោះអោយអ្នកផ្សេងមកនៅជំនួស។visibility: hidden;: លាក់បាត់ស្រមោល តែ នៅតែកាន់កាប់កន្លែងទំនេរនោះដដែល (ទុកជាកន្លែងទទេរ) អ្នកផ្សេងមិនអាចចូលមកជំនួសបានទេ។
បច្ចេកវិទ្យាថ្មីបំផុត (Flexbox)៖ បច្ចុប្បន្ន អ្នកអភិវឌ្ឍន៍លែងសូវប្រើ
inline-block ដើម្បីតម្រៀបប្រអប់ជាជួរទៀតហើយ គេងាកទៅប្រើ display: flex; វិញ ព្រោះវាមានឥទ្ធិពលខ្លាំងជាងរាប់សិបដងក្នុងការរៀបចំ Layout។ អ្នកនឹងបានរៀនវានៅវគ្គបន្ទាប់!