നെസ്റ്റിംഗ് HTML ടാഗുകൾ

എങ്ങനെയാണ് നെസ്റ്റ് ടാഗുകൾ ശരിയായി കാണേണ്ടത്

ഇന്ന് ഏതെങ്കിലും വെബ് പേജിനായി നിങ്ങൾ HTML മാർക്കപ്പ് നോക്കിയാൽ, മറ്റ് HTML ഘടകങ്ങളിൽ അടങ്ങിയിട്ടുള്ള HTML ഘടകങ്ങൾ നിങ്ങൾ കാണും. മറ്റുള്ളവയുടെ "ഉള്ളിൽ" ഉള്ള ഈ ഘടകങ്ങൾ "കൂട്ടിചേരൽ ഘടകങ്ങൾ" എന്ന് അറിയപ്പെടുന്നു, അവ ഇന്ന് ഏതെങ്കിലും വെബ് പേജ് സൃഷ്ടിക്കാൻ അത്യാവശ്യമാണ്.

ഇത് നെസ്റ്റ് HTML ടാഗുകൾക്ക് എന്ത് അർഥമാക്കുന്നു?

നിങ്ങളുടെ ഉള്ളടക്കം അടങ്ങുന്ന ബോക്സുകളായി എച്ച്.റ്റി.എം.എൽ ടാഗുകൾ ചിന്തിക്കുക എന്നതാണ് നെസ്റ്റിംഗ് അറിയാനുള്ള എളുപ്പ മാർഗം. നിങ്ങളുടെ ഉള്ളടക്കം ടെക്സ്റ്റുകൾ, ചിത്രങ്ങൾ മുതലായവ ഉൾപ്പെടുത്താം. HTML ടാഗുകൾ ഉള്ളടക്കത്തിന് ചുറ്റുമുള്ള ബോക്സുകളായിരിക്കും. ചിലപ്പോൾ, നിങ്ങൾക്ക് മറ്റ് ബോക്സുകൾക്കുള്ളിൽ ബോക്സുകൾ സ്ഥാപിക്കേണ്ടതുണ്ട്. ആ "അകത്തെ" ബോക്സുകൾ മറ്റുള്ളവർക്കുള്ളിൽ ഉള്ളതാണ്.

ഒരു ഖണ്ഡികയ്ക്കുള്ളിൽ നിങ്ങൾക്കു ബോള്ഡ് ചെയ്യേണ്ട വാചകത്തിന്റെ ഒരു ബ്ലോക്ക് ഉണ്ടെങ്കിൽ, നിങ്ങൾക്ക് രണ്ട് HTML ഘടകങ്ങളും ടെക്സ്റ്റും തന്നെ ഉണ്ടായിരിക്കും.

ഉദാഹരണം: ഇത് വാചകത്തിന്റെ ഒരു വാചകമാണ്.

ആ വാചകം തന്നെയാണ് ഞങ്ങളുടെ ഉദാഹരണം. അത് എങ്ങനെ എഴുതപ്പെടുമെന്നത് ഇവിടെയുണ്ട്.

ഉദാഹരണം: ഇത് വാചകത്തിന്റെ ഒരു വാചകമാണ്.

കാരണം "വാചകം" എന്ന വാക്കിന് ബോൾഡ് ആയിരിക്കണമെങ്കിൽ, നിങ്ങൾ അതിനും മുമ്പും ശേഷവും ബോൾഡ് ടാഗുകൾ തുറക്കുകയും അടയ്ക്കുകയും ചെയ്യുന്നു.

ഉദാഹരണം: ഇത് ഒരു വാചകം ആണ്.

നിങ്ങൾക്ക് കാണാനാകുന്നതുപോലെ, ഞങ്ങളുടെ വാചകത്തിന്റെ ഉള്ളടക്കം / വാചകം അടങ്ങുന്ന ഒരു ബോക്സ് (ഒരു ഖണ്ഡിക) ഉണ്ട്, രണ്ടാമത്തെ ബോക്സും (ശക്തമായ ടാഗ് ജോഡി), ആ വാക്ക് ബോൾഡ് ആയി നൽകും.

