CSS இல் எழுத்துருக்களை எவ்வாறு சிறப்பாகப் பயன்படுத்துவது?

இந்த கட்டுரை எழுத்துருக்கள் உள்ள எளிய மற்றும் முக்கியமான தலைப்பை உங்களுக்கு அறிமுகப்படுத்தும் மேலும் இந்த விஷயத்தில் ஒரு நடைமுறை ஆர்ப்பாட்டத்தையும் உங்களுக்கு வழங்கும். இந்த கட்டுரையில் பின்வரும் சுட்டிகள் விவரிக்கப்படும்,

• CSS இல் எழுத்துருக்கள்
• CSS எழுத்துருவில் பண்புக்கூறுகள்
• எழுத்துரு பாணி பண்புக்கூறு
• எழுத்துரு-எடை பண்புக்கூறு
• எழுத்துரு அளவு பண்புக்கூறு
• எழுத்துரு-குடும்ப பண்பு

வலைத்தளங்கள் படங்கள், ஆடியோ, வீடியோ மற்றும் உரை உள்ளடக்கம் வடிவில் உள்ளடக்கத்தை கொண்டு செல்கின்றன. இருப்பினும், பெரும்பாலான வலைப்பக்கங்கள் இன்னும் உரையை பிரதான வடிவமாக நம்பியுள்ளன. ஏனென்றால் எளிய உரை சில குறிப்பிடத்தக்க நன்மைகளை வழங்குகிறது.

ஊடுருவும் அல்லாத வாசிப்பு - அலுவலகத்தில் இருக்கும்போது சமீபத்திய போட்டி மதிப்பெண்ணை நீங்கள் சரிபார்க்க வேண்டும். வெளிப்படையாக நீங்கள் விரைவான உரை புதுப்பிப்பை விரும்புகிறீர்கள், சத்தமில்லாத வீடியோ அல்ல!
குறைந்த நெட்வொர்க் அலைவரிசை தேவை - மோசமான இணைய இணைப்பு பகுதிகளில் கூட உரை உள்ளடக்கத்தை ஏற்ற முடியும், அதே நேரத்தில் பணக்கார ஊடகங்களால் முடியாது.
தேடல் நட்பு - தேடுபொறிகளில் அவற்றின் உள்ளடக்கம் எவ்வளவு எளிதில் கவனிக்கப்படுகிறது என்பதை வலைத்தளங்கள் எப்போதும் கண்காணிக்கும். உரை இதற்கு மிகவும் பொருத்தமானது, குறைந்தபட்சம் AI இணையத்தை முழுவதுமாக எடுத்துக் கொள்ளும் வரை!

உரை உள்ளடக்கத்தை வடிவமைக்கும்போது, ​​வலை வடிவமைப்பாளர்களுக்கு வேலை செய்ய சில அளவுருக்கள் மட்டுமே உள்ளன - எழுத்துரு, சீரமைப்பு, சிறப்பம்சமாக மற்றும் வண்ணம். உங்கள் உரைக்கு சரியான எழுத்துருவைத் தேர்ந்தெடுப்பது ஒரு முக்கியமான தேர்வாகும். HTML பக்கங்களில் உரைக்கான எழுத்துருக்களை வரையறுக்க CSS எழுத்துரு குறிச்சொற்களைப் பயன்படுத்துவதே நிலையான நடைமுறை.
நீங்கள் HTML நிரலாக்க உலகிற்கு புதியவர் என்றால், இங்கே ஒரு அடிப்படை ஸ்டார்டர் சுற்றுப்பயணத்தைப் பெறுங்கள். CSS எழுத்துருக்களைப் பற்றி அறிந்து கொள்வதற்கு முன்பு நீங்கள் CSS அடிப்படைகளைப் படிக்க விரும்பலாம்.

ஒரு விரிவான CSS டுடோரியலுக்கு, தொடக்கநிலையாளர்களுக்கான Edureka CSS டுடோரியலைப் பார்வையிடவும். HTML வலை வடிவமைப்பை அதிகரிக்க CSS பயன்படுத்தப்பட வேண்டிய வழியில் நீங்கள் ஒரு சிறந்த தலைப்பைப் பெறுவீர்கள்.

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

