តំណជំហាន

ឧទាហរណ៍

 
<nav class="cgds" aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="#"><i class="bi bi-house"></i>ទំព័រដើម</a></li>
    <li class="breadcrumb-item"><a href="#">បណ្ណាល័យ</a></li>
    <li class="breadcrumb-item active" aria-current="page">ទិន្នន័យ</li>
  </ol>
</nav>

        

ធាតុផ្សំ

1. រូបតំណាង៖ ដាក់សម្រាប់តំណាងឱ្យផ្នែកណាមួយរបស់ទំព័រអមជាមួយឈ្មោះរបស់វាដើម្បីឱ្យអ្នកប្រើប្រាស់ងាយស្រួលចំណាំ។
2. ទំព័រដើម៖ នេះជាធាតុដំបូងបង្អស់របស់គ្រប់តំណជំហាននៃគេហទំព័រទាំងអស់។
3. បំណែងចែក៖ ខណ្ឌធាតុនីមួយៗរបស់តំណជំហានឱ្យដាច់ចេញពីគ្នា។
4. ឈ្មោះទំព័រ៖ វាប្រាប់អ្នកប្រើប្រាស់ឱ្យដឹងថាទំព័រដែលគាត់កំពុងស្ថិតនៅជាធាតុរបស់ទំព័រគោលណាខ្លះ ហើយឈ្មោះទំព័រភ្ជាប់ជាមួយបញ្ជាប់នៃទំព័រគោលទាំងនោះ។

គម្លាត

នៅក្នុងតំណជំហាន
រក្សាគម្លាតយ៉ាងតិច 8px នៅលើអ័ក្សដេកចន្លោះធាតុនីមួយៗរបស់តំណជំហាន។

គោលការណ៍ណែនាំនៃការប្រើប្រាស់

តំណជំហានគួរប្រើប្រាស់នៅពេល៖

1. ដើម្បីឱ្យអ្នកប្រើប្រាស់ងាយស្រួលស្វែងរកទំព័រណាមួយនៅក្នុងគេហទំព័ររបស់អ្នក និងប្រាប់គាត់ថាពេលបច្ចុប្បន្នពួកគាត់កំពុងនៅលើទំព័រណា។
2. ជួយអ្នកប្រើប្រាស់ឱ្យងាយស្រួលឆ្លងទៅកាន់ទំព័រផ្សេងៗដែលនៅពីលើនិងក្រោមគ្នា។

តំណជំហានមិនគួរប្រើប្រាស់នៅពេល៖

1. យើងមិនណែនាំការប្រើប្រាស់តំណជំហានដើម្បីជំនួសរបារខាងលើនោះទេ។
2. ពេលបង្ហាញអំពីភាគរយនៃដំណើរការអ្វីមួយ ឧទាហរណ៍ភាគរយនៃដំឡើងឯកសារ។ ករណីនេះគួរប្រើរបា​រវឌ្ឍនភាពជំនួសវិញ។

គោលការណ៍ណែនាំនៃការរចនា

រចនាជាមួយឈ្មោះទំព័រពេញ
ធាតុរបស់តំណជំហានគួរតែប្រើឈ្មោះពេញ និងដូចទៅនឹងទំព័រដែលបញ្ជាប់នាំទៅ។

ផ្តល់ទំហំឱ្យបានត្រឹមត្រូវ
ជាទូទៅឈ្មោះទំព័រនៅក្នុងតំណជំហានមានទំហំតូច តែទោះយ៉ាងណាគួរលៃកុំឱ្យវាតូចពេកដើម្បីចៀសវាងការចុចមិនបាន។

ខ្នាតសម្រាប់រចនា

$breadcrumb-font-size: null !default;
$breadcrumb-padding-y: 0 !default;
$breadcrumb-padding-x: 0 !default;
$breadcrumb-item-padding-x: .5rem !default;
$breadcrumb-margin-bottom: 1rem !default;
$breadcrumb-bg: null !default;
$breadcrumb-divider-color: $gray-600 !default;
$breadcrumb-active-color: $highlight !default;
$breadcrumb-divider: quote("/") !default;
$breadcrumb-divider-flipped: $breadcrumb-divider !default;
$breadcrumb-border-radius: null !default;