ឧទាហរណ៍មួយនៃទំព័រ HTML មួយនិងគោលការណ៍ជាមូលដ្ឋាននៃ

បានបង្កើតភាសាជាច្រើនតែភាសារបស់ HTML ដែលនេះគឺជាផ្នែកមួយនៃការពិសេសនិង vosstrebovan បំផុត។ ចាប់តាំងពីវាពាក់ព័ន្ធនឹងការផ្តួចផ្តើមជាច្រើនផ្សេងទៀតនៅក្នុងការសរសេរកម្មវិធីសំខាន់មួយ។ ជាច្រើនត្រូវបានធ្វើឱ្យប្រើបាន, នៅពេលដែលនៅក្នុងគំនិតនៃចំណេះដឹងវត្តមានអភិវឌ្ឍភាសាតួលេខនេះ - Hypertext Markup Language (HTML) ។

ជាការពិតនៅក្នុង HTML, មិនមានអ្វីជាការលំបាក, និងនៅក្នុងប៉ុន្មាននាទីទាំងអស់ដែលបានឆ្ងាយបំផុតពីការសរសេរកម្មវិធីនិងប្រជាជនអ៊ីនធឺណិតនឹងបំពេញការបង្កើតទំព័រ HTML ក្នុង-កុំព្យូទ័រយួរដៃនេះ។ ឧទហរណ៍គួរឱ្យកត់សម្គាល់, ភាពសាមញ្ញ, ពិត, អាចចូលដំណើរការបានដើម្បីឱ្យមនុស្សគ្រប់គ្នា។

ការរៀបរាប់ទូទៅ

ឯកសារ HTML - វែបសាយត៍មួយទំព័រ, ទោះបីជានេះគឺជាការពិភាក្សា, ប៉ុន្តែអ្វីដែលជាការមួយក្នុងមួយទំព័រឯកសារសម្រាប់ការចាប់ផ្តើមវាជាការច្បាស់លាស់។

ឯកសារ HTML ចាប់ផ្តើមជាមួយនឹងបឋមកថា DOCTYPE មួយដែលបញ្ជាក់ថាប្រភេទនៃឯកសារដែលបាន - HTML ។ ធាតុទំព័រទាំងអស់ (ស្លាក) ត្រូវបានបង្ហាញនៅក្នុងតង្កៀបមុំ។ គូគ្នា ( "<" និង ">") រួមបញ្ចូលទាំងរបស់ HTML ស្លាកមួយ។ ជាធម្មតាស្លាក HTML ត្រូវបានគូ, គឺថាសម្រាប់រាល់«ស្លាក»មាន«ស្លាក / »។ ទាំងពីរត្រូវបានរុំព័ទ្ធដោយដង្កៀបមុំ។ ផ្លាស់ប្តូរទៅបន្ទាត់បន្ទាប់ - មានស្លាកតែមួយដែលមានការពេញនិយមបំផុត« br / »គឺជា។

ស្លាកធំបំផុតនៅក្នុងឯកសារ - វាខ្លួនខ្ញុំផ្ទាល់ HTML ដែលរួមបញ្ចូលតែពីរស្លាក: ក្បាលនិងរាងកាយ។ ក្នុងករណីជាលើកដំបូង, ការបញ្ជាក់ផ្សេងគ្នាដែលជាការបង្ហាញនៃតំណភ្ជាប់ទៅទំព័រផ្សេងទៀតទាក់ទងនឹងឯកសារដែលអាចនឹងកម្មវិធី PHP បច្ចុប្បន្ននិងស្គ្រីប JavaScript ។ នៅក្នុងមាតិកាដែលបានសរសេរក្នុងទំព័រទីពីរ។ ផងដែរនៅក្នុងសំណុំបែបបទនៃស្លាកនិងស្គ្រីប។

ទំព័រ HTML ដែលមានលក្ខណៈសាមញ្ញ

