CSS: ക്ലാസും ഐഡിയും തമ്മിലുള്ള വ്യത്യാസം എന്താണ്. HTML-ൽ നിന്ന് CSS എങ്ങനെ വ്യത്യാസപ്പെട്ടിരിക്കുന്നു?

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

അതിനാൽ, TheDifference.ru HTML, CSS എന്നിവയ്ക്കിടയിൽ ഇനിപ്പറയുന്ന വ്യത്യാസങ്ങൾ കണ്ടെത്തി:

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

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

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

പ്രയോജനങ്ങൾ:

വ്യത്യസ്ത കാഴ്ച ഉപകരണങ്ങൾക്കായി നിരവധി പേജ് ഡിസൈനുകൾ. ഉദാഹരണത്തിന്, ഒരു സ്ക്രീനിൽ ഡിസൈൻ ഒരു വലിയ വീതിയിൽ രൂപകൽപ്പന ചെയ്തിരിക്കും, പ്രിൻ്റിംഗ് സമയത്ത് മെനു പ്രദർശിപ്പിക്കില്ല, എന്നാൽ ഒരു PDA, സെൽ ഫോണിൽ മെനു ഉള്ളടക്കം പിന്തുടരും.

ഡാറ്റാ അവതരണ നിയമങ്ങൾ കൈമാറുന്നതിലൂടെ വെബ്സൈറ്റ് പേജുകൾ ലോഡ് ചെയ്യുന്ന സമയം കുറയ്ക്കുന്നു പ്രത്യേക CSS ഫയൽ. ഈ സാഹചര്യത്തിൽ, പേജിൽ സംഭരിച്ചിരിക്കുന്ന ഡോക്യുമെൻ്റ് ഘടനയും ഡാറ്റയും മാത്രമേ ബ്രൗസർ ഡൗൺലോഡ് ചെയ്യുകയുള്ളൂ, കൂടാതെ ആ ഡാറ്റയുടെ പ്രാതിനിധ്യം ബ്രൗസർ ഒരിക്കൽ മാത്രം ഡൗൺലോഡ് ചെയ്യുകയും കാഷെ ചെയ്യപ്പെടുകയും ചെയ്യും.

    പിന്നീട് ഡിസൈൻ മാറ്റാൻ എളുപ്പമാണ്. നിങ്ങൾ എല്ലാ പേജും എഡിറ്റ് ചെയ്യേണ്ടതില്ല, CSS ഫയൽ മാറ്റുക.

അധിക ഡിസൈൻ ഓപ്ഷനുകൾ. ഉദാഹരണത്തിന്, കൂടെ CSS ഉപയോഗിക്കുന്നു-ലേഔട്ട്, നിങ്ങൾക്ക് ടെക്‌സ്‌റ്റിൻ്റെ ഒരു ബ്ലോക്ക് ഉണ്ടാക്കാം, അത് ബാക്കിയുള്ള ടെക്‌സ്‌റ്റിന് ചുറ്റും (ഉദാഹരണത്തിന്, ഒരു മെനുവിന്) അല്ലെങ്കിൽ പേജ് സ്‌ക്രോൾ ചെയ്യുമ്പോൾ മെനു എപ്പോഴും ദൃശ്യമാണെന്ന് ഉറപ്പാക്കുക.

പോരായ്മകൾ:

ഒരേ CSS3 ഡാറ്റയെ വ്യത്യസ്തമായി വ്യാഖ്യാനിക്കുന്ന വ്യത്യസ്ത ബ്രൗസറുകളിൽ (പ്രത്യേകിച്ച് പഴയവ) വ്യത്യസ്ത ലേഔട്ട് ഡിസ്പ്ലേകൾ.

ഒരു CSS ഫയൽ മാത്രമല്ല, സങ്കീർണ്ണവും അവ്യക്തവുമായ രീതിയിൽ CSS3 സെലക്ടറുകളുമായി ബന്ധപ്പെട്ട HTML ടാഗുകളും പരിഹരിക്കേണ്ടത് പലപ്പോഴും പ്രായോഗികമായി ആവശ്യമാണ്, ഇത് ചിലപ്പോൾ ഉപയോഗ എളുപ്പത്തെ നിഷേധിക്കുന്നു. ഒറ്റ ഫയലുകൾശൈലികളും എഡിറ്റിംഗും ടെസ്റ്റിംഗ് സമയവും ഗണ്യമായി വർദ്ധിപ്പിക്കുന്നു.

വ്യത്യാസങ്ങൾCSS3:

    പുതിയ ശൈലികൾ

    കപട-തിരഞ്ഞെടുപ്പുകാർ

    ആനിമേഷൻ

    ക്യാൻവാസ് പിന്തുണ

    രൂപാന്തരം

    ടാഗ് ഉള്ളടക്ക മാനേജ്മെൻ്റ്

    ...കൂടുതൽ