നിങ്ങൾ nest ടാഗുകൾ ചെയ്യുമ്പോൾ, നിങ്ങൾ തുറന്ന എതിർ ക്രമത്തിൽ ടാഗുകൾ അടയ്ക്കുന്നതിൽ വളരെ പ്രധാനമാണ്. നിങ്ങൾ ആദ്യം

തുറന്ന് അതിനുശേഷം, അത് നിങ്ങൾ തിരസ്കരിച്ച് അടയ്ക്കുക തുടർന്ന് എന്ന് അർത്ഥമാക്കുന്നു.

ഇതിനെക്കുറിച്ച് ചിന്തിക്കാനുള്ള മറ്റൊരു മാർഗം വീണ്ടും ബോക്സുകളുടെ സാമ്യം ഉപയോഗിക്കേണ്ടതുണ്ട്. മറ്റൊരു ബോക്സിനുള്ളിൽ നിങ്ങൾ ഒരു ബോക്സ് വയ്ക്കുകയാണെങ്കിൽ, ബാഹ്യരേഖ അല്ലെങ്കിൽ അടഞ്ഞ ബോക്സ് അടയ്ക്കുന്നതിനു മുൻപ് നിങ്ങൾ ആന്തരിക അടയ്ക്കുക.

കൂടുതൽ Nested ടാഗുകൾ ചേർക്കുന്നു

നിങ്ങൾക്ക് ഒന്നോ രണ്ടോ വാക്കുകൾ ധൈര്യമായിരിക്കണമെന്നും മറ്റൊരു സെറ്റ് ഇറ്റാലിക്ക് ചെയ്യണമെന്നുണ്ടെങ്കിൽ എന്തുചെയ്യണം? അത് എങ്ങനെ ചെയ്യാം.

ഉദാഹരണം: ഇത് വാചകം വാചകമാണ് കൂടാതെ ഇത് ഇറ്റാലിക്ക് ചെയ്ത വാചകവും തന്നെയുണ്ട്.

നമ്മുടെ പുറത്തെ ബോക്സ്,

, അതിനുള്ളിൽ രണ്ട് ആധികാരിക ടാഗുകൾ ഉണ്ട് - കൂടാതെ . അടങ്ങുന്ന അടച്ചു പൂട്ട് അടയ്ക്കപ്പെടുന്നതിന് മുമ്പ് അവ രണ്ടായും അടച്ചിരിക്കണം.

ഉദാഹരണം: ഇത് വാചകം വാചകമാണ് കൂടാതെ ഇത് ഇറ്റാലിക്ക് ചെയ്ത വാചകവും തന്നെയാണ്.

ഇത് മറ്റൊരു ഖണ്ഡികയാണ്. / p>

ഈ സാഹചര്യത്തിൽ ബോക്സുകൾക്കുള്ളിൽ ബോക്സുകൾ ഉണ്ട്! കൂടുതൽ ഔട്ട് ബോക്സ്

അല്ലെങ്കിൽ ഒരു "ഡിവിഷൻ" ആണ്. ആ ബോക്സിലെ ഉള്ളിൽ ഒരു കൂട്ടം നെസ്റ്റഡ് പാരാഗ് ടാഗുകൾ ഉണ്ട്, ആദ്യ ഖണ്ഡികയ്ക്ക് ശേഷം നമുക്ക് അടുത്ത ഉം ടാഗ് ജോഡിയും. ഒരിക്കൽ കൂടി, ഏത് വെബ് പേജും നോക്കുക ഇപ്പോൾ നിങ്ങൾ ഇത് കാണും, കൂടുതൽ കൂടുതൽ കൂടൽ! ഇങ്ങനെയാണ് പേജുകൾ നിർമ്മിച്ചിരിക്കുന്നത് - ബോക്സുകൾക്കുള്ളിൽ ബോക്സുകൾ.

നെസ്റ്റിംഗിനെ കുറിച്ച് നിങ്ങൾ ശ്രദ്ധിക്കേണ്ടത് എന്തുകൊണ്ട്?