ឧទាហរណ៍នៃការបង្កើតទំព័រនេះត្រូវបានចង្អុលបង្ហាញនៅក្នុងបែបនេះអត្ថបទដូចខាងក្រោម។ ពិចារណាវាដោយប្រុងប្រយ័ត្ន។

ផ្នែកក្បាល

ស្លាកមេគោលបំណងក្បាល - ការពន្យល់ទូទៅនៃទំព័រនិងស្គ្រីបទូទៅទោះបីជាក្រោយមកទៀត - គ្រាន់តែជាគំនិតដែលទាក់ទង។ ជាធម្មតាវាមានយ៉ាងច្រើនដើម្បីយកចិត្តទុកដាក់តែពីររឿង:

• ពាក្យគន្លឹះនិងការរៀបរាប់នៃទំព័រនេះ;
• តំណទៅឯកសារផ្សេងទៀត (* .css និង .js *) ។

ដើម្បីបង្ហាញមាតិកានៃមាតិកាទំព័រនៃផ្នែកនេះមានសារៈសំខាន់ដោយប្រយោលដោយសារតែវាបានចង្អុលបង្ហាញតែកន្លែងដែលឯកសារមួយចំនួនផ្សេងទៀតមានច្បាប់ CSS សម្រាប់ស្លាកនិងភាសាស្គ្រីបផ្សេងទៀត។

HTML ដែលទំព័រមានចំណងជើង (TITLE) ដែលត្រូវបានបង្ហាញពេលអ្នកទស្សនានាំមកនូវការកណ្ដុររបស់អ្នកនៅលើផ្ទាំងដែលជាកន្លែងដែលទំព័រនេះត្រូវបានបើក។ នេះគឺជាការសំខាន់ពីព្រោះវាធ្វើឱ្យទំព័រជាច្រើនទៀតសមរម្យ, មានភាពងាយស្រួលក្នុងការនិយាយ, បានចុះហត្ថលេខាលើអត្ថបទដែលអាចអានបាន។

ស្លាកមេតាគឺមានសារៈសំខាន់ក្នុងការសរសេរកម្មវិធីបណ្ដាញទូទៅប៉ុន្តែនៅពេលដែលវាត្រូវបានតម្រូវឱ្យបង្កើតទំព័រ HTML ដែលកុំព្យូទ័រយួរដៃមួយនេះក្នុងគំរូនៃរចនាសម្ព័ន្ធទូលំទូលាយពង្រាយមិនចង់បានមួយ។

លើតំណភ្ជាប់នេះនិងតំណស្គ្រីបដែលគួរតែយកចិត្តទុកដាក់ពិសេស។ ដំបូងសំដៅទៅកន្លែងដែលមានគឺជាឯកសារសន្លឹករចនាប័ទ្ម CSS, លើកទីពីរមួយ - ទីតាំងនៃឯកសារ JavaScript-កូដ។ តំណភ្ជាប់បែបនេះអាចត្រូវបានកំណត់។

ប្រសិនបើអ្នកប្រើស្គ្រីបគួរតែត្រូវបានចាត់ទុកថាជាចំនេះដឹង HTML មួយនឹងក្លាយជារឹងមាំ, អ្នកគួរតែយកចិត្តទុកដាក់ភ្លាមនៅលើសន្លឹករចនាប័ទ្មល្បាក់។ នេះជាឯកសារ CSS មាន, ជាពិសេសនៅក្នុងច្បាប់នៃការចុះឈ្មោះនៃស្លាក HTML ។

ផ្នែកដងខ្លួន

នៅក្នុងការពិតដែលជា HTML ដែលទំព័រគំរូ - នេះគឺជាផ្នែករាងកាយ។ វាគឺជាការនៅទីនេះដែលមានពទាំងអស់ទាំងអស់នៃទំព័រមាតិកា។ ពទាំងអស់ដែលត្រូវបានបង្ហាញនៅក្នុងសំណុំបែបបទនៃស្លាកនិងស្គ្រីបដូចជាការបញ្ចូលមួយ JavaScript កូដឬបំណែកនៃកម្មវិធី PHP កម្មវិធីនេះ។