2.2.3 js ഭാഷയുടെയും jQuery ലൈബ്രറിയുടെയും സംക്ഷിപ്ത അവലോകനം

ജാവാസ്ക്രിപ്റ്റ്

ജാവാസ്ക്രിപ്റ്റ് ഒരു പ്രോട്ടോടൈപ്പ്-ഓറിയൻ്റഡ് സ്ക്രിപ്റ്റിംഗ് പ്രോഗ്രാമിംഗ് ഭാഷയാണ്. ഇത് ECMAScript ഭാഷയുടെ ഒരു ഭാഷാഭേദമാണ്.

ജാവാസ്ക്രിപ്റ്റ് സാധാരണയായി എംബഡഡ് ഭാഷയായി ഉപയോഗിക്കുന്നു സോഫ്റ്റ്വെയർ ആക്സസ്ആപ്ലിക്കേഷൻ ഒബ്ജക്റ്റുകളിലേക്ക്. വെബ് പേജുകളിൽ ഇൻ്ററാക്റ്റിവിറ്റി ചേർക്കുന്നതിനുള്ള ഒരു സ്ക്രിപ്റ്റിംഗ് ഭാഷയായി ബ്രൗസറുകളിൽ ഇത് ഏറ്റവും വ്യാപകമായി ഉപയോഗിക്കുന്നു.

പ്രധാന വാസ്തുവിദ്യാ സവിശേഷതകൾ: ഡൈനാമിക് ടൈപ്പിംഗ്, ദുർബലമായ ടൈപ്പിംഗ്, ഓട്ടോമാറ്റിക് മെമ്മറി മാനേജ്മെൻ്റ്, പ്രോട്ടോടൈപ്പ് പ്രോഗ്രാമിംഗ്, ഫസ്റ്റ്-ക്ലാസ് ഒബ്ജക്റ്റുകളായി പ്രവർത്തിക്കുന്നു.

ജാവാസ്ക്രിപ്റ്റ് നിരവധി ഭാഷകളാൽ സ്വാധീനിക്കപ്പെട്ടിട്ടുണ്ട്, കൂടാതെ ഭാഷയെ ജാവയ്ക്ക് സമാനമാക്കുക എന്ന ലക്ഷ്യത്തോടെ വികസിപ്പിച്ചെടുത്തതാണ്, എന്നാൽ അതേ സമയം പ്രോഗ്രാമർമാർ അല്ലാത്തവർക്ക് ഉപയോഗിക്കാൻ എളുപ്പമാണ്. JavaScript ഭാഷ ഏതെങ്കിലും കമ്പനിയുടെയോ ഓർഗനൈസേഷൻ്റെയോ ഉടമസ്ഥതയിലുള്ളതല്ല, ഇത് വെബ് വികസനത്തിൽ ഉപയോഗിക്കുന്ന നിരവധി പ്രോഗ്രാമിംഗ് ഭാഷകളിൽ നിന്ന് വ്യത്യസ്തമാക്കുന്നു.

"JavaScript" എന്ന പേര് ഒരു രജിസ്റ്റർ ചെയ്ത വ്യാപാരമുദ്രയാണ് ഒറാക്കിൾകോർപ്പറേഷൻ.

ഭാഷാ സവിശേഷതകൾ

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

വാക്യഘടന സിക്ക് സമാനമാണെങ്കിലും, സി ഭാഷയുമായി താരതമ്യപ്പെടുത്തുമ്പോൾ ജാവാസ്ക്രിപ്റ്റിന് അടിസ്ഥാനപരമായ വ്യത്യാസങ്ങളുണ്ട്:

    ആത്മപരിശോധനയുടെ സാധ്യതയുള്ള വസ്തുക്കൾ

    ഫസ്റ്റ് ക്ലാസ് ഒബ്ജക്റ്റുകളായി പ്രവർത്തിക്കുന്നു

    ഓട്ടോമാറ്റിക് തരം കാസ്റ്റിംഗ്

    ഓട്ടോമാറ്റിക് മാലിന്യ ശേഖരണം

ഭാഷയ്ക്ക് അത്തരം ഉപയോഗപ്രദമായ കാര്യങ്ങൾ ഇല്ല:

മോഡുലാർ സിസ്റ്റം: ഡിപൻഡൻസികളും സ്കോപ്പ് ഐസൊലേഷനും കൈകാര്യം ചെയ്യാനുള്ള കഴിവ് JavaScript നൽകുന്നില്ല

സ്റ്റാൻഡേർഡ് ലൈബ്രറി: പ്രത്യേകിച്ചും, ഫയൽ സിസ്റ്റത്തിൽ പ്രവർത്തിക്കുന്നതിനും I/O സ്ട്രീമുകൾ കൈകാര്യം ചെയ്യുന്നതിനും അല്ലെങ്കിൽ ബൈനറി ഡാറ്റയ്ക്കുള്ള അടിസ്ഥാന തരങ്ങൾക്കും ആപ്ലിക്കേഷൻ പ്രോഗ്രാമിംഗ് ഇൻ്റർഫേസ് ഇല്ല.