CSS இல் எழுத்துருக்கள்

எழுத்துரு என்பது அடிப்படையில் உரையின் காட்சியுடன் தொடர்புடைய பண்புகளின் தொகுப்பாகும். எழுத்துருக்கள் அவற்றின் அளவு, உள்தள்ளல், அகலம், சாய்வு மற்றும் பலவற்றால் ஒருவருக்கொருவர் வேறுபடுகின்றன. வெவ்வேறு எழுத்துருக்களில் அடிப்படை உரை காட்சியுடன் ஆரம்பிக்கலாம்.

எடுத்துக்காட்டு 1: தலைப்புகள் மற்றும் பல்வேறு எழுத்துருக்களில் பத்தி

stl வரிசை c ++

body {background-color: lightblue} h1 {font: bold 30px arial, sans-serif} h2 {font: 15px verdana} p {font: italic bold 12px / 30px ஜார்ஜியா, செரிஃப்}
சாய்வு தைரியமான ஜார்ஜியா எழுத்துருவில் உள்ள பத்தி
 

 எடுத்துக்காட்டு 1: வெளியீடு 

எடுத்துக்காட்டு 1 இல், வெவ்வேறு எழுத்துருக்களில் 3 வெவ்வேறு வரிகள் உள்ளன. எழுத்துருக்கள் ஒவ்வொன்றும் அவற்றின் எழுத்து அகலங்கள், உள்தள்ளல்கள் போன்றவற்றில் வேறுபடுவதை நீங்கள் கவனிப்பீர்கள்.

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

CSS எழுத்துருவில் பண்புக்கூறுகள்

CSS எழுத்துருக்கள் 4 முதன்மை பண்புகளைக் கொண்டுள்ளன - நடை, எடை, அளவு மற்றும் குடும்பம். பாணி பண்புக்கூறு சாதாரண அல்லது சாய்வைக் குறிக்கிறது. எடை எழுத்துருவை வெற்று அல்லது தைரியமாகக் காட்டுகிறது. எடையும் எண்ணிக்கையில் வெளிப்படுத்தப்படலாம். அளவு வெறுமனே எழுத்துரு அளவு பெரிய அளவு, தோற்றத்தில் பெரிய உரை. எழுத்துரு அளவை ஒதுக்க பல வழிகள் உள்ளன, விரிவான விளக்கங்கள் பின்னர் பிரிவுகளில் கொடுக்கப்பட்டுள்ளன. எழுத்துரு பெயரை உரைக்கு ஒதுக்குவதே குடும்ப பண்பு.

எடுத்துக்காட்டு 1 இல், தலைப்புகள் மற்றும் பத்திக்கு வெவ்வேறு எழுத்துரு பெயர்களைப் பயன்படுத்தியுள்ளோம். H1 மற்றும் p குறிச்சொற்களின் கீழ், இரண்டு எழுத்துரு பெயர்கள் பட்டியலிடப்பட்டிருப்பதைக் காண்கிறோம், அதே நேரத்தில் h2 குறிச்சொல் ஒரு எழுத்துருவை மட்டுமே பெயரிடுகிறது. இது ஒரு எழுத்துரு குடும்பத்தின் வரையறை, இதைப் பற்றி பின்னர்.

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

எழுத்துரு பாணி பண்புக்கூறு:

இரண்டு முதன்மை பாணிகளை அமைக்கலாம் ‘இயல்பானவை’ மற்றும் ‘சாய்வு’. சாய்வு இயற்கையில் சாய்வாக இருக்க வேண்டும். இயல்பானது நேராக இருக்கும் இயல்புநிலை விருப்பமாகும். குறைவான பயன்படுத்தப்பட்ட மற்றொரு விருப்பம் ‘சாய்ந்த’ உள்ளது, இது பெரும்பாலான எழுத்துருக்களில் சாய்வு விருப்பத்தை ஒத்திருக்கிறது. நீங்கள் பாணியை ‘மரபுரிமையாக’ அமைக்கலாம், இதன் மூலம் எழுத்துரு பாணியை அதன் பெற்றோர் உறுப்புகளிலிருந்து எடுக்கலாம்.