វាជាការសំខាន់ដើម្បីដឹងថាឧទាហរណ៍នៃទំព័របណ្តាញ HTML ក្នុងកម្មវិធីរុករកនិងគំរូដូចគ្នានេះដែរនៅក្នុងកម្មវិធីនិពន្ធអត្ថបទដូចជា Notepad មួយនេះ, នេះគឺមិនមែនជារឿងដូចគ្នា។ នៅក្នុងករណីដំបូងយើងមានការត្រៀមខ្លួនជាស្រេចអត្ថបទរបស់ HTML ដែលស្គ្រីបទាំងអស់ក្នុងការប្រតិបត្តិ។ ឧទាហរណ៍, កម្មវិធី PHP បានបំពេញផ្នែកមួយរបស់ខ្លួននិងបានបង្កើតឡើងជំនួសឱ្យការកូដនៅកន្លែងខាងស្ដាំស្លាកនេះ។ JavaScript ផងដែរបានបំពេញបេសកកម្មរបស់ខ្លួនបើទោះបីជាវាមិនទាន់បានប្រហែលជាការសន្ទនាដាច់ដោយឡែកមួយ។

HTML ដែល - វាជំនួសឱ្យការស្គ្រីបស្លាក។ ទីបំផុតមានតែមាតិការបស់ទំព័រដែលបានបង្ហាញក្នុងកម្មវិធីរុករកនេះប៉ុន្តែស្លាករបស់ខ្លួន។ គ្មានកម្មវិធី PHP កូដគឺមិនមាន។

JavaScript ដែលស្ថិតក្នុងទីតាំងពិសេសមួយ, ការថែទាំរបស់លោក - ដើម្បីបម្រើទំព័រនេះមិនត្រឹមតែនៅពេលចាប់ផ្ដើម (ការ Overload), ប៉ុន្តែនៅក្នុងពេលនេះនៅពេលដែលទំព័រនេះគឺនៅក្នុងកម្មវិធីរុករករបស់អ្នកទស្សនា, និងសិក្សាវា។

ឧទាហរណ៍សាមញ្ញ មួយនៃកូដ HTML ទំព័រ (តែផ្នែករាងកាយ) គឺត្រូវបានបង្ហាញដូចខាងក្រោម។

កម្មវិធីរុករករបស់អ្នកទស្សនាមួយវាមើលទៅដូចដែលបានបង្ហាញខាងក្រោម។

មិនត្រូវបានបញ្ជាក់នៅក្នុងកូដគួរមើលទៅដូចជាធាតុដែលបាននាំយកកម្មវិធីរុករក។ ការរចនាទាំងអស់គឺអាចមើលឃើញក្នុងច្បាប់ជា CSS នេះ។ ក្នុងករណីនេះ Mcss ឯកសារ / scPhpWordRW.css ដែលត្រូវបានយោង (មើល។ ឧទាហរណ៍ដំបូងបំផុតនៃ HTML ទំព័រមួយ) ។

មិនដូចជា HTML, CSS ដែលជាការងាយស្រួលរបស់ស្បែក, មិនមានច្បាប់ចូលដំណើរការបានខ្លាំងណាស់និងចំនួនរបស់ពួកគេគឺតូច, នៅពេលដែលឧទាហរណ៍នៃការបង្កើតទំព័រ HTML ដែលបានមិនតម្រូវឱ្យមានអ្វីមួយក្រៅពី Notepad ។ អ្វីគ្រប់យ៉ាងគឺអាចចូលដំណើរការបានយ៉ាងខ្លាំងសម្រាប់ការអភិវឌ្ឍជាបន្ទាន់:

នេះបង្ហាញថាវាងាយស្រួលគឺត្រូវបានរៀបរាប់ scLogo_vDoc ស្លាកនិងបរិយាយនេះគឺថានៅក្នុងរដ្ឋធម្មតានៃស្លាកបង្ហាញរូបភាព vDoc-logo.png, ហើយនៅពេលដាក់កណ្ដុរលើវា - បានបង្ហាញ vDoc-logo-h.png ។

រចនាសម្ព័ន្ធនៃការរៀបរាប់របស់ HTML នេះ

ភាសាមិនពាក់ព័ន្ធនឹងការយកចេញពីណាមួយនៃរចនាសម្ព័ន្ធនិងវាក្យសម្ព័ន្ធនៃគំនិតនៅទីនេះគឺមានជាប់ទាក់ទងខ្លាំងណាស់។ មានអថេរនោះទេប៉ុន្តែមានឱកាសជាច្រើន។ នេះជាមូលដ្ឋានជាមូលដ្ឋាននៃ Hypertext គឺថាមានធាតុមួយ (ស្លាក) ដែលជាការប្រាកដថាមានឈ្មោះមួយ។

ឈ្មោះនៃករណីគូរស្លាក, សមាសភាពនៃឈ្មោះត្រឹមត្រូវ (tagName) និងតង្កៀបមុំ (« <» + + tagName + «> ») បើយើងកំពុងនិយាយអំពីការចាប់ផ្តើមនៃស្លាកនេះហើយ« »ប្រសិនបើបានកត់ត្រាទុក ចុងបញ្ចប់របស់ខ្លួន។

ឧទាហរណ៍នៃទំព័រ HTML ដែលអធិប្បាយអំពីគុណសម្បត្ដិដែលមានទីតាំងស្ថិតនៅក្នុងអត្ថបទខាងក្រោមនេះ។

ស្លាកអាចមានគុណលក្ខណៈនេះ, បន្ទាប់មកពួកគេត្រូវបានដាក់នៅតាមរយៈចន្លោះមួយបន្ទាប់ពីឈ្មោះស្លាកនៅមុនពេលបិទតង្កៀបមុំ ">" ។ គុណលក្ខណៈ, ប្រសិនបើពួកគេមានស្លាកនេះត្រូវបានកត់ត្រាតែនៅដើម។ មាតិការបស់ស្លាកនេះគឺថាដែលស្ថិតនៅរវាងស្លាកចាប់ផ្ដើមនិងបញ្ចប់របស់វា។

រៀបរាប់មាតិកា HTML សរុប

HTML ដែលអនុញ្ញាតឱ្យអ្នកដើម្បីរៀបរាប់អំពីប្លុកនិងក្នុងតួធាតុ។ ដំបូងកាន់កាប់តំបន់ជាក់លាក់មួយនៅក្នុងបង្អួចកម្មវិធីរុករកអាចត្រូវបានដាក់ពិត, ដែលនៅក្នុងកន្លែងខាងស្ដាំនៅវាលនៃ HTML ដែលទំព័របង្ហាញ, និងមានទំហំជាក់លាក់មួយ។

ជាទូទៅធាតុក្នុងតួលេចឡើងខ្សែស្រឡាយមួយ, នោះគឺជាការត្រូវបានបានថ្លែងនៅក្នុងឯកសារទំព័រនេះនិងបង្ហាញនៅលើអេក្រង់។ ការបង្ហាញនៃលំហូរសរុបអាចមានឥទ្ធិពលនៅពេលដែលផ្ទុកទំព័រនេះកើតឡើង។ ស្តីពីការដាក់, ភាពមើលឃើញ, និងលក្ខណៈសម្បត្តិផ្សេងទៀតនៃធាតុប្លុកនេះអាចមានឥទ្ធិពលនៅពេលណាមួយតាមរយៈ JavaScript កូដ។