വെബ് സെർവറുകളിലേക്കും ഡാറ്റാബേസുകളിലേക്കും സ്റ്റാൻഡേർഡ് ഇൻ്റർഫേസുകൾ

ഡിപൻഡൻസികൾ ട്രാക്ക് ചെയ്യുകയും അവ യാന്ത്രികമായി ഇൻസ്റ്റാൾ ചെയ്യുകയും ചെയ്യുന്ന ഒരു പാക്കേജ് മാനേജ്മെൻ്റ് സിസ്റ്റം

അർത്ഥശാസ്ത്രവും വാക്യഘടനയും:

വാക്യഘടന ജാവാസ്ക്രിപ്റ്റ് ഭാഷപല തരത്തിൽ സി, ജാവ എന്നിവയുടെ വാക്യഘടനയോട് സാമ്യമുണ്ട്, എന്നാൽ അർത്ഥപരമായി ഭാഷ സെൽഫ്, സ്മോൾടോക്ക് അല്ലെങ്കിൽ ലിസ്പ് എന്നിവയുമായി വളരെ അടുത്താണ്.

എല്ലാ ഐഡൻ്റിഫയറുകളും കേസ് സെൻസിറ്റീവ് ആണ്

വേരിയബിൾ പേരുകൾക്ക് അക്ഷരങ്ങൾ, അടിവരകൾ, ഡോളർ ചിഹ്നങ്ങൾ, അറബി അക്കങ്ങൾ എന്നിവ ഉപയോഗിക്കാം.

വേരിയബിൾ പേരുകൾ ഒരു സംഖ്യയിൽ ആരംഭിക്കാൻ കഴിയില്ല

സിംഗിൾ-ലൈൻ കമൻ്റുകൾ ഫോർമാറ്റ് ചെയ്യാൻ, // എന്നത് മൾട്ടി-ലൈൻ, ഇൻ-ലൈൻ കമൻ്റുകൾ /* ഉപയോഗിച്ച് ആരംഭിച്ച് */ എന്നതിൽ അവസാനിക്കുന്നു;

ഭാഷാ ഘടന:

ഘടനാപരമായി, പരസ്പരം വ്യക്തമായി വേർതിരിച്ചറിയാൻ കഴിയുന്ന മൂന്ന് ഭാഗങ്ങളുടെ സംയോജനമായി JavaScript പ്രതിനിധീകരിക്കാം:

കേർണൽ (ECMAScript)

ബ്രൗസർ ഒബ്‌ജക്‌റ്റ് മോഡൽ (BOM)

ഡോക്യുമെൻ്റ് ഒബ്ജക്റ്റ് മോഡൽ (DOM)

ബ്രൗസർ ഇതര പരിതസ്ഥിതികളിലാണ് JavaScript കാണുന്നതെങ്കിൽ, ബ്രൗസർ ഒബ്‌ജക്റ്റ് മോഡലും ഡോക്യുമെൻ്റ് ഒബ്‌ജക്റ്റ് മോഡലും പിന്തുണയ്‌ക്കില്ല.

ഡോക്യുമെൻ്റ് ഒബ്‌ജക്റ്റ് മോഡൽ ചിലപ്പോൾ JavaScript-ൽ നിന്ന് ഒരു പ്രത്യേക എൻ്റിറ്റിയായി വീക്ഷിക്കപ്പെടുന്നു, ഇത് ഒരു ഭാഷാ-സ്വതന്ത്ര ഡോക്യുമെൻ്റ് ഇൻ്റർഫേസ് എന്ന നിലയിൽ DOM-ൻ്റെ നിർവചനവുമായി പൊരുത്തപ്പെടുന്നു. വ്യത്യസ്തമായി, നിരവധി രചയിതാക്കൾ BOM ഉം DOM ഉം അടുത്ത ബന്ധമുള്ളതായി കാണുന്നു.

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

ബ്രൗസർ ഒബ്ജക്റ്റ് മോഡൽ

