ഹലോ എല്ലാവരും!

ഞങ്ങൾ പഠിച്ചുതുടങ്ങിയാൽ, HTML, CSS എന്നിവയുടെ അടിസ്ഥാനകാര്യങ്ങൾ ഞങ്ങൾ അറിഞ്ഞിരിക്കണം, അത് ഞങ്ങളുടെ സൈറ്റുകളെ മികച്ചതും സെർച്ച് എഞ്ചിനുകൾക്ക് കൂടുതൽ ആകർഷകവുമാക്കാൻ സഹായിക്കും. ഈ ആഴ്‌ച മുഴുവൻ ഞാൻ വെബ്‌സൈറ്റ് കോഡുമായി പ്രവർത്തിക്കുന്നതിനെക്കുറിച്ച് നിങ്ങളോട് പറയും, ഇതാണ് നിങ്ങളെ കാത്തിരിക്കുന്നത്:

• . ഈ എഡിറ്റർമാർ ഉപയോഗിച്ച് വെബ്‌സൈറ്റ് കോഡ് എങ്ങനെ എഡിറ്റ് ചെയ്യാമെന്ന് ഞങ്ങൾ പഠിക്കും;
• . പേജിൻ്റെ ഘടന മനസ്സിലാക്കാൻ ഞങ്ങൾ തിരയൽ റോബോട്ടിനെ സഹായിക്കും;
• . സൈറ്റ് കോഡ് എത്രത്തോളം ശരിയായി സമാഹരിച്ചിട്ടുണ്ടെന്നും പിശകുകൾ കണ്ടെത്തുമെന്നും ഞങ്ങൾ കണ്ടെത്തും;

നിങ്ങൾക്ക് കാണാനാകുന്നതുപോലെ, ഈ ആഴ്ച ഞങ്ങൾക്ക് ധാരാളം ജോലികൾ ഉണ്ടാകും, അതിനാൽ സന്ദർഭ-UP ബ്ലോഗ് അപ്‌ഡേറ്റുകൾ സബ്‌സ്‌ക്രൈബുചെയ്യുക, നിങ്ങൾ ഇതിനകം സബ്‌സ്‌ക്രൈബ് ചെയ്‌തിട്ടില്ലെങ്കിൽ നിങ്ങളുടെ ഇമെയിലിലെ എല്ലാ പാഠങ്ങളും സ്വീകരിക്കുക.

HTML അടിസ്ഥാനങ്ങൾ

HTML (ഹൈപ്പർ ടെക്സ്റ്റ് മാർക്ക്അപ്പ് ലാംഗ്വേജ്) എന്നത് ഇൻറർനെറ്റിലെ പ്രമാണങ്ങൾക്കായുള്ള ഒരു മാർക്ക്അപ്പ് ഭാഷയാണ്. അതായത്, നിങ്ങളുടെ വെബ്‌സൈറ്റിൻ്റെ ഏത് പേജും ഒരു പ്രമാണമാണ്, കൂടാതെ ബ്രൗസർ അത്തരം പ്രമാണങ്ങൾ കാണുന്നതിനുള്ള ഒരു മാർഗമാണ്.

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

മാർക്ക്അപ്പ് ഭാഷയിൽ ബ്രൗസറിനെ നിർണ്ണയിക്കാൻ സഹായിക്കുന്ന പ്രത്യേക ടാഗുകൾ അടങ്ങിയിരിക്കുന്നു:

• പ്രമാണ ഘടന;
• ഒരു പ്രത്യേക മൂലകത്തിൻ്റെ സ്ഥാനം;
• മൂലകത്തിൻ്റെ ഉദ്ദേശ്യം;
• മൂന്നാം കക്ഷി ഫയലുകൾ ഉൾപ്പെടുത്തിയിട്ടുണ്ട്;
• കൂടാതെ വളരെയധികം, കൂടുതൽ.

സെർച്ച് റോബോട്ടുകളും ഇത് മനസ്സിലാക്കുന്നു, അതിനാൽ ഒരു SEO വീക്ഷണകോണിൽ നിന്ന് ഡോക്യുമെൻ്റ് എത്ര നന്നായി കംപൈൽ ചെയ്തിട്ടുണ്ടെന്നും അതിന് എന്ത് ഘടനയുണ്ടെന്നും നിങ്ങൾ പ്രത്യേകം ശ്രദ്ധിക്കേണ്ടതുണ്ട്.

