നിരവധി പാഠങ്ങൾക്കായി, CSS ഉപയോഗിച്ച് ടെക്സ്റ്റ് ഫോർമാറ്റ് ചെയ്യുന്നതിൽ ഞങ്ങൾ ഇപ്പോൾ കൂടുതൽ സങ്കീർണ്ണമായിക്കൊണ്ടിരിക്കുകയാണ്, ഇത്തവണ ടെക്സ്റ്റിൻ്റെ കേസ് എങ്ങനെ മാറ്റാമെന്ന് ഞങ്ങൾ പഠിക്കുകയാണ്. ഇക്കാര്യത്തിൽ, കാസ്കേഡിംഗ് സ്റ്റൈൽ ഷീറ്റുകൾ ഞങ്ങൾക്ക് വളരെ വിശാലമായ സാധ്യതകൾ തുറക്കുന്നു, കൂടുതൽ കൃത്യമായി പറഞ്ഞാൽ, നമുക്ക്:
- എല്ലാ വാചകങ്ങളും വലിയ അക്ഷരങ്ങളിൽ പ്രദർശിപ്പിക്കുക;
- ചെറിയ അക്ഷരങ്ങളിലുള്ള എല്ലാ വാചകങ്ങളും തിരഞ്ഞെടുക്കുക;
- ഓരോ വാക്കിൻ്റെയും ആദ്യ അക്ഷരം വലിയക്ഷരത്തിൽ ആരംഭിക്കുന്നുവെന്ന് ഉറപ്പാക്കുക.
"ഇതെല്ലാം നല്ലതാണ്, തീർച്ചയായും, അത് എപ്പോൾ ആവശ്യമായി വന്നേക്കാം?" - താങ്കൾ ചോദിക്കു. എല്ലാ മെനു ഇനങ്ങളും വലിയ അക്ഷരങ്ങളിൽ പ്രദർശിപ്പിക്കേണ്ട ഒരു സാഹചര്യം നമുക്ക് സങ്കൽപ്പിക്കാം. ഇത് ചെയ്യുന്നതിന്, CapsLock കീ ഉൾപ്പെടെ, അല്ലെങ്കിൽ Shift ബട്ടൺ അമർത്തിപ്പിടിച്ചുകൊണ്ട് അവ ടൈപ്പ് ചെയ്യേണ്ട ആവശ്യമില്ല. CSS ഫയലിൽ ഒരു അനുബന്ധ നിയമം സൃഷ്ടിച്ചുകൊണ്ട് എല്ലാ ലിസ്റ്റ് ഇനങ്ങളും വലിയക്ഷരത്തിൽ പ്രദർശിപ്പിക്കാൻ സജ്ജമാക്കിയാൽ മതിയാകും. കൂടാതെ ഇത് സാധ്യമായ നിരവധി സാഹചര്യങ്ങളിൽ ഒന്ന് മാത്രമാണ്.
ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം പ്രോപ്പർട്ടിടെക്സ്റ്റ്-ട്രാൻസ്ഫോം പ്രോപ്പർട്ടി ഉപയോഗിച്ച് ഞങ്ങൾ ടെക്സ്റ്റിൻ്റെ കേസ് നിയന്ത്രിക്കും. ഇതിന് 4 പ്രധാന മൂല്യങ്ങളുണ്ട് - വലിയക്ഷരം (ക്യാപിറ്റൽ അക്ഷരങ്ങൾ), ചെറിയക്ഷരം (ചെറിയ അക്ഷരങ്ങൾ), വലിയക്ഷരം (വാക്കിൻ്റെ ഓരോ ആദ്യ അക്ഷരത്തിനും വലിയക്ഷരം, മറ്റ് മൂല്യങ്ങൾ മാറില്ല), ഒന്നുമില്ല (ഫോർമാറ്റിംഗ് ബാധകമല്ല) . ഒറ്റനോട്ടത്തിൽ, ഇതെല്ലാം നിങ്ങൾക്ക് വളരെ സങ്കീർണ്ണമായി തോന്നിയേക്കാം.
![](https://i0.wp.com/site4business.net/wp-content/uploads/2015/11/neznakomoe-CSS-svojstvo.jpg)
എന്നാൽ പ്രായോഗികമായി എല്ലാം വളരെ ലളിതമാണ്, നിങ്ങൾ ഇപ്പോൾ കാണും. പ്രധാന കാര്യം ശരിയായ സെലക്ടർ തിരഞ്ഞെടുക്കുക എന്നതാണ്, കാരണം ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം പ്രോപ്പർട്ടി മൂല്യങ്ങൾ പാരമ്പര്യമായി ലഭിക്കുന്നു.
വലിയക്ഷരമാക്കുകഒന്നാമതായി, എല്ലാ വാചകങ്ങളും വലിയ അക്ഷരങ്ങളിലേക്ക് സജ്ജീകരിക്കാൻ ഞാൻ നിർദ്ദേശിക്കുന്നു, അതിനായി ഞങ്ങൾ ഇനിപ്പറയുന്ന CSS നിയമം സൃഷ്ടിക്കുന്നു:
ബോഡി (ടെക്സ്റ്റ് രൂപാന്തരം: വലിയക്ഷരം; )
തത്വത്തിൽ, സങ്കീർണ്ണമായ ഒന്നുമില്ല, ഞങ്ങൾ വലിയക്ഷര മൂല്യം ഉപയോഗിച്ചു. അവർ പറയുന്നതുപോലെ, എല്ലാം അവബോധജന്യമാണ്. യഥാർത്ഥ ജീവിതത്തിൽ ഇത് ഇങ്ങനെയാണ് കാണപ്പെടുന്നത്:
![](https://i2.wp.com/site4business.net/wp-content/uploads/2015/11/uppercase.jpg)
ഇനിപ്പറയുന്നവ എഴുതി എല്ലായിടത്തും ചെറിയ അക്ഷരങ്ങൾ പ്രയോഗിക്കുക എന്നതാണ് അടുത്ത ഘട്ടം:
ബോഡി (ടെക്സ്റ്റ് രൂപാന്തരം: ചെറിയക്ഷരം; )
നിങ്ങൾ ഇതിനകം ഊഹിച്ചതുപോലെ, ഞങ്ങൾ കണ്ടുമുട്ടിയ രണ്ട് അർത്ഥങ്ങളും ഒരു പരിധിവരെ വിപരീതപദങ്ങളാണ്. ചുവടെയുള്ള ചിത്രീകരണത്തിൽ നിങ്ങൾക്ക് പുതുതായി സൃഷ്ടിച്ച വസ്തുവിൻ്റെ ഫലം കാണാൻ കഴിയും.
![](https://i1.wp.com/site4business.net/wp-content/uploads/2015/11/lowercase.jpg)
ഇത് ചെയ്യുന്നതിന്, ഞങ്ങൾ അനുബന്ധ മൂല്യം ഉപയോഗിക്കേണ്ടതുണ്ട്:
ബോഡി (ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം: ക്യാപിറ്റലൈസ്; )
അത്തരം ഒരു CSS നിയമം നിങ്ങൾ എത്ര തവണ ഉപയോഗിക്കുമെന്ന് എനിക്കറിയില്ല, പക്ഷേ അത്തരമൊരു സാധ്യതയെക്കുറിച്ച് അറിയുന്നത് നിങ്ങളെ വേദനിപ്പിക്കില്ല, പ്രത്യേകിച്ച് നിസ്സാരമല്ലാത്ത പ്രശ്നങ്ങൾ പരിഹരിക്കുമ്പോൾ. ഫലം ചുവടെയുള്ള ചിത്രത്തിൽ കാണാൻ കഴിയും.
![](https://i1.wp.com/site4business.net/wp-content/uploads/2015/11/capitalize.jpg)
അവസാനമായി, നമുക്ക് അവസാന മൂല്യത്തിലേക്ക് പെട്ടെന്ന് നോക്കാം - ഒന്നുമില്ല. ഞാൻ ഇതിനകം പറഞ്ഞതുപോലെ, മാതാപിതാക്കളിൽ നിന്നുള്ള അനന്തരാവകാശം റദ്ദാക്കാൻ ഇത് ഉപയോഗിക്കാം. ഉദാഹരണത്തിന്, ഞങ്ങൾക്ക് മുമ്പത്തെ എല്ലാ നിയമങ്ങളും പ്രാബല്യത്തിൽ ഉണ്ടെന്ന് സങ്കൽപ്പിക്കുക, ഖണ്ഡികകൾക്കായി ഞങ്ങൾ അവ റദ്ദാക്കണം, ഇതിനായി ഞങ്ങൾ ഇനിപ്പറയുന്നവ എഴുതുന്നു:
പി (ടെക്സ്റ്റ് രൂപാന്തരം: ഒന്നുമില്ല; )
എല്ലാം നിങ്ങൾക്ക് വ്യക്തമാണെന്ന് അനുമാനിക്കാൻ ഞാൻ ധൈര്യപ്പെടുന്നു, ഇല്ലെങ്കിൽ, അഭിപ്രായങ്ങളിൽ നിങ്ങളുടെ ചോദ്യങ്ങൾ ചോദിക്കുക. പിന്നെ എനിക്ക് അത്രമാത്രം. ഈ CSS ട്യൂട്ടോറിയൽ നിങ്ങൾക്ക് സഹായകരമാണെന്ന് ഞാൻ പ്രതീക്ഷിക്കുന്നു. ഇത് സത്യമാണെങ്കിൽ:
- സോഷ്യൽ നെറ്റ്വർക്കുകളിൽ ഈ ലേഖനം വീണ്ടും പോസ്റ്റ് ചെയ്യുക, അതിലൂടെ കൂടുതൽ ആളുകൾക്ക് അതിൽ നിന്ന് പ്രയോജനം നേടാനാകും;
- ഉപയോഗപ്രദവും രസകരവുമായ ബ്ലോഗ് പോസ്റ്റുകൾ നഷ്ടപ്പെടുത്താതിരിക്കാൻ എൻ്റെ വാർത്താക്കുറിപ്പ് സബ്സ്ക്രൈബ് ചെയ്യുക.
ഇവിടെയാണ് ഞാൻ നിന്നോട് വിട പറയാത്തത്. നിങ്ങളുടെ ശ്രദ്ധയ്ക്ക് നന്ദി, അടുത്ത പ്രസിദ്ധീകരണങ്ങളിൽ കാണാം!
CSS(8) ഉപയോഗിച്ച് ചെറിയക്ഷരം ചെറിയക്ഷരമായും ആദ്യത്തെ വലിയക്ഷരമായും പരിവർത്തനം ചെയ്യുക
CSS-ൽ ക്യാപ് ക്ലോസ് ഓപ്ഷൻ ഇല്ല. ഈ ഓപ്ഷൻ ഉപയോഗിക്കുന്നതിനാൽ ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം: ക്യാപിറ്റലൈസ് നിർദ്ദേശിക്കുന്ന മറ്റ് ഉത്തരങ്ങൾ തെറ്റാണ് ഓരോ വാക്കിനും ഓരോ വാക്ക് .
ഇവിടെ അപമര്യാദയായഓരോ മൂലകത്തിൻ്റെയും ആദ്യാക്ഷരം വലിയക്ഷരം ആയിരിക്കണമെന്ന് നിങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ ഇത് ചെയ്യാനുള്ള ഒരു മാർഗ്ഗം, എന്നാൽ അത് തീർച്ചയായും യഥാർത്ഥ നിയന്ത്രണങ്ങൾക്ക് അടുത്തെങ്ങും ഇല്ല:
പി (ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം: ചെറിയക്ഷരം; ) പി: ആദ്യാക്ഷരം (ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം: വലിയക്ഷരം; )
ഇതൊരു ഉദാഹരണ വാക്യമാണ്.
ഇത് മറ്റൊരു ഉദാഹരണ വാക്യമാണ്. ഇത് മറ്റൊന്നാണ്, പക്ഷേ ഇത് പൂർണ്ണമായും ലോവർകേസ് ആയിരിക്കും.
CSS മാത്രം ഉപയോഗിച്ച് താഴെ കാണിച്ചിരിക്കുന്നതുപോലെ ഓരോ വാക്യത്തിനും UPPERCASE എന്ന അക്ഷരത്തെ ചെറിയക്ഷരവും വലിയക്ഷരത്തിൻ്റെ ആദ്യ അക്ഷരവും എങ്ങനെ പരിവർത്തനം ചെയ്യാം?
അയച്ചത്: ഇതൊരു ഉദാഹരണ അപേക്ഷയാണ്.
സ്വീകർത്താവ്: ഇത് ഒരു ഏകദേശ വാക്യമാണ്.
അപ്ഡേറ്റ്: ഞാൻ ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം ഉപയോഗിക്കുമ്പോൾ: capize; ഫലം ഇപ്പോഴും സമാനമാണ്.
നിങ്ങൾക്ക് ഇത് CSS ഉപയോഗിച്ച് മാത്രം ചെയ്യാൻ കഴിയില്ല. ഒരു ടെക്സ്റ്റ്-ട്രാൻസ്ഫോം ആട്രിബ്യൂട്ട് ഉണ്ട്, പക്ഷേ അത് ഒന്നും സ്വീകരിക്കുന്നില്ല, വലിയക്ഷരം, വലിയക്ഷരം, ചെറിയക്ഷരം, അനന്തരക്ഷരം എന്നിവ വലിയക്ഷരമാക്കുന്നു.
നിങ്ങൾ ഒരു JS സൊല്യൂഷൻ അല്ലെങ്കിൽ സെർവർ-സൈഡ് സൊല്യൂഷൻ നോക്കാൻ ആഗ്രഹിച്ചേക്കാം.
നിങ്ങൾക്ക് സെർവറിൽ എല്ലാ പ്രതീകങ്ങളും ചെറിയക്ഷരമാക്കാൻ കഴിയുമെങ്കിൽ, നിങ്ങൾക്ക് അപേക്ഷിക്കാം:
വാചകം രൂപാന്തരപ്പെടുത്തുക: വലിയക്ഷരമാക്കുക
വലിയ അക്ഷരങ്ങൾ ഇൻപുട്ടായി ടെക്സ്റ്റ് പരിവർത്തനം പ്രവർത്തിക്കുമെന്ന് ഞാൻ കരുതുന്നില്ല.
നിങ്ങൾക്ക് ഇത് ഉപയോഗിക്കണമെങ്കിൽ ഇത് പ്രവർത്തിക്കില്ല, അല്ലെങ്കിൽ ടെക്സ്റ്റേറിയയ്ക്ക് വേണ്ടി നിങ്ങൾ Javascript ഉപയോഗിക്കേണ്ടതുണ്ട്
ഫംഗ്ഷൻ ക്യാപ്പിറ്റൽനെയിം() (var str = document.getElementById("name").value; document.getElementById("name").value = str.charAt(0).toUpperCase() + str.slice(1); )
അല്ലെങ്കിൽ നന്നായി പ്രവർത്തിക്കണം