CSS ഷോർട്ട് കോഴ്സ്
കാസ്കേഡ് എന്നത് CSS സ്റ്റൈൽ ഷീറ്റുകൾ ഉപയോഗപ്രദമാക്കുന്നതിന് സഹായിക്കും. ചുരുക്കത്തിൽ, പരസ്പരവിരുദ്ധമായ ശൈലികൾ എങ്ങനെ പ്രയോഗിക്കണം എന്നതിന് മുൻഗണനയുടെ ക്രമം നിർവ്വഹിക്കുന്നു. മറ്റൊരു രീതിയിൽ പറഞ്ഞാൽ, നിങ്ങൾക്ക് രണ്ട് ശൈലികൾ ഉണ്ടെങ്കിൽ:
p {വർണം: ചുവപ്പ്; }
p {വർണം: നീല; }
സ്റ്റൈൽ ഷീറ്റിന് അവർ ചുവപ്പും നീലയും ആയിരിക്കണമെന്നുണ്ടെങ്കിലും ക്ലെയിമുകൾ ഏതൊക്കെ നിറങ്ങൾ നൽകണമെന്നത് ഈ കാസ്കേഡ് തീരുമാനിക്കുന്നു. ആത്യന്തികമായി ഒരു നിറം മാത്രമേ ഖണ്ഡികയിലേക്ക് പ്രയോഗിക്കാൻ കഴിയൂ, അതിനാൽ ഒരു ഓർഡർ വേണം.
ഈ ഓർഡർ സെലക്ടറുകളാൽ (മുകളിൽ പറഞ്ഞ ഉദാഹരണത്തിൽ p) ഏറ്റവും മുൻഗണനയുള്ളതും പ്രമാണത്തിൽ ഏത് ഓർഡർ ദൃശ്യമാകുന്നുവെന്നതും ആണ്.
ഒരു ശൈലിക്ക് നിങ്ങളുടെ ബ്രൗസർ എങ്ങനെ മുൻഗണന നിശ്ചയിക്കുന്നു എന്നതിന്റെ ലളിതമാണ് താഴെപ്പറയുന്ന പട്ടിക:
- ഘടകവുമായി പൊരുത്തപ്പെടുന്ന സെലക്റ്ററിനുള്ള ശൈലി ഷീറ്റിൽ നോക്കുക. നിർവചിച്ചിട്ടില്ലാത്ത ശൈലികൾ ഇല്ലെങ്കിൽ, ബ്രൌസറിലെ സ്ഥിരമായ നിയമങ്ങൾ ഉപയോഗിക്കുക
- സെലക്ടറുകളായി അടയാളപ്പെടുത്തിയ ശൈലിയിൽ നോക്കുക! പ്രധാനപ്പെട്ടതും അനുയോജ്യമായതുമായ ഘടകങ്ങളിൽ പ്രയോഗിക്കുക.
- സ്റ്റൈൽഷീറ്റിലെ എല്ലാ ശൈലികളും സ്ഥിരസ്ഥിതി ബ്രൌസർ ശൈലികളെ അസാധുവാക്കും (ഉപയോക്തൃ ശൈലി ഷീറ്റുകൾ ഒഴികെ).
- ശൈലി സെലക്ടറിനു കൂടുതൽ കൃത്യമായത്, അതിന് മുൻഗണന ഉണ്ടാകും. ഉദാഹരണത്തിനു്, div> p.class p.class നേക്കാൾ കൂടുതൽ വ്യക്തമാണു്.
- അവസാനമായി, രണ്ട് നിയമങ്ങൾ ഒരേ മൂലകത്തിൽ പ്രയോഗിക്കുകയും ഒരേ സെലക്ടർ മുൻഗണന നൽകുകയും ചെയ്താൽ, അവസാനമായി ലോഡ് ചെയ്ത ഒന്ന് പ്രയോഗിക്കപ്പെടും. മറ്റൊരു രീതിയിൽ പറഞ്ഞാൽ, ശൈലി ഷീറ്റ് മുകളിലേക്ക് താഴേക്ക് വായിക്കുകയും, ഒരു രീതിയിലും ശൈലികൾ പ്രയോഗിക്കുകയും ചെയ്യുന്നു.
ആ നിയമങ്ങളെ അടിസ്ഥാനമാക്കിയാണ് മുകളിലുള്ള ഉദാഹരണത്തിൽ, ഖണ്ഡികകൾ നീലനിറത്തിൽ എഴുതപ്പെടും, കാരണം p {color: blue; } ശൈലി ഷീറ്റിൽ അവസാനമായി വരുകയാണ്.
ഇത് കാസ്കേഡ് വളരെ ലളിതമായ ഒരു വിശദീകരണമാണ്. കാസ്കേഡ് എങ്ങനെ പ്രവർത്തിക്കുന്നു എന്നതിനെക്കുറിച്ച് കൂടുതൽ പഠിക്കാൻ നിങ്ങൾക്ക് താൽപ്പര്യമുണ്ടെങ്കിൽ, നിങ്ങൾ വായിക്കേണ്ടത് "കാസ്കേഡ്" കാഷ്കാഡിംഗ് സ്റ്റൈൽ ഷീറ്റുകളിൽ എന്താണ്? .