ក្នុងការបន្ថែមទៅធាតុសាមញ្ញ, HTML ដែលបានផ្តល់នូវការរៀបរាប់តុនិងទម្រង់។ ធាតុទាំងនេះគឺខ្លាំងណាស់នៅក្នុងតម្រូវការនៅក្នុង "ការកសាងតំបន់ជារៀងរាល់ថ្ងៃ»។

សង្ខេបនៃតារាង: តារាងស្លាក, TR, TD

នៅពេលដែលស្លាកតារាងអាចត្រូវបានប្រើដើម្បីបង្កើតតារាងបញ្ជាក់ចំនួនជួរដេកនិងជួរដេកនៅក្នុង TR មួយសម្រាប់ចំនួននៃកោសិកាប្រព័ន្ធ TD មួយ។ ផ្ទុយទៅតារាងធម្មតានៃអង្គការ, ដោយសារតែអង្គការជាតារាង HTML ដែលសម្គាល់ធម្មជាតិបានកំណត់ទៅប្រកាសនេះ, នៅក្នុងសារតែប្រសិនបើអ្នកអភិវឌ្ឍន៍ចង់មានតុចតុកោណដែលក្នុងនោះចំនួនជួរឈរក្នុងជួរដេកទាំងអស់នៃការដូចគ្នានេះ, បន្ទាប់មកវាត្រូវតែអនុវត្តតាមថាសម្រាប់ខ្លួនអ្នក។

ទីតាំងគោលការណ៍នៃ HTML: ធ្វើអ្វីដែលជាការ, ប៉ុន្តែគ្មានអ្វីដែលមិនត្រូវបានយល់។ ក្នុងករណីខ្លះវាមិនមែនជាសំខាន់ណាស់ក្នុងការចំនួនជួរឈរក្នុងជួរគ្នានៃតារាងនោះទេប៉ុន្តែប្រសិនបើអ្នកចង់អនុវត្តការកោសិកាបញ្ចូលគ្នាផ្ដេកឬបញ្ឈរនោះវាគឺជាការចាំបាច់ដើម្បីរាប់ទាំងអស់គ្នាខ្លាំងណាស់ដោយប្រុងប្រយ័ត្ន។

ទំព័រឧទាហរណ៍ដែលរៀបរាប់ពីរបស់ HTML តារាងសាមញ្ញមួយបានបង្ហាញជាលក្ខណៈក្រាហ្វិកនៅក្នុងអត្ថបទនេះ។

ខាងក្រោមនេះគឺជាតារាងដែលបង្ហាញពីទំហំនៃចំនួនបីជួរដោយជួរឈរទាំងបីដោយមានស្លាកជួរដេកនេះជាលើកដំបូងត្រូវបានប្រើជំនួសឱ្យទីនៃស្លាកប្រព័ន្ធ TD - បឋមកថាជួរឈរ។ ជាពិសេសសម្គាល់ស្លាកទាំងពីរនេះមិនមាន, ប៉ុន្តែវាគឺអាចធ្វើទៅបានក្នុងការប្រើប្រាស់ជាលើកដំបូងដើម្បីបែងចែករវាងជួរដេកទីមួយនៃតារាងនិងក្នុង CSS ដែលទីនោះអ្នកអាចភ្ជាប់រចនាប័ទ្មផ្ទាល់ខ្លួនរបស់អ្នកដែលស្គាល់វាពីប្រព័ន្ធ TD ផ្សេងទៀត។

សង្ខេបសំណុំបែបបទ: ស្លាកទម្រង់ការបញ្ចូល

សំណុំបែបបទ - នេះគឺជាផ្នែកមួយទាមទារឱ្យភាគច្រើនបំផុតនៃ HTML ស្លាក។ ការប្រើប្រាស់ទម្រង់អាចបញ្ជូនព។ ជាការពិតណាស់, ទំព័រ - ពបង្ហាញនេះប៉ុន្តែសំណុំបែបបទ - បញ្ចូល។