ബ്രൗസർ ഒബ്‌ജക്റ്റ് മോഡൽ എന്നത് ഭാഷയുടെ ഒരു ബ്രൗസർ-നിർദ്ദിഷ്ട ഭാഗമാണ്, അത് കേർണലിനും ഡോക്യുമെൻ്റ് ഒബ്‌ജക്റ്റ് മോഡലിനും ഇടയിലുള്ള ഒരു പാളിയാണ്. പ്രധാന ഉദ്ദേശം ഒബ്ജക്റ്റ് മോഡൽബ്രൗസർ - ബ്രൗസർ വിൻഡോകൾ നിയന്ത്രിക്കുകയും അവയുടെ ഇടപെടൽ ഉറപ്പാക്കുകയും ചെയ്യുന്നു. ഓരോ ബ്രൗസർ വിൻഡോയും ഒരു വിൻഡോ ഒബ്‌ജക്‌റ്റ്, സെൻട്രൽ DOM ഒബ്‌ജക്‌റ്റ് പ്രതിനിധീകരിക്കുന്നു. ബ്രൗസർ ഒബ്ജക്റ്റ് മോഡൽ ആ നിമിഷത്തിൽസ്റ്റാൻഡേർഡ് അല്ല, എന്നാൽ സ്പെസിഫിക്കേഷൻ WHATWG, W3C എന്നിവ വികസിപ്പിച്ചുകൊണ്ടിരിക്കുന്നു

വിൻഡോ മാനേജ്‌മെൻ്റിന് പുറമേ, ബ്രൗസർ ഒബ്‌ജക്റ്റ് മോഡലിൻ്റെ ഭാഗമായി ഇനിപ്പറയുന്ന എൻ്റിറ്റികൾക്ക് ബ്രൗസറുകൾ സാധാരണയായി പിന്തുണ നൽകുന്നു:

ഫ്രെയിം മാനേജ്മെൻ്റ്

കോഡ് എക്‌സിക്യൂഷനിലെ കാലതാമസത്തെയും ലൂപ്പിംഗിലെ കാലതാമസത്തെയും പിന്തുണയ്ക്കുന്നു

സിസ്റ്റം ഡയലോഗുകൾ

തുറന്ന പേജിൻ്റെ വിലാസം കൈകാര്യം ചെയ്യുന്നു

ബ്രൗസർ വിവരങ്ങൾ കൈകാര്യം ചെയ്യുന്നു

മോണിറ്റർ ക്രമീകരണ വിവരങ്ങൾ കൈകാര്യം ചെയ്യുന്നു

പരിമിതമായ ബ്രൗസിംഗ് ചരിത്ര മാനേജ്മെൻ്റ്

HTTP കുക്കി പിന്തുണ

ഡോക്യുമെൻ്റ് ഒബ്ജക്റ്റ് മോഡൽ

HTML, XML ഡോക്യുമെൻ്റുകൾക്കായുള്ള ഒരു ആപ്ലിക്കേഷൻ പ്രോഗ്രാമിംഗ് ഇൻ്റർഫേസാണ് ഡോക്യുമെൻ്റ് ഒബ്ജക്റ്റ് മോഡൽ. DOM അനുസരിച്ച്, ഒരു ഡോക്യുമെൻ്റിനെ (ഉദാഹരണത്തിന്, ഒരു വെബ് പേജ്) ഒബ്‌ജക്റ്റുകളുടെ ഒരു വൃക്ഷമായി പ്രതിനിധീകരിക്കാം, അതിൽ വിവിധ കൃത്രിമങ്ങൾ അനുവദിക്കുന്ന നിരവധി ഗുണങ്ങളുണ്ട്:

നോഡുകൾ സൃഷ്ടിക്കുകയും കൂട്ടിച്ചേർക്കുകയും ചെയ്യുന്നു

നോഡുകൾ ലഭിക്കുന്നു

നോഡുകൾ മാറ്റുന്നു

നോഡുകൾ തമ്മിലുള്ള കണക്ഷനുകൾ മാറ്റുന്നു

നോഡുകൾ നീക്കംചെയ്യുന്നു.

jQuery - ജാവാസ്ക്രിപ്റ്റ് ലൈബ്രറി, ഇത് JavaScript, HTML എന്നിവയുടെ ഇടപെടലിൽ ശ്രദ്ധ കേന്ദ്രീകരിക്കുന്നു. jQuery ലൈബ്രറി നിങ്ങളെ ഏത് DOM എലമെൻ്റും ആക്‌സസ് ആട്രിബ്യൂട്ടുകളും ഉള്ളടക്കവും എളുപ്പത്തിൽ ആക്‌സസ് ചെയ്യാൻ സഹായിക്കുന്നു DOM ഘടകങ്ങൾ, അവ കൈകാര്യം ചെയ്യുക. AJAX-നൊപ്പം പ്രവർത്തിക്കാൻ jQuery ലൈബ്രറി സൗകര്യപ്രദമായ API നൽകുന്നു.

സാധ്യതകൾ

ക്രോസ്-ബ്രൗസർ CSS സെലക്ടർ എഞ്ചിൻ Sizzle, ഒരു പ്രത്യേക പ്രോജക്റ്റിലേക്ക് മാറ്റി

ഒരു പ്ലഗിൻ ആയി XPath-നുള്ള പിന്തുണ ഉൾപ്പെടെ DOM ട്രീയിലൂടെ സഞ്ചരിക്കുന്നു

