വരികളുടേയും നിരകളുടേയും അടിസ്ഥാനകാര്യങ്ങൾ നിങ്ങൾ മനസ്സിലാക്കി കഴിഞ്ഞാൽ നിങ്ങൾക്ക് സൃഷ്ടിക്കാൻ എളുപ്പമാണ് HTML ടേബിളുകൾ - ഒരു പട്ടിക ഉപയോഗിക്കുന്നത് ശരിയാകുമ്പോൾ അവ ഒഴിവാക്കണമെന്നും നിങ്ങൾ മനസിലാക്കുന്നു.
എ ബ്രീഫ് ഹിസ്റ്ററി ഓഫ് ടേബിൾസ് ആൻഡ് വെബ് ഡിസൈൻ
നിരവധി വർഷങ്ങൾക്ക് മുമ്പ്, CSS- ഉം വെബ് സ്റ്റാൻഡേർഡുകളും അംഗീകരിക്കുന്നതിനു മുമ്പ്, വെബ് ഡിസൈനർമാർക്ക് വെബ്സൈറ്റുകൾക്കായി പേജ് ലേഔട്ട് സൃഷ്ടിക്കാൻ HTML
ഘടകത്തെ ഉപയോഗിച്ചു. വെബ്സൈറ്റ് ഡിസൈനുകൾ ഒരു പസിൽ പോലുള്ള ചെറിയ ഭാഗങ്ങളായി "വെട്ടിക്കളയുകയും" തുടർന്ന് ഒരു HTML ടേബിളിനെ ഉദ്ദേശിച്ചതുപോലെ ബ്രൗസറിൽ റെൻഡർചെയ്യുകയും ചെയ്യും. ഇത് വളരെ സങ്കീർണ്ണമായ പ്രക്രിയയാണ്, അത് ധാരാളം അധികമായ HTML മാർക്ക്അപ്പ് സൃഷ്ടിക്കുകയും ഞങ്ങളുടെ വെബ് സൈറ്റുകളിലെ മൾട്ടി-സ്ക്രീൻ ലോകത്ത് ഇന്നും ഉപയോഗിക്കാനാവില്ല. വെബ്പേജ് വിഷ്വലുകൾക്കും വിതാനങ്ങൾക്കുമായി സി.എസ്.എസ് അംഗീകൃത സമ്പ്രദായമായി മാറി, ഇതു് ടേബിളുകളുടെ ഉപയോഗം മാറ്റിത്തീർത്തു, പല ടേബിളുകളും "ടേബിളുകൾ മോശമായിരുന്നെന്ന്" തെറ്റായി വിശ്വസിച്ചു. അത് തെറ്റാണ്. ലേഔട്ടിനായി ടേബിളുകൾ മോശമാണ്, പക്ഷെ വെബ് ഡിസൈനിലും HTML- ലും അവർക്ക് ഇപ്പോഴും സ്ഥലം ഉണ്ട്, ട്രെയിൻ ഷെഡ്യൂൾ കലണ്ടറിലെ കലണ്ടർ പോലുള്ള ടാബ്ലറ്റായ ഡാറ്റ പ്രദർശിപ്പിക്കുന്നതിന് ഇത് ഉപയോഗിക്കുന്നു. ആ ഉള്ളടക്കം ഉപയോഗിക്കുന്നതിന്, ഒരു പട്ടിക ഉപയോഗിച്ച് ഇപ്പോഴും സ്വീകാര്യവും മികച്ച സമീപനവുമാണ്.
അപ്പോൾ എങ്ങിനെ ഒരു പട്ടികയെ വിഭജിക്കുന്നു? ലളിതമായ 2x2 പട്ടിക സൃഷ്ടിച്ച് ആരംഭിക്കാം. ഇത് 2 നിരകളും (ഇവ ലംബമായ ബ്ലോക്കുകളും), 2 വരികളും (തിരശ്ചീന ബ്ലോക്കുകൾ) വരും. നിങ്ങൾ ഒരു 2x2 പട്ടിക നിർമ്മിച്ചു കഴിഞ്ഞാൽ, അധിക വരികളോ നിരകളോ ചേർത്ത് നിങ്ങൾക്കാവശ്യമുള്ള വലുപ്പത്തിലുള്ള പട്ടിക നിർമ്മിക്കാൻ കഴിയും.
പ്രയാസം: ശരാശരി
സമയം ആവശ്യമാണ്: 10 മിനിറ്റ്
എങ്ങനെ ഇവിടെയുണ്ട്:
- ആദ്യം പട്ടിക
തുറക്കുക - ട്രിഗ് ടാഗ് ഉപയോഗിച്ച്
ആദ്യ വരി തുറക്കുക - Td ടാഗ് ഉപയോഗിച്ച് ആദ്യ നിര തുറക്കുക
- സെല്ലിന്റെ ഉള്ളടക്കങ്ങൾ എഴുതുക
- ആദ്യത്തെ സെൽ അടച്ച് രണ്ടാമത്തെ
തുറക്കുക - രണ്ടാമത്തെ സെല്ലിന്റെ ഉള്ളടക്കങ്ങൾ എഴുതുക
- രണ്ടാമത്തെ സെൽ അടച്ച് വരി അടയ്ക്കുക
- രണ്ടാമത്തെ വരിയെ ആദ്യത്തെ
| | - തുടർന്ന് പട്ടിക അടയ്ക്കുക
നിങ്ങൾക്ക് | ഘടകത്തെ ഉപയോഗിച്ച് നിങ്ങളുടെ പട്ടികയിൽ പട്ടികയുടെ തലക്കെട്ടുകൾ ചേർക്കാൻ തിരഞ്ഞെടുക്കാവുന്നതാണ്. ഈ പട്ടികയുടെ തലക്കെട്ടുകൾ ആദ്യ പട്ടിക നിരയിലെ "table data" കഷീറ്റുകളെ മാറ്റിസ്ഥാപിക്കും, ഇതുപോലെ:
| | | | പേര് | റോൾ | | ജെറമി | ഡിസൈനർ < td> Jennifer | ഡവലപ്പർ | ബ്രൗസറിൽ ഈ പേജ് റെൻഡർ ചെയ്യുമ്പോൾ, പട്ടികയുടെ ശീർഷകങ്ങൾ ഉള്ള ആദ്യ വരി സ്വതവേ, ബോൾഡ് ടെക്സ്റ്റിൽ പ്രദർശിപ്പിക്കുകയും അവർ ഉൾപ്പെടുന്ന പട്ടിക സെല്ലിൽ കേന്ദ്രീകരിക്കുകയും ചെയ്യും.
അപ്പോൾ, HTML- ൽ പട്ടികകൾ ഉപയോഗിക്കുന്നത് ശരിയാണോ? അതെ - നിങ്ങൾ ലേഔട്ട് ഉദ്ദേശ്യങ്ങൾക്കായി ഉപയോഗിക്കുന്നിടത്തോളം കാലം. നിങ്ങൾക്ക് ടാബ്ലറ്റൽ വിവരങ്ങൾ പ്രദർശിപ്പിക്കേണ്ടതുണ്ടെങ്കിൽ, ഒരു ടേബിൾ അങ്ങനെ ചെയ്യാൻ പറ്റുന്നതാണ്. വാസ്തവത്തിൽ, ഈ തെറ്റിന്റെ തെറ്റിധാരണ മൂലം ചില തെറ്റിദ്ധാരണകൾ ഒഴിവാക്കാൻ ഒരു പട്ടിക ഒഴിവാക്കുന്നതാണ്, ഈ ദിവസം മുതൽ പ്രായപൂർത്തിയായവർക്കുള്ള ലേഔട്ട് കാരണങ്ങൾ ഉപയോഗിക്കുന്നത് പോലെ.
ജെന്നിഫർ കൈറോൺ എഴുതുന്നു. എഡിറ്റു ചെയ്തത് ജെറമി ഗിർാർഡ് 8/11/16 ന്
| | |