ទំព័រឧទាហរណ៍ដែលរៀបរាប់ពីរបស់ HTML សាមញ្ញមួយដែលសំណុំបែបបទ:

ប្រើទម្រង់ជាច្រើនទៀត, ប៉ុន្តែលក្ខណៈពិសេសចម្បងគឺមានដូចខាងក្រោម។ អ្នកអាចបញ្ជាក់វាលបញ្ចូលនេះអ្នកត្រូវការផ្ដល់តម្លៃឱ្យពួកគេដើម្បីរៀបចំនិងកម្មវិធីដោះស្រាយព្រឹត្តិការណ៍សម្រាប់ការវិភាគនៃការបញ្ចូលអ្នកប្រើ។ អ្នកអាចបញ្ជាក់វាលមួយដែលបានលាក់និងបញ្ជូនទិន្នន័យពីផ្ទៃខាងក្រោយទំព័រ។ អ្នកអាចកំណត់ប៊ូតុងបញ្ជូនពការចុចដំណើរការដែលផ្ដួចផ្ដើមផ្ទេរទិន្នន័យ។

ដោយប្រើ HTML

ដើម្បីដឹងថាភាសា Hypertext - ស្ថានភាពដែលអាចខ្វះបានសម្រាប់ជំនាញការងារណាមួយនៅក្នុងវាលនៃការសរសេរកម្មវិធីអ៊ីនធឺណិត, ប៉ុន្តែប្រសិនបើអ្នកចង់សរសេរកម្មវិធីនៅក្នុងកម្មវិធី PHP ឬ JavaScript, បន្ទាប់មកបានដឹងថាជា HTML + CSS បានត្រូវឥតខ្ចោះ។

ភាសារបស់ PHP ត្រូវបានកំណត់អត្តសញ្ញាណនៅក្នុងឧទាហរណ៍មុន។ PHP ដែលរត់នៅលើម៉ាស៊ីនបម្រើដោយសារតែទំព័រជាមួយនឹងសំណុំបែបបទនេះបានហោះពីម៉ាស៊ីនបម្រើទៅនឹងកម្មវិធីរុករកជាមួយនឹងវាលពេញ។ ជាពិសេសមុខងារ TestOnBlur ដែលបានរៀបរាប់នៅក្នុងការបញ្ចូលស្លាក (handler ព្រឹត្តិការណ៍ onblur) ដែលបានទទួលប៉ារ៉ាម៉ែត្រទាំងអស់ដែលនៅក្នុងសំណុំបែបបទនៃវាលអត្ថបទ។

កម្មវិធីរុករករត់ JavaScript និងដើម្បីធ្វើការងារឱ្យបានត្រឹមត្រូវទិន្នន័យផ្ញើប៊ូតុងត្រឡប់ទៅម៉ាស៊ីនបម្រើនោះគឺការរចនា :. Onclick = jQuery ( '# ទៅ') val ( 'រទេះ'), វាគឺជាការចាំបាច់ដើម្បីឱ្យដឹងថាមិនត្រឹមតែអំពីអ្វីដែល jQuery នេះ ប៉ុន្តែអ្វីដែល #to, Val, រទេះ។ ច្រើនទៀតយ៉ាងច្បាស់ណាស់, វាគឺជាការចាំបាច់ដើម្បីឱ្យដឹងថាស្លាក HTML មូលដ្ឋាននិងច្បាប់ទូទៅការដាក់ពាក្យសុំដើម្បីឱ្យពួកគេរចនាប័ទ្ម CSS ដែល។

នេះគឺជាការគ្រប់គ្រាន់ដើម្បីបង្កើនគុណវុឌ្ឍិនៃជំនាញណាមួយបានយ៉ាងឆាប់រហ័សនៅក្នុងតំបន់នៃការសរសេរកម្មវិធីអ៊ីនធឺណិត។