ഇവൻ്റുകൾ

വിഷ്വൽ ഇഫക്റ്റുകൾ

AJAX ആഡ്-ഓണുകൾ

JavaScript പ്ലഗിനുകൾ

jQuery-യിൽ പ്രവർത്തിക്കുന്നത് 2 തരങ്ങളായി തിരിക്കാം:

    $() ഫംഗ്‌ഷൻ ഉപയോഗിച്ച് ഒരു jQuery ഒബ്‌ജക്റ്റ് നേടുന്നു. ഉദാഹരണത്തിന്, ഒരു CSS സെലക്ടർ അതിലേക്ക് കടത്തിവിടുന്നതിലൂടെ, നിങ്ങൾക്ക് മാനദണ്ഡത്തിന് കീഴിലുള്ള എല്ലാ HTML ഘടകങ്ങളുടെയും ഒരു jQuery ഒബ്‌ജക്റ്റ് നേടാനും തുടർന്ന് jQuery ഒബ്‌ജക്റ്റിൻ്റെ വിവിധ രീതികൾ ഉപയോഗിച്ച് അവയ്‌ക്കൊപ്പം പ്രവർത്തിക്കാനും കഴിയും. രീതി ഒരു മൂല്യവും നൽകേണ്ടതില്ലെങ്കിൽ, അത് jQuery ഒബ്‌ജക്റ്റിലേക്ക് ഒരു റഫറൻസ് നൽകുന്നു, ഇത് ഒരു ഫ്ലൂയിഡ് ഇൻ്റർഫേസ് എന്ന ആശയം അനുസരിച്ച് മെത്തേഡ് കോളുകൾ ചെയിൻ ചെയ്യാൻ നിങ്ങളെ അനുവദിക്കുന്നു.

    $ ഒബ്ജക്റ്റിൽ ആഗോള രീതികൾ വിളിക്കുന്നു, ഉദാഹരണത്തിന്, സൗകര്യപ്രദമായ അറേ ഇറ്ററേറ്ററുകൾ.