முதுகலை மற்றும் முதுநிலை அதே

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

எழுத்துரு-எடை பண்புக்கூறு:

எழுத்துரு தடிமனாகவோ அல்லது மெல்லியதாகவோ தோன்ற வேண்டுமா என்பதை இந்த பண்புக்கூறு தீர்மானிக்கிறது. இதை ‘இயல்பான’ அல்லது ‘தைரியமாக’ அமைக்கலாம். இயல்புநிலை மதிப்பு சாதாரணமானது. இந்த மதிப்பை எண்ணாகவும் அமைக்கலாம். 400 இன் எடை சாதாரணத்தையும் 700 தடிமனையும் குறிக்கிறது. வேறு சில அமைப்புகள் உள்ளன (100 - மிக ஒளி முதல் 900 வரை - மிகவும் தைரியமானவை), ஆனால் அவை எல்லா எழுத்துருக்களாலும் ஆதரிக்கப்படவில்லை. அனைத்து எடை விருப்பங்களும் எடுத்துக்காட்டு 3 இல் காட்டப்பட்டுள்ளன.

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

எழுத்துரு அளவு பண்புக்கூறு:

அளவு பண்புக்கூறு பல வழிகளில் அமைக்கப்படலாம். இந்த வழிகளை கீழே பட்டியலிடுவோம்.
Medium ‘நடுத்தர’, ‘பெரிய’ போன்ற கணக்கிடப்பட்ட மதிப்பு. உண்மையில் ஆடைகளின் அளவைப் போலவே, மதிப்புகள் எக்ஸ்எக்ஸ் ஸ்மால் முதல் எக்ஸ்எக்ஸ் பெரியது வரை இருக்கலாம்!
Parent அதன் பெற்றோர் உறுப்புடன் தொடர்புடையது, ‘பெரியது’ அல்லது ‘சிறியது’.
Element பெற்றோர் உறுப்பு அளவின் சதவீதம்.
Parent பெற்றோர் உறுப்பு அளவை நேரடியாக ஏற்றுக்கொள்ள ‘மரபுரிமை’ என அமைக்கவும்.
X px (பிக்சல்கள்), pt (புள்ளிகள்) அல்லது cm (சென்டிமீட்டர்) அலகுகளில் முழுமையான மதிப்பாக
‘அளவுரு’ என்பது இந்த அளவுருவுக்கான இயல்புநிலை மதிப்பு.

CSS இல் எழுத்துருக்களைப் பற்றிய இந்த கட்டுரையுடன் நகரும்

எழுத்துரு-குடும்ப பண்பு:

HTML இல், CSS எழுத்துரு குடும்பம் எழுத்துரு பெயரை அமைப்பதாகும். நீங்கள் ஒரு எழுத்துரு பெயரை குறிச்சொல்லுடன் வைக்கலாம். அல்லது உலாவி எழுத்துருவைத் தேர்வுசெய்ய வேண்டிய முன்னுரிமையை வரையறுக்கும் எழுத்துரு-குடும்ப பட்டியலாக பல மதிப்புகளை நீங்கள் ஒதுக்கலாம்.
வீழ்ச்சி-பின் அமைப்பின் வடிவத்தில், இடமிருந்து வலமாக பட்டியல் முன்னுரிமை அளிக்கப்படுகிறது. கிடைத்தால் முதல் மதிப்பு தேர்ந்தெடுக்கப்பட்டால், அல்லது பட்டியலின் முடிவை அடையும் வரை கட்டுப்பாடு அடுத்தவருக்குச் செல்லும். இயல்புநிலை எழுத்துரு குடும்பம் உலாவி விருப்பங்களால் வரையறுக்கப்படுகிறது.
CSS எழுத்துரு குடும்பங்கள் 2 வகைகளாகும் - பொதுவான குடும்பங்கள் மற்றும் எழுத்துரு குடும்பங்கள்.
Family பொதுவான குடும்பங்கள் - சில பொதுவான குணாதிசயங்களின் அடிப்படையில், எழுத்துருக்கள் ‘செரிஃப்’, ‘சான்ஸ் செரிஃப்’, ‘மோனோஸ்பேஸ்’ என வகைப்படுத்தப்படுகின்றன. உதாரணமாக, சான்ஸ் செரிஃப் என்றால் செரிஃப் பாணி இல்லாத எழுத்துருக்கள்.
Names குடும்பப் பெயர்கள் - குறிப்பிட்ட குடும்ப வரிசைக்கு சொந்தமான எழுத்துருக்கள். டைம்ஸ், ஏரியல், கூரியர் அனைத்தும் எழுத்துரு குடும்பங்கள் மற்றும் டைம்ஸ் நியூ ரோமன் டைம்ஸ் குடும்பத்தின் எடுத்துக்காட்டு எழுத்துரு.
பல்வேறு எழுத்துரு குடும்ப பயன்பாட்டு விருப்பங்கள் கீழே உள்ள எடுத்துக்காட்டு 4 இல் பட்டியலிடப்பட்டுள்ளன.