HTML ഘടന

ഏതൊരു HTML പ്രമാണത്തിനും ഒരു പ്രാരംഭ ഘടനയുണ്ട്, അത് കർശനമായി പാലിക്കേണ്ടതുണ്ട്. ഇത് ഇതുപോലെ കാണപ്പെടുന്നു:

പേജ് ശീർഷകം പേജ് ഉള്ളടക്കം ". ആട്രിബ്യൂട്ടുകൾ, ഒരു ടാഗിൽ ഉണ്ടെങ്കിൽ, ടാഗിൻ്റെ തുടക്കത്തിൽ മാത്രമേ എഴുതുകയുള്ളൂ. ഒരു ടാഗിൻ്റെ ഉള്ളടക്കം ടാഗിൻ്റെ തുടക്കത്തിനും അതിൻ്റെ അവസാനത്തിനും ഇടയിലുള്ളതായി കണക്കാക്കുന്നു.

ബ്ലോക്ക്, ഇൻലൈൻ ഘടകങ്ങൾ വിവരിക്കാൻ HTML നിങ്ങളെ അനുവദിക്കുന്നു. ആദ്യത്തേത് ബ്രൗസർ വിൻഡോയിൽ ഒരു നിശ്ചിത പ്രദേശം ഉൾക്കൊള്ളുന്നു, അത് പൂർണ്ണമായും സ്ഥാപിക്കാൻ കഴിയും, അതായത്, HTML പേജ് ഡിസ്പ്ലേ ഏരിയയിൽ ആവശ്യമുള്ള സ്ഥലത്ത്, ഒരു പ്രത്യേക വലുപ്പമുണ്ട്.

ഇൻലൈൻ ഘടകങ്ങൾ സാധാരണയായി ഒരു ത്രെഡിൽ പ്രദർശിപ്പിക്കും, അതായത്, പേജ് ഫയലിൽ വ്യക്തമാക്കിയതുപോലെ, അവ സ്ക്രീനിൽ പ്രദർശിപ്പിക്കും. പേജ് ലോഡ് ചെയ്യുമ്പോൾ മൊത്തത്തിലുള്ള ഫ്ലോയുടെ ഡിസ്പ്ലേയെ സ്വാധീനിക്കാൻ കഴിയും. ബ്ലോക്ക് ഘടകങ്ങളുടെ പ്ലേസ്‌മെൻ്റ്, ദൃശ്യപരത, മറ്റ് സവിശേഷതകൾ എന്നിവ JavaScript കോഡ് വഴി എപ്പോൾ വേണമെങ്കിലും സ്വാധീനിക്കാനാകും.

ലളിതമായ ഘടകങ്ങൾക്ക് പുറമേ, പട്ടികകളുടെയും ഫോമുകളുടെയും വിവരണം HTML വാഗ്ദാനം ചെയ്യുന്നു. ഈ ഘടകങ്ങൾ "ദൈനംദിന വെബ്സൈറ്റ് നിർമ്മാണത്തിൽ" വലിയ ഡിമാൻഡാണ്.

പട്ടിക വിവരണം: ടാഗുകൾ TABLE, TR, TD

TABLE ടാഗ് ഉപയോഗിച്ച്, നിങ്ങൾക്ക് ഒരു പട്ടിക ഉണ്ടാക്കാം, ഓരോ വരിയിലും നിശ്ചിത എണ്ണം TR വരികളും നിശ്ചിത എണ്ണം TD സെല്ലുകളും വ്യക്തമാക്കാം. സാധാരണ ടാബ്‌ലർ ഓർഗനൈസേഷനിൽ നിന്ന് വ്യത്യസ്തമായി, HTML മാർക്ക്അപ്പിൻ്റെ പ്രത്യേകതകൾ കാരണം, ടാബ്‌ലർ ഓർഗനൈസേഷൻ ഈ പ്രഖ്യാപനത്തിൽ പരിമിതപ്പെടുത്തിയിരിക്കുന്നു, അതിനാൽ, എല്ലാ വരികളിലെയും നിരകളുടെ എണ്ണം തുല്യമായ ഒരു ചതുരാകൃതിയിലുള്ള പട്ടിക ഡെവലപ്പർക്ക് വേണമെങ്കിൽ, അവൻ അത് ചെയ്യണം ഇത് സ്വയം നിരീക്ഷിക്കുക.

എച്ച്.ടി.എം.എൽ. ൻ്റെ തത്ത്വസ്ഥാനം വ്യക്തമാക്കിയിട്ടുള്ളതെല്ലാം ചെയ്യുക എന്നതാണ്, എന്നാൽ ഒന്നും മനസ്സിലാകുന്നില്ല. ചില സന്ദർഭങ്ങളിൽ, പട്ടികയുടെ ഓരോ വരിയിലെയും നിരകളുടെ എണ്ണം അത്ര പ്രധാനമല്ല, എന്നാൽ നിങ്ങൾക്ക് സെല്ലുകൾ ലംബമായോ തിരശ്ചീനമായോ ലയിപ്പിക്കണമെങ്കിൽ, നിങ്ങൾ എല്ലാം വളരെ ശ്രദ്ധാപൂർവ്വം കണക്കാക്കേണ്ടതുണ്ട്.

ലളിതമായ ഒരു പട്ടിക വിവരിക്കുന്ന ഒരു ഉദാഹരണം HTML പേജ് ലേഖനത്തിൽ വ്യക്തമായി കാണിച്ചിരിക്കുന്നു.

മൂന്ന് നിരകളുള്ള മൂന്ന് നിരകളുള്ള ഒരു പട്ടികയാണ് ഇവിടെ കാണിച്ചിരിക്കുന്നത്, ആദ്യ വരിയിൽ TD ടാഗിന് പകരം TH ടാഗ് ഉപയോഗിച്ചു - കോളം തലക്കെട്ട്. ഈ രണ്ട് ടാഗുകളും പ്രത്യേകിച്ച് വ്യത്യസ്തമല്ല, പക്ഷേ പട്ടികയുടെ ആദ്യ വരി വേർതിരിച്ചറിയാൻ ആദ്യത്തേത് ഉപയോഗിക്കുന്നത് തികച്ചും സാദ്ധ്യമാണ്, കൂടാതെ CSS-ൽ നിങ്ങൾക്ക് നിങ്ങളുടെ സ്വന്തം ശൈലി TH- ലേക്ക് അറ്റാച്ചുചെയ്യാം, ഇത് മറ്റ് TD-കളിൽ നിന്ന് വേർതിരിക്കുന്നു.

ഫോം വിവരണം: ടാഗുകൾ ഫോം, ഇൻപുട്ട്

HTML ടാഗുകളുടെ ഏറ്റവും ജനപ്രിയമായ ഭാഗമാണ് ഫോമുകൾ. ഫോമുകൾ ഉപയോഗിച്ച് നിങ്ങൾക്ക് വിവരങ്ങൾ കൈമാറാൻ കഴിയും. യഥാർത്ഥത്തിൽ, പേജ് തന്നെയാണ് വിവരങ്ങളുടെ ഔട്ട്പുട്ട്, എന്നാൽ ഫോം അതിൻ്റെ ഇൻപുട്ടാണ്.

ഒരു ലളിതമായ ഫോം വിവരിക്കുന്ന ഉദാഹരണം HTML പേജ്:

ഫോമുകൾ ഉപയോഗിക്കുന്നതിന് നിരവധി ഓപ്ഷനുകൾ ഉണ്ട്, എന്നാൽ ഇവയാണ് പ്രധാന സാധ്യതകൾ. നിങ്ങൾക്ക് ഇൻപുട്ട് ഫീൽഡുകൾ വ്യക്തമാക്കാനും ഉപയോക്താവ് നൽകിയ ഡാറ്റ വിശകലനം ചെയ്യുന്നതിനായി ഒരു ഡിസൈനും ഹാൻഡ്‌ലറുകളും നൽകാനും കഴിയും. നിങ്ങൾക്ക് മറഞ്ഞിരിക്കുന്ന ഫീൽഡുകൾ വ്യക്തമാക്കാനും പേജിൽ നിന്ന് പശ്ചാത്തല വിവരങ്ങൾ കൈമാറാനും കഴിയും. വിവരങ്ങൾ കൈമാറുന്നതിനുള്ള ബട്ടണുകൾ നിങ്ങൾക്ക് നിയുക്തമാക്കാം, അതിൽ ക്ലിക്കുചെയ്യുന്നതിലൂടെ വിവരങ്ങൾ കൈമാറുന്ന പ്രക്രിയ ആരംഭിക്കുന്നു.

HTML ഉപയോഗിക്കുന്നു

