HTML ഭാഷ ഘടകങ്ങളുടെ എണ്ണം ഉൾക്കൊള്ളുന്നു. ഖണ്ഡികകൾ, ശീർഷകങ്ങൾ, ലിങ്കുകൾ, ഇമേജുകൾ എന്നിവപോലുള്ള സാധാരണയായി ഉപയോഗിക്കപ്പെടുന്ന വെബ്സൈറ്റ് ഘടകങ്ങൾ ഇതിൽ ഉൾപ്പെടുന്നു. തലക്കെട്ട്, നാവ്, അടിക്കുറിപ്പ്, അതിൽക്കൂടുതലുള്ളത് ഉൾപ്പെടെ HTML5 ൽ പുതുതായ നിരവധി പുതിയ ഘടകങ്ങൾ ഉണ്ട്. ഈ എല്ലാ HTML ഘടകങ്ങളും ഒരു പ്രമാണ ഘടന സൃഷ്ടിക്കുന്നതിനും അർത്ഥമാക്കുന്നതിനും ഉപയോഗിക്കുന്നു. മൂലകങ്ങൾക്ക് കൂടുതൽ അർഥം ചേർക്കുന്നതിന് നിങ്ങൾക്ക് അവയെ ആട്രിബ്യൂട്ടുകൾ നൽകാം.
ഒരു അടിസ്ഥാന HTML തുറക്കൽ ടാഗ് ആരംഭിക്കുന്നത് <പ്രതീകം. തുടർന്ന് ടാഗ് നാമം, അവസാനം ടാഗ് പൂർത്തിയാക്കാൻ> പ്രതീകം. ഉദാഹരണമായി, ആദ്യ ഖണ്ഡികാ ടാഗും ഇങ്ങനെ എഴുതപ്പെടും:
നിങ്ങളുടെ HTML ടാഗിൽ ഒരു ആട്രിബ്യൂട്ട് ചേർക്കുന്നതിന്, നിങ്ങൾ ആദ്യം ടാഗ് നാമത്തിനു ശേഷം ഒരു സ്പെയ്സ് നൽകുക (ഈ കേസിൽ "p"). അപ്പോൾ നിങ്ങൾ ഉപയോഗിക്കാൻ ആഗ്രഹിക്കുന്ന ആട്രിബ്യൂട്ട് പേര് പിന്നീട് ഒരു തുല്യ ചിഹ്നം ചേർക്കും. അന്തിമമായി, ആട്രിബ്യൂട്ട് മൂല്യം ക്വോട്ടേഷൻ മാർക്കുകളിൽ സ്ഥാപിക്കും. ഉദാഹരണത്തിന്:
ടാഗുകൾക്ക് ഒന്നിലധികം ആട്രിബ്യൂട്ടുകൾ ഉണ്ടാകും. നിങ്ങൾ ഓരോ ആട്രിബ്യൂട്ടും മറ്റുള്ളവർ ഒരു സ്പേസ് ഉപയോഗിച്ച് വേർതിരിക്കും.
ആവശ്യമായ ആട്രിബ്യൂട്ടുകൾ ഉള്ള മൂലകങ്ങൾ
ചില HTML ഘടകങ്ങൾക്ക് യഥാർത്ഥത്തിൽ ഉദ്ദേശിച്ച രീതിയിൽ പ്രവർത്തിക്കാൻ നിങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ അവയ്ക്ക് ആട്രിബ്യൂട്ടുകൾ ആവശ്യമാണ്. ചിത്ര ഘടകവും ലിങ്ക് ഘടകവും ഇതിന് രണ്ട് ഉദാഹരണങ്ങളാണ്.
ചിത്ര ഘടകത്തിന് "src" ആട്രിബ്യൂട്ട് ആവശ്യമാണ്. ആ ആട്രിബ്യൂട്ട് ആ ലൊക്കേഷനിൽ ഉപയോഗിക്കേണ്ട ഇമേജ് ബ്രൗസറിനെ അറിയിക്കുന്നു. ആട്രിബ്യൂട്ടിന്റെ മൂല്യം ഇമേജിൽ ഒരു ഫയൽ പാത്ത് ആയിരിക്കും. ഉദാഹരണത്തിന്:
"Alt" അല്ലെങ്കിൽ ഇതര വാചക ആട്രിബ്യൂട്ട് എന്ന ഈ ഘടകം ഞാൻ മറ്റൊരു ആട്രിബ്യൂട്ട് ചേർത്തു എന്നു നിങ്ങൾ ശ്രദ്ധിക്കും. ഇമേജുകൾക്ക് ഇത് സാങ്കേതികമായി ആവശ്യമുള്ള ആട്രിബ്യൂട്ടല്ല, എന്നാൽ പ്രവേശനക്ഷമതയ്ക്കായുള്ള ഈ ഉള്ളടക്കം എല്ലായ്പ്പോഴും ഉൾപ്പെടുത്തുന്നത് നല്ലതാണ്. Alt ആട്രിബ്യൂട്ടിന്റെ മൂല്യത്തിൽ ലിസ്റ്റുചെയ്ത വാചകം ഒരു കാരണം ചില കാരണങ്ങളാൽ ലോഡ് ചെയ്യാൻ കഴിയുന്നില്ലെങ്കിൽ പ്രദർശിപ്പിക്കും.
പ്രത്യേക ആട്രിബ്യൂട്ടുകൾ ആവശ്യപ്പെടുന്ന മറ്റൊരു ഘടകം ആങ്കർ അല്ലെങ്കിൽ ലിങ്ക് ടാഗ് ആണ്. "ഹൈപ്പർടെക്സ്റ്റ് റഫറൻസ്" എന്ന് സൂചിപ്പിക്കുന്ന "href" ആട്രിബ്യൂട്ട് ഈ മൂലകത്തിൽ ഉണ്ടായിരിക്കണം. "ഈ ലിങ്ക് എവിടെ പോകണം" എന്ന് പറയുന്ന ഒരു ഫാൻസി മാർഗം ആണ്. ഇമേജ് എലമെൻറ് ലോഡ് ചെയ്യാൻ എന്ത് ചിത്രം അറിയണം എന്നതു പോലെ ലിങ്ക് ലിങ്ക് വേണം ഒരു ലിങ്ക് ടാഗുചെയ്യുന്നത് ഇങ്ങനെയാണ്:
ആ ലിങ്ക് ഇപ്പോൾ ഒരു ആട്രിബ്യൂട്ടിന്റെ മൂല്യം വ്യക്തമാക്കുന്ന വെബ്സൈറ്റിലേക്ക് ഒരു വ്യക്തിയെ കൊണ്ടുവരും. ഈ സാഹചര്യത്തിൽ, അത് പ്രധാന പേജാണ്.
CSS കൊളുത്തുകൾ എന്ന വിശേഷണം
ആട്രിബ്യൂട്ടുകളുടെ മറ്റൊരു ഉപയോഗം CSS ശൈലികൾക്കായി "കൊളുത്തുകൾ" ആയി ഉപയോഗിക്കുമ്പോൾ ഉപയോഗിക്കേണ്ടതാണ്. വെബ് പേജിന്റെ ഘടന (HTML) നിങ്ങളുടെ ശൈലിയിൽ നിന്ന് (CSS) വേർതിരിച്ച് നിലനിർത്താൻ വെബ് സ്റ്റാൻഡേർഡുകൾ ആവശ്യപ്പെടുന്നു, വെബ് ബ്രൗസറിൽ ഘടനാപരമായ പേജ് എങ്ങനെ പ്രദർശിപ്പിക്കുമെന്ന് നിർദേശിക്കുന്നതിനായി നിങ്ങൾ ഈ ആട്രിബ്യൂട്ട് കൊളുത്തുകൾ CSS ൽ ഉപയോഗിക്കുന്നു. ഉദാഹരണത്തിന്, നിങ്ങളുടെ HTML പ്രമാണത്തിൽ നിങ്ങൾക്ക് ഈ മാർക്കപ്പ് മാർക്കപ്പ് ഉണ്ടാകാം.
നിങ്ങൾക്ക് ഈ ഡിവിഷനിലെ കറുപ്പ് (# 000), 1.5em എന്ന ഫോണ്ട് സൈസ് എന്നിവ വേണമെങ്കിൽ നിങ്ങൾ ഇത് നിങ്ങളുടെ CSS ലേക്ക് കൂട്ടിച്ചേർക്കും:
. പശ്ചാത്തലത്തിൽ {background-color: # 000; ഫോണ്ട്-വ്യാപ്തി: 1.5EM;}"ഫീച്ചർഡ്" ക്ലാസ് ആട്രിബ്യൂട്ട് ആ മേഖലയിലേക്ക് ശൈലികൾ പ്രയോഗിക്കാൻ ഞങ്ങൾ CSS ൽ ഉപയോഗിക്കുന്ന ഒരു കൊളുത്തായി പ്രവർത്തിക്കുന്നു. ഞങ്ങൾക്ക് വേണമെങ്കിൽ ഇവിടെ ഒരു ID ആട്രിബ്യൂട്ട് കൂടി ചെയ്യാം. രണ്ട് ക്ലാസ്സുകളും ഐഡികളും സാർവത്രിക ആട്രിബ്യൂട്ടുകളാണുള്ളത്, അതിനർത്ഥം അവർക്ക് ഏതെങ്കിലും ഘടകത്തിലേക്ക് ചേർക്കാൻ കഴിയും എന്നാണ്. അവ രണ്ടും ആ ഘടകത്തിന്റെ ദൃശ്യപരത നിർണ്ണയിക്കുന്നതിന് നിർദ്ദിഷ്ട CSS ശൈലികളുമായി ടാർഗെറ്റുചെയ്യാൻ കഴിയും.
Javascript സംബന്ധിച്ച്
അവസാനമായി, ചില HTML ഘടകങ്ങളിൽ ആട്രിബ്യൂട്ടുകൾ ഉപയോഗിക്കുന്നതും നിങ്ങൾക്ക് JavaScript ഉപയോഗിച്ചേക്കാം. നിങ്ങൾക്ക് ഒരു നിർദ്ദിഷ്ട ID ആട്രിബ്യൂട്ട് ഉള്ള ഒരു എലമെൻറിനായി തിരയുന്ന ഒരു സ്ക്രിപ്റ്റ് ഉണ്ടെങ്കിൽ, ഇത് HTML ഭാഷയിലെ ഈ സാധാരണ പടിയുടെ മറ്റൊരു ഉപയോഗമാണ്.