ஜாவாவில் வகை வார்ப்பு என்றால் என்ன

கவனிக்க வேண்டிய சில பொதுவான புள்ளிகள்

CSS பல பிற CSS பண்புகளைப் போலவே, சில எழுத்துரு அமைப்புகளும் வெவ்வேறு உலாவிகளில் வேறுபடுகின்றன. சில அரிய எழுத்துரு அமைப்புகளைப் பயன்படுத்துவதற்கு முன்பு உலாவி ஆதரவைச் சரிபார்க்கவும்.
Font எழுத்துரு-பாணி, எழுத்துரு-எடை போன்ற தனிப்பட்ட குறிச்சொற்களைப் பயன்படுத்தி எழுத்துரு அமைப்புகளை நீங்கள் தனித்தனியாக அமைக்கலாம். மாற்றாக நீங்கள் சிறிய குறியீட்டை விரும்பினால், ஒரே மதிப்பில் உள்ள அனைத்து மதிப்புகளுடன் சுருக்கெழுத்து எழுத்துரு பண்புக்கூற்றைப் பயன்படுத்தலாம்.
User உலாவி அளவைப் பொறுத்து எழுத்துரு அளவு மாறுபட வேண்டும் என்று நீங்கள் விரும்பும் பயனர் காட்சிகளில், பதிலளிக்கக்கூடிய எழுத்துரு அமைப்பு எனப்படும் பயனுள்ள எழுத்துரு அளவு அமைப்பு உள்ளது. இது ஒரு வி.டபிள்யூ அலகுடன் அமைக்கப்படலாம், அதாவது “வியூபோர்ட் அகலம்”. அந்த வகையில் உரை அளவு உலாவி சாளரத்தின் அளவைப் பின்தொடரும்.

CSS இல் எழுத்துருக்களில் நீங்கள் தேடும் தகவலைக் கண்டுபிடித்தீர்கள் என்று நம்புகிறேன். கீழே உள்ள கருத்துகள் பிரிவில் உங்கள் அனுபவத்தை எங்களுடன் பகிர்ந்து கொள்ளுங்கள். மகிழ்ச்சியான வடிவமைப்பு!

வலை அபிவிருத்தி பற்றி மேலும் அறிய நீங்கள் விரும்பினால், பாருங்கள் வழங்கியவர் எடுரேகா. HTML5, CSS3, Twitter பூட்ஸ்டார்ப் 3, jQuery மற்றும் Google API களைப் பயன்படுத்தி ஈர்க்கக்கூடிய வலைத்தளங்களை எவ்வாறு உருவாக்குவது மற்றும் அதை அமேசான் எளிய சேமிப்பக சேவைக்கு (S3) பயன்படுத்துவது எப்படி என்பதை அறிய வலை அபிவிருத்தி சான்றிதழ் பயிற்சி உங்களுக்கு உதவும்.