ഹൈപ്പർടെക്സ്റ്റ് ഭാഷ അറിയുന്നത് ഇൻറർനെറ്റ് പ്രോഗ്രാമിംഗ് മേഖലയിലെ ഏത് സ്പെഷ്യലൈസേഷനിലും ഒരു ജോലിയാണ്, എന്നാൽ നിങ്ങൾക്ക് PHP അല്ലെങ്കിൽ JavaScript എന്നിവയിൽ പ്രോഗ്രാമുകൾ എഴുതണമെങ്കിൽ, നിങ്ങൾ HTML + CSS നന്നായി അറിയേണ്ടതുണ്ട്.

മുമ്പത്തെ ഉദാഹരണത്തിൽ PHP ഭാഷ സൂചിപ്പിച്ചിരുന്നു. PHP സെർവറിൽ പ്രവർത്തിക്കുന്നു, അതിനാൽ ഈ ഫോമിലുള്ള പേജ് സെർവറിൽ നിന്ന് ഫീൽഡുകൾ പൂരിപ്പിച്ച ബ്രൗസറിലേക്ക് പറന്നു. പ്രത്യേകിച്ചും, INPUT ടാഗിൽ (ഓൺബ്ലർ ഇവൻ്റ് ഹാൻഡ്‌ലർ) പരാമർശിച്ചിരിക്കുന്ന TestOnBlur ഫംഗ്‌ഷന് എല്ലാ പാരാമീറ്ററുകളും ടെക്‌സ്‌റ്റ് ഫീൽഡുകളായി സ്വീകരിച്ചു.

ജാവാസ്ക്രിപ്റ്റ് ബ്രൗസറിൽ പ്രവർത്തിക്കുന്നു, സെർവറിലേക്ക് ഡാറ്റ തിരികെ അയയ്‌ക്കാൻ ബട്ടൺ ശരിയായി പ്രവർത്തിക്കുന്നതിന്, അതായത്, നിർമ്മാണം: onclick=jQuery("#to").val("cart"), നിങ്ങൾക്ക് ഉണ്ടായിരിക്കണം എന്താണ് jQuery എന്നതിനെ കുറിച്ചുള്ള ഒരു ആശയം മാത്രമല്ല, #to, val, cart എന്താണ്. കൂടുതൽ വ്യക്തമായി പറഞ്ഞാൽ, അടിസ്ഥാന HTML ടാഗുകളും അവയിൽ CSS ശൈലികൾ പ്രയോഗിക്കുന്നതിനുള്ള പൊതു നിയമങ്ങളും നിങ്ങൾ അറിഞ്ഞിരിക്കണം.

ഇൻ്റർനെറ്റ് പ്രോഗ്രാമിംഗ് മേഖലയിലെ ഏതെങ്കിലും സ്പെഷ്യലൈസേഷനിൽ നിങ്ങളുടെ യോഗ്യതകൾ വേഗത്തിൽ മെച്ചപ്പെടുത്താൻ ഇത് മതിയാകും.

അത് "ഹൈപ്പർടെക്സ്റ്റ് മാർക്ക്അപ്പ് ഭാഷ" എന്ന് വിവർത്തനം ചെയ്യുന്നു. ഇൻ്റർനെറ്റ് പേജുകൾ നാവിഗേറ്റ് ചെയ്യുന്നതിനുള്ള ഒരു പ്രത്യേക രീതിയാണ് ഹൈപ്പർടെക്സ്റ്റ്, ഹൈപ്പർടെക്സ്റ്റ് ലിങ്കുകളുടെ രൂപത്തിൽ നടപ്പിലാക്കുന്നു. ഈ ലിങ്കുകളിൽ ക്ലിക്ക് ചെയ്യുന്നതിലൂടെ നിങ്ങൾക്ക് സൈറ്റിൻ്റെ ഘടന എളുപ്പത്തിൽ നാവിഗേറ്റ് ചെയ്യാം. ഈ കേസിലെ പരിവർത്തനങ്ങൾ രേഖീയമായി സംഭവിക്കുന്നില്ല, അതായത്. സൈറ്റിൻ്റെ ഏത് പേജിലേക്കും പോകാൻ നിങ്ങൾക്ക് എല്ലായ്പ്പോഴും അവസരമുണ്ട്, അതിലേക്കുള്ള ലിങ്ക് നിലവിൽ ദൃശ്യമാണ്.

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

HTML കോഡ് എങ്ങനെയാണ് പ്രവർത്തിക്കുന്നത്? HTML കോഡ് എന്നത് പേജ് ഘടകങ്ങളുള്ള ചെറിയ ടാഗുകളുടെ ഒരു കൂട്ടമാണ്. ഈ കോഡുകളെല്ലാം .html അല്ലെങ്കിൽ .htm എന്ന വിപുലീകരണമുള്ള ഒരു ഫയലിൽ സംഭരിച്ചിരിക്കുന്നു. നിങ്ങൾ ഒരു ബ്രൗസറിൽ അത്തരമൊരു ഫയൽ തുറക്കുമ്പോൾ, കോഡ് അത് വ്യാഖ്യാനിക്കുകയും പൂർത്തിയാക്കിയ പേജ് പ്രോഗ്രാം വിൻഡോയിൽ പ്രദർശിപ്പിക്കുകയും ചെയ്യും. HTML മാർക്ക്അപ്പ് ഭാഷ അറിയുന്നതിലൂടെ, മിക്കവാറും ആർക്കും അവരുടെ സ്വന്തം പേജ് സൃഷ്ടിക്കാൻ കഴിയും. ടാഗുകൾ എന്താണ്? ടാഗുകൾ HTML കോഡിനുള്ളിലെ പ്രത്യേക ഘടനകളാണ്. "" ആംഗിൾ ബ്രാക്കറ്റുകൾക്കുള്ളിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്ന പ്ലെയിൻ ടെക്‌സ്‌റ്റാണിത്. മിക്കവാറും എല്ലാ പേജുകളുടെയും HTML കോഡിൽ നിങ്ങൾക്ക് ടാഗുകൾ കാണാൻ കഴിയും. ടാഗുകൾ തന്നെ പേജുകളിൽ പ്രദർശിപ്പിക്കില്ല; ടാഗുകൾ ഉപയോഗിച്ച് എൻകോഡ് ചെയ്ത ഒരു പ്രത്യേക ഘടകം അവ പ്രദർശിപ്പിക്കുന്നു. ഉദാഹരണത്തിന്, ഒരു പേജിൽ ഒരു ചിത്രമുണ്ടെങ്കിൽ, അതിൻ്റെ HTML കോഡിൽ img ടാഗ് അടങ്ങിയിരിക്കുന്നു HTML-ൻ്റെ പരിമിതികൾ ഉയർന്ന നിലവാരമുള്ള ഹൈപ്പർടെക്സ്റ്റ് പേജ് നിർമ്മിക്കാൻ HTML കോഡ് നിങ്ങളെ അനുവദിക്കുന്നു എന്ന വസ്തുത ഉണ്ടായിരുന്നിട്ടും, അതിന് അതിൻ്റെ പരിമിതികളുണ്ട്. അത്തരം കോഡ് മാത്രമുള്ള പേജുകൾ സ്റ്റാറ്റിക് ആണ്, അതായത്. അവർക്ക് ചലനാത്മകത, പ്രത്യേക ഇഫക്റ്റുകൾ, മറ്റ് സവിശേഷതകൾ എന്നിവയില്ല. എന്നാൽ ജാവ സ്ക്രിപ്റ്റ് പോലുള്ള മറ്റ് ഭാഷകൾ ഉപയോഗിച്ച് അവ പരിചയപ്പെടുത്താം. ആധുനിക വെബ്‌സൈറ്റുകളിൽ ഭൂരിഭാഗവും കൂടുതൽ സജീവവും സംവേദനാത്മകവുമാക്കുന്ന അധിക ഭാഷകൾ ഉപയോഗിച്ചാണ് സൃഷ്ടിച്ചിരിക്കുന്നത്.

മോണോസ്‌പേസ് ഫോണ്ടുകളിൽ നിർമ്മിച്ച ലിഖിതങ്ങൾ , ടാഗുകൾ ഉപയോഗിച്ചാണ് നിർമ്മിച്ചിരിക്കുന്നത്. ഈ ടാഗുകൾ ഉപയോഗിക്കുന്നതിൻ്റെ ഫലങ്ങൾ സാധാരണയായി സമാനമാണ്: ഒരു നിശ്ചിത പ്രതീക വലുപ്പവും സ്പെയ്സിംഗും ഉള്ള ഒരു മോണോസ്പേസ്ഡ് ഫോണ്ട്.

ടാഗ് ചെയ്യുക

