បញ្ជី

ការរចនាបញ្ជី (CSS Lists)

បញ្ជី (<ul> និង <ol>) មិនត្រឹមតែប្រើសម្រាប់បង្ហាញទិន្នន័យរាយមុខនោះទេ ប៉ុន្តែវាត្រូវបានគេយកទៅកែច្នៃធ្វើជារបារបញ្ជាទិស (Navigation Menu) ដ៏ស្រស់ស្អាតផងដែរ តាមរយៈ CSS។

១. ការផ្លាស់ប្តូរសញ្ញាចុច (List Style Type)

អ្នកអាចប្តូរសញ្ញាចំណុចខ្មៅៗ (Bullets) នៅពីមុខបញ្ជីអោយទៅជាទម្រង់ផ្សេងៗបានតាមរយៈ list-style-type។

• none : ពេញនិយមបំផុត! លុបសញ្ញាចុចខ្មៅនោះចោល ដើម្បីយកបញ្ជីទៅធ្វើជា Menu។
• circle : រង្វង់ប្រហោងក្នុង
• square : ការ៉េ
• upper-roman : លេខរ៉ូម៉ាំងធំ (I, II, III) សម្រាប់ <ol>

២. ការប្រើប្រាស់រូបភាពធ្វើជាសញ្ញាចុច (List Style Image)

បើអ្នកមិនពេញចិត្តនឹងសញ្ញាចុចធម្មតាទេ អ្នកអាចយករូបភាពតូចៗ ឬ Icons មកដាក់ជំនួសបាន ដោយប្រើ list-style-image: url('...');។

៣. ការដកគម្លាតខាងឆ្វេង (Remove Default Padding)

តាមលំនាំដើម Browser តែងតែរុញបញ្ជី (<ul>) ចូលទៅខាងស្តាំបន្តិច (Padding-left: 40px) ដើម្បីអោយមានកន្លែងទុកដាក់សញ្ញាចុច។ ប្រសិនបើអ្នកលុបសញ្ញាចុចនោះចោល (none) អ្នកក៏គួរតែលុប Padding និង Margin របស់វាចោលដែរ!