നിങ്ങൾക്ക് CSS ഉപയോഗിക്കുവാണോ നിങ്ങൾ ഉദ്ദേശിക്കുന്നതെന്ന് കരുതുന്നതിനുള്ള ഒരു കാരണം. കാസ്കേഡിംഗ് ശൈലി ഷീറ്റുകൾ പ്രമാണത്തിൽ സ്ഥിരതയാർന്ന ടാഗുകളെ ആശ്രയിക്കുന്നതിനാൽ, സ്റ്റൈലുകൾ ആരംഭിക്കുന്നതും അവസാനിക്കുന്നതും എവിടെ എന്ന് പറയാൻ കഴിയും. പേജിലെ പ്രധാന "ഉള്ളടക്കത്തിന്റെ" ഒരു ക്ലാസ് വിഭജനത്തിന്റെ ഭാഗമായി ഉള്ള എല്ലാ "ലിങ്കുകളും" ബാധിക്കുന്ന ഒരു ശൈലി നിങ്ങൾ സജ്ജമാക്കിയാൽ തെറ്റായ നെസ്റ്റിംഗ് ഈ ശൈലികൾ എവിടെയാണ് ഉപയോഗിക്കേണ്ടതെന്ന് ബ്രൗസറിന് ബുദ്ധിമുട്ടുള്ളതാക്കുന്നു. ചില HTML പരിശോധിക്കുക:

ഉദാഹരണം: ഇത് വാചകം വാചകമാണ് കൂടാതെ ഇത് ഇറ്റാലിക്ക് ചെയ്ത വാചകവും തന്നെയാണ്.

മറ്റൊരു ഖണ്ഡിക ആണ്.

ഈ വിഭജനത്തിനിടയിലുള്ള ലിങ്ക് ബാധിക്കുന്ന ഒരു CSS ശൈലി എഴുതുവാൻ ആഗ്രഹിക്കുന്നെങ്കിൽ ഞാൻ പ്രസ്താവിച്ച ഉദാഹരണം ഉപയോഗിച്ചാണ്, മാത്രമല്ല ആ ലിങ്ക് (പേജിലെ മറ്റു ഭാഗങ്ങളിൽ മറ്റേതെങ്കിലും ലിങ്കുകളേക്കാൾ എതിരായി), ഞാൻ അത് ഉപയോഗിക്കേണ്ടതുണ്ട് എന്റെ ശൈലി എഴുതുവാൻ ഞാൻ ശ്രമിക്കുന്നു,

.main-content a {color: # F00; }

പ്രവേശനക്ഷമതയും ബ്രൌസർ അനുയോജ്യതയും ഉൾപ്പെടുന്ന മറ്റ് കാരണങ്ങൾ. നിങ്ങളുടെ HTML തെറ്റായി ഉദ്ധരിക്കപ്പെട്ടിട്ടുണ്ടെങ്കിൽ, സ്ക്രീൻ വായനക്കാർക്കും പഴയ ബ്രൗസറുകൾക്കും ഇത് ആക്സസ് ചെയ്യാനാവില്ല - കൂടാതെ HTML പേജും എക്കൌണ്ടുകളും ഉള്ളതിനാൽ ബ്രൌസറുകൾ എങ്ങനെ ശരിയായി റെൻഡർ ചെയ്യണം എന്ന് കണ്ടുപിടിക്കാൻ കഴിയുന്നില്ലെങ്കിൽ ഒരു പേജിന്റെ ദൃശ്യപരതയെ പൂർണമായും തകർക്കാൻ സാധിക്കും. സ്ഥലമില്ല.

അവസാനമായി, നിങ്ങൾ പൂർണ്ണമായും ശരിയായതും സാധുവായതുമായ HTML എഴുതാൻ ശ്രമിച്ചാൽ, നിങ്ങൾ ശരിയായ നെസ്റ്റിംഗ് ഉപയോഗിക്കേണ്ടതുണ്ട്. അല്ലെങ്കിൽ, ഓരോ വാചകമടിക്കും നിങ്ങളുടെ HTML തെറ്റാണെന്ന് ഫ്ലാഗ് ചെയ്യും.