ഒരു ഇൻലൈൻ കണ്ടെയ്‌നർ ഘടകമാണ് ടാഗ്, അതിലേക്ക് പ്രോഗ്രാം കോഡിൻ്റെ ചെറിയ ശകലങ്ങൾ ചേർക്കാൻ ഉപയോഗിക്കുന്നു, ഉദാഹരണത്തിന്, ഒരു പ്രോഗ്രാമിംഗ് ട്യൂട്ടോറിയലിനെ പ്രതിനിധീകരിക്കുന്ന ഒരു വെബ് ഡോക്യുമെൻ്റിൽ. ബ്രൗസറുകൾ അത്തരം കോഡ് ഒരു മോണോസ്പേസ് ഫോണ്ടിൽ പ്രദർശിപ്പിക്കുന്നു (ഉദാഹരണത്തിന്, കൊറിയർ ന്യൂ). നിങ്ങൾ ഘടകത്തിനൊപ്പം ഈറോ ഉപയോഗിക്കുകയാണെങ്കിൽ

ഫോർമാറ്റ് ചെയ്യാതെ ടെക്‌സ്‌റ്റ് നൽകുന്നതിന് ടാഗ് ഉപയോഗിക്കുന്നു, അതായത് എല്ലാ സ്‌പെയ്‌സുകളും ടാബുകളും ലൈൻ ബ്രേക്കുകളും സംരക്ഷിക്കുന്നു. ഈ ഘടകത്തിനുള്ളിൽ നിങ്ങൾക്ക് മിക്ക ടെക്സ്റ്റ് ഫോർമാറ്റിംഗ് ഘടകങ്ങളും പ്രയോഗിക്കാൻ കഴിയും.

ശ്രദ്ധിക്കുക: HTML-ൽ, ലൈൻ ബ്രേക്കുകൾ, തുടർച്ചയായ ഇടങ്ങൾ, ടാബുകൾ എന്നിവ അവഗണിക്കപ്പെടും. ഒരു നിരയിലെ നിരവധി ഇടങ്ങൾ ഒരു ഇടമായി കണക്കാക്കുന്നു.

ഉദാഹരണം: മൂലകങ്ങളുടെ ഉപയോഗം കൂടാതെ

• സ്വയം പരീക്ഷിച്ചു നോക്കൂ"

ഒരു ഘടകത്തിനുള്ളിൽ, ബ്രൗസർ അഭിമുഖീകരിക്കുന്ന എല്ലാ സ്ഥലങ്ങളും അല്ലെങ്കിൽ ലൈൻ ബ്രേക്കുകളും ഡ്യൂപ്ലിക്കേറ്റ് ചെയ്യുന്നു, നിങ്ങളുടെ യഥാർത്ഥ ഫോർമാറ്റിംഗ് സംരക്ഷിക്കുന്നു.

എങ്കിൽ (document.getElementsByClassName) ( x = document.getElementsByClassName("pagination") എങ്കിൽ (x.length>y) ( x.style.visibility = "hidden"; )

"പ്രീ" എലമെൻ്റിനുള്ളിൽ, ബ്രൗസർ അത് നേരിടുന്ന എല്ലാ സ്‌പെയ്‌സും ലൈൻ ബ്രേക്കുകളും ഡ്യൂപ്ലിക്കേറ്റ് ചെയ്യുന്നു, നിങ്ങളുടെ യഥാർത്ഥ ഫോർമാറ്റിംഗ് സംരക്ഷിക്കുന്നു.

എങ്കിൽ (document.getElementsByClassName) (x = document.getElementsByClassName("pagination") എങ്കിൽ (x.length>y) ( x.style.visibility = "മറഞ്ഞിരിക്കുന്നു"; )

ടാഗുകളും

കീബോർഡ് ഉപയോഗിച്ച് ഉപയോക്താവ് നൽകിയ കോഡിൻ്റെ ഒരു ഭാഗം ടാഗ് അടയാളപ്പെടുത്തുന്നു. ചില ബ്രൗസറുകൾ അത്തരം ടെക്‌സ്‌റ്റ് അധിക പശ്ചാത്തലത്തിൽ അടയാളപ്പെടുത്തുന്നു.
നിങ്ങൾ ഒരു കൺട്രോൾ സ്‌ക്രിപ്റ്റ് നൽകിയതിന് ശേഷം കൺസോൾ വിൻഡോയിൽ ദൃശ്യമാകുന്ന ടെക്‌സ്‌റ്റ് പോലുള്ള കമ്പ്യൂട്ടർ ഔട്ട്‌പുട്ട് സൃഷ്‌ടിക്കാൻ ടാഗ് ഉപയോഗിക്കുന്നു. അപൂർവ്വമായി ഉപയോഗിക്കപ്പെടുന്ന ഈ ഘടകം അതിൻ്റെ ഉള്ളടക്കങ്ങൾ , , പോലെയുള്ള ഒരു മോണോസ്പേസ്ഡ് ഫോണ്ടിൽ പ്രദർശിപ്പിക്കുന്നു.

ഉദാഹരണം: ഘടകങ്ങൾ കൂടാതെ

• സ്വയം പരീക്ഷിച്ചു നോക്കൂ"

കീബോർഡിൽ നിന്ന് ഉപയോക്താവ് നൽകേണ്ട വാചകം നൽകുക
കണ്ടെയ്നർ ഘടകം "kbd".

വാചകം നൽകുക: കീബോർഡിൽ നിന്ന് നൽകിയ വാചകമാണിത്

"സാമ്പ്" കണ്ടെയ്നറിൽ സ്ഥാപിച്ചിരിക്കുന്ന വാചകമാണിത്

ടാഗ് ചെയ്യുക

പ്രോഗ്രാം കോഡിലെ വേരിയബിളുകൾ കൂടുതൽ ഹൈലൈറ്റ് ചെയ്യാൻ ടാഗ് ഉപയോഗിക്കുന്നു. ഇത് ഒരു ഗണിത എക്സ്പ്രഷനിലോ പ്രോഗ്രാം പാരാമീറ്ററിലോ ഒരു വേരിയബിളിനെ തിരിച്ചറിയുന്നു, സാധാരണയായി ഇറ്റാലിക്സിൽ കാണിക്കുന്നു.

ഉദാഹരണം: ഘടകങ്ങൾ

• സ്വയം പരീക്ഷിച്ചു നോക്കൂ"

ശരീര ഗതികോർജ്ജം:

ശരീര ഗതികോർജ്ജം:

Wк = mv2/2

ചുമതലകൾ അന്തിമ ചുമതല

ഈ പാഠത്തിൽ, മോണോസ്പേസ്ഡ് ഫോണ്ടിൽ ഉള്ളടക്കം പ്രദർശിപ്പിക്കുന്ന ടാഗുകളെക്കുറിച്ചും കോഡിലെ വേരിയബിളുകൾ ഹൈലൈറ്റ് ചെയ്യുന്നതിനെക്കുറിച്ചും പ്രീ-ഫോർമാറ്റിംഗ് ടാഗുകളെക്കുറിച്ചും നിങ്ങൾ പഠിച്ചു. ഗണിത പദപ്രയോഗങ്ങളും പ്രോഗ്രാം കോഡും ഉപയോഗിച്ച് പ്രവർത്തിക്കുമ്പോൾ അവയെല്ലാം പ്രധാനമാണ്.

നിങ്ങൾ പഠിച്ച കാര്യങ്ങൾ അവലോകനം ചെയ്യാനും മൂന്ന് ലളിതമായ ജോലികൾ പൂർത്തിയാക്കാനുമുള്ള സമയമാണിത്:

വേരിയബിൾ

• സ്വയം തീരുമാനിക്കൂ"

HTML ഘടകങ്ങൾ ഉപയോഗിച്ച്, മുകളിലുള്ള സമവാക്യത്തിൽ y എന്ന അക്ഷരത്തെ ഒരു വേരിയബിളായി നിയോഗിക്കുക.

വേരിയബിൾ

പരാബോള സമവാക്യം y = Nx2

വേരിയബിൾ

പരാബോള സമവാക്യം y = Nx2

മുൻകൂട്ടി ഫോർമാറ്റ് ചെയ്ത വാചകം

• സ്വയം തീരുമാനിക്കൂ"

HTML ഘടകം ഉപയോഗിച്ച്, കോഡ് എലമെൻ്റിൽ സ്ഥാപിച്ചിരിക്കുന്ന ടെക്‌സ്‌റ്റ് എല്ലാ വൈറ്റ്‌സ്‌പെയ്‌സും ലൈൻ ബ്രേക്കുകളും ഉപയോഗിച്ച് ബ്രൗസറിൽ ദൃശ്യമാക്കുക.