CSS ഉം HTML ഉം തമ്മിലുള്ള വ്യത്യാസം മനസിലാക്കാൻ, CSS എന്താണെന്നും HTML എന്താണെന്നും നിങ്ങൾ മനസ്സിലാക്കേണ്ടതുണ്ട്.
ഇംഗ്ലീഷിൽ നിന്ന് വിവർത്തനം ചെയ്താൽ, CSS എന്നാൽ "കാസ്കേഡിംഗ് സ്റ്റൈൽ ഷീറ്റുകൾ" എന്നാണ്. ഒരു വെബ് പേജിൻ്റെ രൂപകൽപ്പന കൈകാര്യം ചെയ്യുന്നതിനുള്ള ഒരു സാങ്കേതികവിദ്യയാണ് CSS, ഒരു പേജിൻ്റെ രൂപം വിവരിക്കുന്നതിന് ഇത് നിരവധി ഓപ്ഷനുകൾ നൽകുന്നു, കൂടാതെ പേജ് ഘടകങ്ങളുടെ രൂപകൽപ്പന ഒരു CSS ഫയലിലേക്ക് മാറ്റിക്കൊണ്ട് ഒരു HTML പേജിൻ്റെ രൂപം ഗണ്യമായി ലളിതമാക്കാനും ഇത് നിങ്ങളെ അനുവദിക്കുന്നു. . പരിധിയില്ലാത്ത HTML പേജ് ഘടകങ്ങൾക്കായി ഒരു ഡിസൈൻ ഉപയോഗിക്കുന്നത് CSS സാധ്യമാക്കുന്നു. ഡിസൈനിനായി ഒരു ക്ലാസ് ഉപയോഗിക്കുന്ന എല്ലാ പേജുകളിലെയും സൈറ്റിൻ്റെ എല്ലാ പേജുകളിലും ഡിസൈൻ മാറ്റാൻ ഇത് നിങ്ങളെ അനുവദിക്കുന്നു, CSS ഫയലിൽ ഒരിക്കൽ അത് മാറ്റുന്നു, സൈറ്റിന് 50 പേജുകളിൽ കൂടുതൽ ഉണ്ടെങ്കിൽ ഇത് വളരെ സൗകര്യപ്രദമാണ്, നിങ്ങൾ മാറ്റേണ്ടതില്ല അവയിൽ ഓരോന്നിലും മൂലകത്തിൻ്റെ രൂപകൽപ്പന.
എന്താണിത് HTML? ഇംഗ്ലീഷിൽ നിന്ന് വിവർത്തനം ചെയ്താൽ, HTML എന്നാൽ "ഹൈപ്പർടെക്സ്റ്റ് മാർക്കപ്പ് ലാംഗ്വേജ്" എന്നാണ്. HTML ആണ് അടിസ്ഥാന ഭാഷ HTML മാർക്ക്അപ്പ്പ്രമാണങ്ങൾ. ഒരു HTML പേജിൻ്റെ ഉള്ളടക്കം രൂപപ്പെടുത്തുന്നതിന് ഹൈപ്പർടെക്സ്റ്റ് മാർക്ക്അപ്പ് ഭാഷ നേരിട്ട് ഉപയോഗിക്കുന്നു. അതിൻ്റെ സഹായത്തോടെ, നിങ്ങൾക്ക് പട്ടികകൾ സൃഷ്ടിക്കാനും അവ രൂപകൽപ്പന ചെയ്യാനും ടെക്സ്റ്റുകൾക്കായി ഡിസൈനുകൾ സൃഷ്ടിക്കാനും കഴിയും.
ഉപയോഗിക്കാതെ തന്നെ HTML പേജുകൾ സി.എസ്.എസ്സങ്കീർണ്ണവും ആശയക്കുഴപ്പമുണ്ടാക്കുന്നതുമാണ്, കാരണം ഓരോ ഘടകത്തിനും വേണ്ടിയുള്ള ഡിസൈൻ പുതിയതായി എഴുതിയിരിക്കുന്നു, ഇത് ടെക്സ്റ്റിൻ്റെ അളവ് ഗണ്യമായി വർദ്ധിപ്പിക്കുന്നു. ഉദാഹരണത്തിന്, ഒരേ രീതിയിൽ ഫോർമാറ്റ് ചെയ്യേണ്ട ടെക്സ്റ്റിൻ്റെ 3 ഭാഗങ്ങൾ ഉൾക്കൊള്ളുന്ന ഒരു HTML പേജ് ഉണ്ട് (വലിപ്പം, നിറം), എന്നാൽ ഈ ശകലങ്ങൾ സ്ഥിതി ചെയ്യുന്നതിനാൽ ഇവ മൂന്നും ഒരേസമയം ഫോർമാറ്റ് ചെയ്യാൻ HTML ടാഗുകൾ ഉപയോഗിക്കാൻ കഴിയില്ല. HTML പേജിലെ വിവിധ സ്ഥലങ്ങളിൽ. അത്തരം ടെക്സ്റ്റുകൾ ഫോർമാറ്റ് ചെയ്യുന്നതിന്, ഓരോ ശകലത്തിനും പ്രത്യേകം ഓരോ തവണയും കോഡ് ഉപയോഗിക്കേണ്ടത് ആവശ്യമാണ്.
CSS ഉപയോഗിക്കുമ്പോൾ, ഞങ്ങൾ ക്ലാസ്സിനായി ഒരു ഡിസൈൻ ഒരിക്കൽ സൃഷ്ടിക്കും, തുടർന്ന് HTML പേജ് കോഡിൽ ഈ ക്ലാസ് മൂന്ന് ശകലങ്ങളിൽ ഓരോന്നിനും ഞങ്ങൾ നിയോഗിക്കും. ഇപ്പോൾ HTML കോഡ് ഇപ്പോൾ വലുതായി കാണുന്നില്ല, അല്ലേ? ഒരു CSS ഘടകം മാത്രം മാറ്റുന്നതിലൂടെ, സൈറ്റിൻ്റെ എല്ലാ പേജുകളുടെയും രൂപകൽപ്പന ഒരേസമയം മാറ്റാൻ ഞങ്ങൾക്ക് കഴിയും. ഈ പേജുകൾ ആയിരക്കണക്കിന് ഉണ്ടാകാം.

നിഗമനങ്ങളുടെ വെബ്സൈറ്റ്

  1. ഒരു വെബ് പേജ് സൃഷ്ടിക്കുന്ന ഭാഷയാണ് HTML. ഈ വെബ് പേജിൻ്റെ രൂപകൽപ്പന നിയന്ത്രിക്കുന്ന സാങ്കേതികവിദ്യയാണ് CSS.
  2. ഒരു പേജ് ഡിസൈൻ വീക്ഷണകോണിൽ നിന്ന്, HTML-ൽ ഡിസൈൻ എഴുതുന്നതിനേക്കാൾ CSS കൂടുതൽ സൗകര്യപ്രദമാണ്, കാരണം കോഡിൻ്റെ വലുപ്പം ഗണ്യമായി കുറയ്ക്കാനും ഒരേസമയം നിരവധി പേജുകൾക്കായി ഡിസൈൻ സജ്ജമാക്കാനും നിങ്ങളെ അനുവദിക്കുന്നു.

HTML-ൽ നിന്ന് CSS എങ്ങനെ വ്യത്യാസപ്പെട്ടിരിക്കുന്നു?

