CSS மரபுரிமை ஒரு கண்ணோட்டம்

எப்படி CSS மரபு வலை ஆவணங்கள் வேலை

CSS உடன் ஒரு இணையதளம் ஸ்டைலிங் ஒரு முக்கிய பகுதியாக பரம்பரை கருத்து புரிந்து உள்ளது.

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

CSS மரபு என்ன?

ஒரு HTML ஆவணத்தில் உள்ள ஒவ்வொரு உறுப்பும் ஒரு மரத்தின் ஒரு பகுதியாகும் மற்றும் ஆரம்ப உறுப்பு தவிர ஒவ்வொரு உறுப்புக்கும் அது இணைக்கும் ஒரு பெற்றோர் உறுப்பு உள்ளது. அந்த பாத்திரத்தின் உறுப்புக்கு எந்த பாணியைப் பயன்படுத்தினாலும் அதன் பண்புகளை மரபுவழிப்படுத்தலாம்.

எடுத்துக்காட்டாக, கீழே உள்ள இந்த HTML குறியீட்டை ஒரு EM குறிச்சொல்லை இணைக்கும் ஒரு H1 டேக் உள்ளது:

இது பெரிய தலைப்பு ஆகும்

EM உறுப்பு H1 உறுப்பு ஒரு குழந்தை, மற்றும் மரபுரிமை பெற்ற H1 எந்த பாணியை அதே ஈஎம் உரை அனுப்பப்படும். உதாரணத்திற்கு:

h1 {font-size: 2em; }

எழுத்துரு-அளவு சொத்து மரபுரிமை பெற்றிருப்பதால், "பெரிய" (எ.கா. குறிச்சொற்களை உள்ளே என்ன இணைக்கப்பட்டுள்ளது) என்கிற உரை H1 இன் மீதமுள்ள அதே அளவு இருக்கும். அது CSS சொத்து உள்ள மதிப்பு மதிப்பு மரபு ஏனெனில் இது.

CSS மரபு எப்படி பயன்படுத்துவது

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

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

உடல் {font-family: Arial, sans-serif; }

மரபு வழி உடை மதிப்பு பயன்படுத்தவும்

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

உடல் {margin: 1em; } ப {margin: inherit; }

மரபுரிமை கணக்கிடப்பட்ட மதிப்புகள் பயன்படுத்துகிறது

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

உங்கள் BODY உறுப்புகளில் 1em என்ற எழுத்துரு அளவு அமைக்கினால், உங்கள் முழுப் பக்கமும் 1M அளவு மட்டுமே இருக்காது. இது ஏனெனில் தலைப்புகள் (H1-H6) மற்றும் பிற உறுப்புகள் (சில உலாவிகளில் வித்தியாசமாக அட்டவணையை மதிப்பிடுவது) போன்ற வலை உலாவியில் ஒரு ஒப்பீட்டளவு அளவு போன்ற கூறுகள் உள்ளன . மற்ற எழுத்துரு அளவிலான தகவல்கள் இல்லாத நிலையில், வலை உலாவி, H1 தலைப்பில், மிகப்பெரிய உரைப்பக்கமாக, பின்னர் H2 மற்றும் பலவற்றை செய்யும். உங்கள் BODY உறுப்பை குறிப்பிட்ட எழுத்துரு அளவுக்கு அமைக்கும் போது, ​​அது "சராசரி" எழுத்துரு அளவு எனப் பயன்படுத்தப்படுகிறது, மேலும் தலைப்பு கூறுகள் அந்த கணக்கிடப்படுகின்றன.

மரபுரிமை மற்றும் பின்னணி பண்புகள் பற்றி ஒரு குறிப்பு

பட்டியலிடப்பட்டுள்ள பாணிகள் பல உள்ளன W3C இல் CSS 2 இல் மரபுரிமை இல்லை, ஆனால் வலை உலாவிகளில் இன்னும் மதிப்புகள் மரபுரிமையாக. உதாரணமாக, நீங்கள் பின்வரும் HTML மற்றும் CSS எழுதியிருந்தால்: