HTML5 គឺជាជំនាន់ទី 5 របស់ HTML ដែលមានពាក្យពេញថា Hyper Text Markup Language ដែលប្រើសំរាប់បង្កើតគ្រោងឆ្អឹងរបស់គេហទំព័រ ហើយនៅក្នុង HTML5 មានស្លាក (Tag) ជាច្រើនប្រើសំរាប់បង្កើតគេហទំព័រមានដូចជា ៖ <div>, <section>, <table>,<span> … ។ល។ ប៉ុន្តែថ្ងៃនេះ TechFree សូមបង្ហាញអំពីការប្រើប្រាស់ស្លាកមួយរបស់ HTML5 គឺ <section></section> ។
ស្លាក<section> គឺប្រើដើម្បីបង្ហាញបញ្ជាក់ពីផ្នែកនីមួយៗនៅក្នុងការសរសេរកូដ ដូចជា ផ្នែកខាងលើ (Header), ផ្នែកខាងក្រោម (Footer) និងផ្នែកផ្សេងៗជាច្រើនទៀតដើម្បីឲ្យមានភាពងាយស្រួលក្នុងការមើលនិងមានរបៀបរៀបរយក្នុងការសរសេរកូដក្នុងផ្នែកនីមួយៗ ។
១) កូដនៃ index.html
នៅក្នុងរូបភាពនេះបានបង្ហាញអំពីផ្នែកនីមួយៗនៃ section ដែលយើងប្រើដើម្បីបង្កើតរូបរាងនៃគេហទំព័រ។
ក្នុងរូបភាពនេះផងដែរយើងខ្ញុំបានសរសេរកូដដោយប្រើប្រាស់ជាមួយនឹងពាក្យបង្ហាញនៃប្លុក section ដែលជាកូដមិនដំនើរការ រឺ ហៅថា comment ដើម្បីពន្យល់លោកអ្នកអំពីផ្នែក រឺ ប្លុក (Blog) នៃគេហទំព័រ ។
ខាងក្រោមនេះជាគំរូមួយនៃ section នៅក្នុង index.html :
២) កូដនៃ style.css
ខាងក្រោមនេះជាកូដ របស់ style.css សំរាប់ធ្វើការរចនា (style) របស់ផ្នែកនីមួយៗដែលយើងបានសរសេររួចនៅខាងលើដើម្បីបង្ហាញរូបរាងគេហទំព័រទៅតាមអ្វីដែលយើងចង់បាន។
- .container គឺជា class មួយដែលយើងប្រើដើម្បីក្ដោបគេហទំព័ររបស់យើងទាំងមូល
- .header គឺជា class មួយដែលយើងប្រើសំរាប់រចនាផ្នែកខាងលើនៃគេហទំព័រ (header)
- h2 គឺជាការរចនាអក្សរនៅក្នុងស្លាក <h2></h2>
- .menu គឺជា class មួយសំរាប់រចនាក្បាលបញ្ជី (Menu)
- .menu > ul > li ប្រើសំរាប់រចនាអក្សរដែលនៅក្នុងបញ្ជី (Menu)
- .body គឺជា class មួយសំរាប់រចនាខ្លួននៃគេហទំព័រ (Body) ដែលជាកន្លែងផ្ទុកទិន្នន័យធំជាងគេ
- .footer គឺជា class មួយសំរាប់រចនាផ្នែកខាងក្រោមនៃគេហទំព័រ (Footer)
៣) លទ្ធផល
ក្រោយពីបញ្ចប់ការសរសេរកូដរួចមកយើងនឹងបានលទ្ធផលដូចខាងក្រោម ៖