പ്രമാണത്തിൻ്റെ ഉള്ളടക്കങ്ങൾ അടയാളപ്പെടുത്തുന്നതിന് മാത്രമായിരുന്നു തുടക്കത്തിൽ html ഉപയോഗിച്ചിരുന്നത് എന്നതാണ് വസ്തുത. ആ. അതിൻ്റെ സഹായത്തോടെ ഇതൊരു ഖണ്ഡികയാണെന്നും ഇത് ഒരു പട്ടികയാണെന്നും ഇതൊരു ചിത്രമാണെന്നും സൂചിപ്പിച്ചു.

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

css ഉം html ഉം തമ്മിലുള്ള വ്യത്യാസത്തിൻ്റെ മറ്റൊരു ഉദാഹരണം ഇതാ:

100 പേജുകളുടെ സ്വഭാവത്തെക്കുറിച്ച് ഒരു വെബ്‌സൈറ്റ് നിർമ്മിക്കാനുള്ള ചുമതലയാണ് ഞങ്ങൾ നേരിടുന്നതെന്ന് പറയാം. നിങ്ങൾ മനസ്സിലാക്കുന്നതുപോലെ, നല്ല പെരുമാറ്റ നിയമങ്ങൾ അനുസരിച്ച്, മുഴുവൻ സൈറ്റും ഒരേ ശൈലിയിൽ നിർമ്മിക്കണം, ഉദാഹരണത്തിന്, പച്ച പശ്ചാത്തലം, വെർദാന ഫോണ്ട് വലുപ്പം 14, ചുവപ്പ് നിറത്തിലുള്ള ലിങ്കുകൾ.

ഞങ്ങൾ അത്തരമൊരു സൈറ്റ് ശുദ്ധമായ html-ൽ നിർമ്മിക്കുകയാണെങ്കിൽ, ഓരോന്നിലും പുതിയ പേജ്നിങ്ങൾ ഒരു പച്ച പശ്ചാത്തലം സൂചിപ്പിക്കേണ്ടതുണ്ട്, ലിങ്കുകൾ ചുവപ്പായിരിക്കണമെന്ന് സൂചിപ്പിക്കുക, ഓരോ പുതിയ ഖണ്ഡികയ്ക്കും 14-വലുപ്പമുള്ള ഫോണ്ട് സൂചിപ്പിക്കുക. ആ. ഓരോ പേജും പുതുതായി രൂപപ്പെടുത്തേണ്ടതുണ്ട്. ഇനി സിഎസ്എസിലും അങ്ങനെ ചെയ്യാം. IN പ്രത്യേക ഫയൽഎല്ലാ പേജുകൾക്കും ഞങ്ങൾ ഒരേ ശൈലി സൃഷ്ടിക്കുന്നു. ഓരോ പേജിലും ഈ ശൈലിയെ ബന്ധിപ്പിക്കുന്ന ഒരൊറ്റ വരി ഞങ്ങൾ എഴുതും. അത്രയേയുള്ളൂ!

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

മാത്രമല്ല, html-ൽ പൊതുവെ ചെയ്യാൻ കഴിയാത്ത കാര്യങ്ങൾ CSS-ൻ്റെ സഹായത്തോടെ നിങ്ങൾക്ക് ചെയ്യാൻ കഴിയും. നിങ്ങൾ പുരോഗമിക്കുമ്പോൾ, നിങ്ങൾ ഇത് സ്വയം കാണും.

ഏറ്റവും കൂടുതൽ ഒന്ന് പതിവായി ചോദിക്കുന്ന ചോദ്യങ്ങൾപുതിയ മാനദണ്ഡങ്ങൾ അറിയുന്ന പ്രക്രിയയിൽ - HTML ഘടകങ്ങളുടെ "ഐഡി", "ക്ലാസ്" ആട്രിബ്യൂട്ടുകൾ തമ്മിലുള്ള വ്യത്യാസം എന്താണ്. എല്ലാത്തിനുമുപരി, പ്രഭാവം ഒന്നുതന്നെയാണെന്ന് തോന്നുന്നു.

അവയ്ക്ക് മിക്കവാറും ഒരേ ഫലം മാത്രമേ ഉണ്ടാകൂ ലളിതമായ കേസുകൾ CSS-ൽ ഉപയോഗിക്കുക. വാസ്തവത്തിൽ, ഒരുപാട് വ്യത്യാസങ്ങളുണ്ട്.

സാരാംശം

id എന്നത് പേജിലെ ഒരു ഘടകത്തിൻ്റെ തനതായ ശരിയായ നാമമാണ്, അതായത്, ഒരേ ഐഡിയുള്ള പേജിൽ നിരവധി ഘടകങ്ങൾ ഉണ്ടാകരുത്. ഉദാഹരണത്തിന്, സൈറ്റ് ഹെഡറുള്ള ബ്ലോക്കിന് id="title" നൽകാം.

