ഫോണ്ട്-കുടുംബ പ്രോപ്പർട്ടി സിന്റാക്സ്
വിജയകരമായ വെബ്സൈറ്റ് ഡിസൈനിന്റെ ഒരു പ്രധാന ഭാഗമാണ് ടൈപ്പിഗ്രാഫിക് ഡിസൈൻ. വായിക്കാൻ എളുപ്പമുള്ളതും പ്രൊഫഷണലായ എല്ലാ വെബ് ഡിസൈൻ പ്രൊഫഷണലുകളെക്കുറിച്ചും ഉള്ള വാചകം ഉപയോഗിച്ച് സൈറ്റുകൾ സൃഷ്ടിക്കൽ. ഇത് നേടാൻ, നിങ്ങളുടെ വെബ് പേജുകളിൽ ഉപയോഗിക്കാൻ ആഗ്രഹിക്കുന്ന പ്രത്യേക ഫോണ്ടുകൾ നിങ്ങൾക്ക് സജ്ജമാക്കാൻ കഴിയും. നിങ്ങളുടെ വെബ് ഡോക്യുമെന്റുകളിൽ ടൈപ്പ്ഫേസ് അല്ലെങ്കിൽ ഫോണ്ട് കുടുംബം വ്യക്തമാക്കുന്നതിന് നിങ്ങൾ നിങ്ങളുടെ CSS- ൽ ഫോണ്ട്-ഫൈറ്റ് സ്റ്റൈൽ പ്രോപ്പർട്ടിയെ ഉപയോഗിക്കും.
നിങ്ങൾക്ക് ഉപയോഗിക്കാൻ കഴിയുന്ന ലളിതമായ ഫോണ്ട്-കുടുംബ ശൈലിയിൽ ഒരു ഫോണ്ട് കുടുംബം അടങ്ങിയിരിക്കും:
p {font-family: Arial; }ഈ ശൈലി ഒരു പേജിൽ പ്രയോഗിക്കുകയാണെങ്കിൽ, എല്ലാ ഖണ്ഡികകളും "Arial" font family ൽ പ്രദർശിപ്പിക്കും. ഇത് വളരെ മികച്ചതാണ്, കൂടാതെ "ഏരിയൽ" ഒരു "വെബ്-സുരക്ഷിത ഫോണ്ട്" എന്നറിയപ്പെടുന്നു, അതായത് മിക്ക (കമ്പ്യൂട്ടർ അല്ലെങ്കിൽ) കമ്പ്യൂട്ടർ അത് ഇൻസ്റ്റാളുചെയ്തിട്ടുണ്ടെങ്കിൽ, നിങ്ങളുടെ പേജ് ഉദ്ദേശിച്ച ഫോണ്ടിൽ പ്രദർശിപ്പിക്കുമെന്ന് നിങ്ങൾക്ക് എളുപ്പത്തിൽ മനസിലാക്കാം. .
നിങ്ങൾ തെരഞ്ഞെടുത്ത ഫോണ്ട് കാണാൻ കഴിയുമോ? ഉദാഹരണത്തിന്, നിങ്ങൾ ഒരു "വെബ് സുരക്ഷിത ഫോണ്ട്" ഉപയോഗിക്കുന്നില്ലെങ്കിൽ, ആ ഫോണ്ട് ഇല്ലെങ്കിൽ ഉപയോക്താവ് ഏജൻറ് എന്തു ചെയ്യുന്നു? അവർ ഒരു പകരക്കാരനാണ്.
ഇത് ചില വളരെ രസകരങ്ങളായ പേജുകളിൽ ഇടയാക്കും. ഞാൻ ഒരിക്കൽ എന്റെ കമ്പ്യൂട്ടർ "Wingdings" (ഐക്കൺ സെറ്റ്) ൽ പൂർണ്ണമായും പ്രദർശിപ്പിച്ച ഒരു പേജിലേക്ക് പോയി, കാരണം എന്റെ കമ്പ്യൂട്ടറിൽ ഡവലപ്പർ പറഞ്ഞിട്ടുള്ള ഫോണ്ട് ഇല്ല, എന്റെ ബ്രൌസർ വളരെ മോശം നിര തന്നെ ഉണ്ടാക്കി മാറ്റി പകരം വയ്ക്കുക. ഈ പേജ് എനിക്ക് പൂർണ്ണമായി വായിക്കാൻ കഴിയുമായിരുന്നില്ല! ഇവിടെയാണ് ഫോണ്ട് സ്റ്റാക്ക് വരുന്നത്.
ഫോണ്ട് സ്റ്റാക്കു് ഒരു കോമ ഉപയോഗിച്ചു് അനവധി ഫോണ്ട് കുടുംബങ്ങൾ വേർതിരിക്കുക
നിങ്ങളുടെ പേജ് ഉപയോഗിക്കാൻ ആഗ്രഹിക്കുന്ന ഫോണ്ടുകളുടെ ഒരു പട്ടികയാണ് "font stack". നിങ്ങളുടെ മുൻഗണന അനുസൃതമായി ഫോണ്ട് ചോയ്സുകൾ നൽകുകയും ഓരോ കോമയും വേർതിരിക്കുകയും ചെയ്യും. ലിസ്റ്റിലെ ആദ്യ ഫോണ്ട് കുടുംബം ബ്രൌസറിൽ ഇല്ലെങ്കിൽ, രണ്ടാമത്തെ മൂന്നാമത്തേതും പിന്നെ മൂന്നാമത്തേതും മറ്റും ശ്രമിക്കുമ്പോഴും അത് സിസ്റ്റത്തിൽ ഉള്ളതായി കണ്ടെത്തും.
ഫോണ്ട്-ഫാമിലി: പുസ്കാറ്റ്, അൾജീരിയൻ, ബ്രോഡ്വേ;മുകളിൽ പറഞ്ഞിരിക്കുന്ന ഉദാഹരണത്തിൽ, ബ്രൗസർ ആദ്യം "പുസ്കിക്ക്" ഫോണ്ട്, പിന്നെ "അൾജീരിയൻ" പിന്നെ "ബ്രോഡ്വേ" മറ്റ് ഫോണ്ടുകൾ കണ്ടില്ലെങ്കിൽ നോക്കും. ഇത് നിങ്ങൾക്ക് ഇഷ്ടമുള്ള കുറഞ്ഞത് ഒരെണ്ണം ഉപയോഗിക്കാനാവും. അത് തികച്ചും അല്ല, അതിനാലാണ് നമുക്ക് ഇനിയും നമുക്ക് നമ്മുടെ ഫോണ്ട് സ്റ്റാക്കിലേക്ക് (വായിക്കുക!) ചേർക്കാൻ കഴിയും.
സാധാരണ ഫോണ്ടുകൾ ഉപയോഗിക്കുക കഴിഞ്ഞത്
ഫോണ്ടുകളുടെ ഒരു ലിസ്റ്റ് ഉപയോഗിച്ച് നിങ്ങൾക്ക് ഫോണ്ട് സ്റ്റാക്ക് സൃഷ്ടിക്കാൻ സാധിക്കും കൂടാതെ ബ്രൗസറിന് കഴിയാത്തവയെല്ലാം ഒന്നുമില്ല. ബ്രൌസർ ഒരു പാവപ്പെട്ട പകരം തിരഞ്ഞെടുക്കുന്നെങ്കിൽ നിങ്ങളുടെ പേജ് വായിക്കാൻ കഴിയണമെന്നില്ല. സാധാരണ CSS- ന് ഇതിന് ഒരു പരിഹാരം ഉണ്ട്: ജെനറിക് ഫോണ്ടുകൾ .
ഒരു സാധാരണ ഫോണ്ട് ഉപയോഗിച്ച് നിങ്ങളുടെ ഫോണ്ട് ലിസ്റ്റ് അവസാനിപ്പിക്കണം (ഇത് ഒരു കുടുംബത്തിന്റെ പട്ടിക അല്ലെങ്കിൽ വെബ് സുരക്ഷിതമായ ഫോണ്ടുകൾ മാത്രം). നിങ്ങൾക്ക് ഉപയോഗിക്കാവുന്ന അഞ്ച് കാര്യങ്ങൾ ഉണ്ട്:
- കള്ളം പറയുക
- ഫാന്റസി
- മോണോസ്പെയ്സ്
- സാൻസ്-സെരിഫ്
- സെരിഫ്
മേൽപ്പറഞ്ഞ രണ്ട് ഉദാഹരണങ്ങൾ ഇതിലേക്ക് മാറ്റിയേക്കാം:
font-family: Arial, sans-serif; ഫോണ്ട്-കുടുംബം: പുസ്കാറ്റ്, അൾജീരിയൻ, ബ്രോഡ്വേ, ഫാന്റസി;ചില ഫോണ്ട് കുടുംബ പേരുകൾ ഒന്നോ അതിലധികമോ പദങ്ങൾ
നിങ്ങൾ ഉപയോഗിക്കാൻ ആഗ്രഹിക്കുന്ന ഫോണ്ട് കുടുംബം ഒന്നിൽ കൂടുതൽ വാക്കുകളാണെങ്കിൽ, നിങ്ങൾ ഇരട്ടകോഡ് മാർക്കുകൾ ഉപയോഗിച്ച് അതിനെ ചുറ്റണം. ചില ബ്രൌസറുകൾക്ക് ഉദ്ധരണി ചിഹ്നങ്ങൾ ഇല്ലാതെ ഫോണ്ട് കുടുംബങ്ങൾ വായിക്കാനാവും, വൈറ്റ്സ്പെയ്സ് ഘ്രഹാഫലം അല്ലെങ്കിൽ അവഗണിക്കപ്പെടുകയാണെങ്കിൽ പ്രശ്നങ്ങൾ ഉണ്ടാകാം.
ഫോണ്ട്-ഫാമിലി: "ടൈംസ് ന്യൂ റോമൻ", സെരിഫ്;ഈ ഉദാഹരണത്തിൽ, മൾട്ടി വേർഡ് ആയ "ടൈംസ് ന്യൂ റോമൻ", ഉദ്ധരണികളിൽ വച്ചിരിക്കുന്നതായി കാണാം. മൂന്നു വാക്കുകളും ഒരേ വാക്കുകളുള്ള മൂന്ന് ഫോണ്ടുകളെ അപേക്ഷിച്ച്, ഈ മൂന്ന് വാക്കുകളും ഈ ഫോണ്ട് നാമത്തിന്റെ ഭാഗമാണ് എന്ന് ബ്രൗസറിനോട് പറയുന്നു.
ജെന്നിഫർ ക്രിയിൻ എഴുതിയ ലേഖനം ജെറമി ഗിരാർഡ് 12/2/16 ന് എഡിറ്റുചെയ്തു