របៀបប្រើប្រាស់ Bootstrap កាត (Card)

កាត (Card) គឺជាផ្ទាំងមួយដែលផ្ទុកនូវមាតិកានិងពត៌មានផ្សេងៗស្ដីអំពីមនុស្ស រឺ ទីកន្លែងអ្វីមួយសំរាប់ជាការសំគាល់ រឺទុកជាពត៌មានដើម្បីផ្សព្វផ្សាយទៅដល់មនុស្សជាច្រើនបានដឹង ។ថ្ងៃនេះ TechFree សូមបង្ហាញនូវការបង្កើតនិងប្រើប្រាស់កាតនេះនៅលើគេហទំព័រដែលប្រើជាមួយនឹងបណ្ណាល័យ CSS គឺ Bootstrap ។

កាតគឺត្រូវមានផ្នែកខាងលើដែលជាកន្លែងដាក់នូវឈ្មោះ រឺចំណងជើង ហើយមានផ្នែកកណ្ដាលជាកន្លែងដាក់នូវរូបភាពនិងសរសេររៀបរាប់អំពីចំណងជើងខាងលើ និងចុងក្រោយមានផ្នែកខាងក្រោមគឺជាកន្លែងសរសេរអំពីអាស័យដ្ឋាន រឺ ការទំនាក់ទំនងដូចជាលេខទូរសព្ទជាដើម ។

១) ការសរសេកូដ Bootstrap

ដោយកាតនេះគឺមិនមាននៅក្នុង Bootstrap ជំនាន់ទី៣ដែលយើងប្រើសព្វថ្ងៃទេ ប៉ុន្តែវាស្ថិតនៅក្នុង Bootstrap ជំនាន់ទី៤ ។ ជំនាន់ទី៤គឺមិនទាន់ចេញជាផ្លូវការនៅឡើយទេ ក៏ប៉ុន្តែយើងអាចប្រើប្រាស់វាបាន ។សូមមើលកូដខាងក្រោម ៖

សូម ចុចទីនេះ ដើម្បីមើលប្រភពនៃកូដខាងលើ។

២) ការសរសេរកូដរចនា

បន្ទាប់ពីយើងសរសេរកូដទាញយកបណ្ណាល័យរួចរាល់ហើយនោះគឺយើងត្រូវធ្វើការរចនាកាតដែលយើង

ចង់បាន ។សូមមើលកូដខាងក្រោម ៖

    – index.html

     – style.css

៣) លទ្ធផលនៃកូដ

ក្រោយពីសរសេរកូដរួចមកយើងនឹងឃើញនូវលទ្ធផលដូចខាងក្រោម ៖

ចែករំលែក​អត្ថបទនេះទៅកាន់៖

Exit mobile version