ക്ലാസ് എന്നത് ഒരു സ്വതന്ത്ര ആട്രിബ്യൂട്ട് ആണ്, അത് സാധാരണയായി പല ഘടകങ്ങളെ മറ്റുള്ളവരിൽ നിന്ന് വേർതിരിച്ചറിയാൻ നൽകുന്നു. ഉദാഹരണത്തിന്, ടെക്‌സ്‌റ്റിനോടൊപ്പമുള്ള ചിത്രങ്ങൾക്ക് class="decor" നൽകാം, കൂടാതെ ടെക്‌സ്‌റ്റ് മനസ്സിലാക്കുന്നതിന് പ്രധാനമായ ചിത്രങ്ങൾക്ക് class="content" നൽകാം.

അനന്തരഫലങ്ങൾ

ഈ സത്തയിൽ നിന്ന് നേരിട്ടോ അല്ലാതെയോ HTML, CSS, സ്ക്രിപ്റ്റുകൾ എന്നിവയിൽ ദൃശ്യമാകുന്ന മറ്റ് വ്യത്യാസങ്ങൾ പിന്തുടരുക.

...

ആങ്കർ ലിങ്കുകൾ പേജിലെ ചില ഘടകങ്ങളിലേക്ക് നിങ്ങൾക്ക് ഒരു ലിങ്ക് നൽകണമെങ്കിൽ, നിങ്ങൾ അതിന് ഒരു ഐഡി നൽകിയാൽ മതി ( ) കൂടാതെ ഒരു ആങ്കർ ഉപയോഗിച്ച് അതിലേക്ക് ലിങ്ക് ചെയ്യുക (http://site/path/#about). വഴിയിൽ, ഇത് പഴയ രീതിക്ക് പകരം തിരഞ്ഞെടുക്കപ്പെട്ട രീതിയാണ്

. ഒന്നിലധികം അടയാളങ്ങൾ

ഒരു ഘടകത്തിന് സ്‌പെയ്‌സുകളാൽ വേർതിരിച്ച നിരവധി ക്ലാസുകൾ നൽകാം:

. കൂടാതെ, അവ പ്രത്യേകം ഉപയോഗിക്കാം:

/* എല്ലാ പ്രധാന ഘടകങ്ങളും */ .പ്രധാനം (നിറം: ചുവപ്പ്;)

ഒപ്പം സംയുക്തമായും:

/* ഒരേ സമയം പ്രധാനപ്പെട്ടതും കേന്ദ്രീകൃതവുമായ ഘടകങ്ങൾ */ .important.centered (ബോർഡർ: സോളിഡ് ബ്ലാക്ക് 1px;)

CSS-ലെ ഓരോ നിയമത്തിനും ഒരു "ഭാരം" ഉണ്ട്, അത് അവ പ്രയോഗിക്കുന്ന ക്രമം നിർണ്ണയിക്കുന്നു. ഐഡിക്ക് കൂടുതൽ ഭാരം ഉണ്ട്. അതിനാൽ, ഒരു ഘടകത്തിന് ഒരു ഐഡിയും ക്ലാസും ഉണ്ടെങ്കിൽ:

...

രണ്ടിലേതെങ്കിലും നിയമങ്ങൾ

#കുറിച്ച് (നിറം:പച്ച;).പ്രധാനം (നിറം:ചുവപ്പ്;)

ആദ്യത്തേത് വിജയിക്കും, ശീർഷകത്തിൻ്റെ നിറം പച്ചയായിരിക്കും. (നിയമങ്ങളുടെ തൂക്കങ്ങൾ ഒരു പ്രത്യേക കഥയാണ്; തക്കസമയത്ത് അതിനെക്കുറിച്ച് ഒരു ലേഖനം ഉണ്ടാകും.)

ഒരു സ്ക്രിപ്റ്റിൽ തിരയുന്നു "id" ഉള്ള ഒരു ഘടകം ഡോക്യുമെൻ്റ്.getElementById() ഫംഗ്ഷൻ ഉപയോഗിച്ച് ഒരു സ്ക്രിപ്റ്റിൽ എളുപ്പത്തിൽ കണ്ടെത്താനാകും. ക്ലാസുകൾക്ക് അത്തരം പ്രവർത്തനങ്ങളൊന്നുമില്ല.

ഈ ലേഖനം "പാഠപുസ്തകം" എന്ന തലക്കെട്ടിൽ പുരോഗമിക്കുന്ന ഒരു പരമ്പരയുടെ ഭാഗമാണ്. "പാഠപുസ്തകം" വിഭാഗത്തിൽ കാണാവുന്ന മറ്റ് ലേഖനങ്ങൾ വായിക്കാൻ ഞാൻ ശുപാർശ ചെയ്യുന്നു, അവ ഇപ്പോൾ വിപരീത കാലക്രമത്തിൽ ശേഖരിക്കുന്നു.