වෙබ් ලේඛන වල CSS උරුමය ක්රියා කරන්නේ කෙසේද?

CSS සමඟ වෙබ් අඩවියක් නිර්මාණය කිරීමේ වැදගත් කොටසක් වන්නේ උරුමයේ සංකල්පය තේරුම් ගැනීමයි.

CSS උරුමය ස්වයංක්රීයව නිර්වචනය කරනු ලබන දේපල ශෛලිය විසින් නිර්ණය කෙරේ. ඔබ විලාසිතා පසුබිමේ පසුබිම දෙස බලන කල, ඔබ "උරුමය" යන ශීර්ෂය බලනු ඇත. ඔබ බොහෝ වෙබ් නිර්මාණකරුවන් වගේ නම්, ඔබ එම කොටස නොසලකා හැර ඇති නමුත් එය අරමුණක් ඉටු කරයි.

CSS උරුමය යනු කුමක්ද?

HTML ලේඛනයේ සෑම මූලද්රව්යයක්ම ගසක කොටසක් වන අතර මූලික මූලද්රව්යය හැර සෑම මූලද්රව්යයක්ම එය ආවරණ කරන ලද මාපිය මූලද්රව්යයක් ඇත. එම මාපිය මූලද්රව්යයට අදාළ ශෛල්යයන් කුමක් වුනත් එහි ගුණාංග උරුම විය හැකි නම්, එහි ඇති මූලද්රව්යවලට එය යෙදිය හැකිය.

උදාහරණයක් ලෙස, පහත දැක්වෙන මෙම HTML කේතයේ EM ටැග් ආවරණයක් සහිත H1 ටැග් ඇත:

මෙය විශාල ශීර්ෂ පාඨය

එම් මූලද්රව්යය H1 මූලද්රව්යයේ දරුවෙකු වන අතර, උරුම වූ H1 හි ඕනෑම විලාසිතාවක් EM පාඨනයට ද යොමු කරනු ලැබේ. උදාහරණයක් වශයෙන්:

h1 {අකුරු ප්රමාණය: 2em; }}

ෆොන්ට-ප්රමාණයේ දේපළ උරුම වී ඇති හෙයින්, "ලොකු" (එහි EM ටැග් වල ඇතුලත්ව ඇති) එය H1 හි සෙසු ප්රමාණයට සමාන වේ. CSS දේපළෙහි ඇති වටිනාකමට අනුව එය උරුම වෙයි.

CSS උරුමය භාවිතා කරන්නේ කෙසේද

එය භාවිතා කිරීමට පහසුම ක්රමය වන්නේ උරුම සහ උරුම නොවන CSS ගුණාංග හුරු පුරුදු වීමයි. දේපළ උරුම වී ඇත්නම්, එවිට ලේඛනයේ සෑම ළමා ඒකකයක් සඳහාම වටිනාකම පවතිනු ඇත.

මෙය භාවිතා කිරීම සඳහා හොඳම ක්රමය වන්නේ BODY වැනි උසස් මට්ටමේ මූලද්රව්යයක් මත ඔබේ මූලික විලාසයන් සකස් කිරීමයි. ඔබ ඔබේ ශරීරයේ දේපළ මත ඔබේ ෆොන්ටිය-පවුල සකස් කළ හොත්, ඉන් අනතුරුව, උරුමයේ ස්තුතිය, මුළු ලේඛනය එකම මූල-පවුලම තබා ගනු ඇත. මෙය සැබැවින්ම අඩු විලාසිතාවලින් අඩු බැවින් පහසුවෙන් කලමණාකරණය කළ හැකි කුඩා මාදිලි සඳහා නිපදවා ඇත. උදාහරණයක් වශයෙන්:

සිරුර {font-family: Arial, sans-serif; }}

උරුම උරුමය භාවිතා කරන්න

සෑම CSS දේපලම හැකි විකල්පය ලෙස "උරුමය" ඇතුළත් වේ. මෙය වෙබ් බ්රවුසරයට කියනුයේ, දේපළ සාමාන්යයෙන් උරුම කර නොගතහොත්, දෙමව්පියන්ට සමාන අගයක් තිබිය යුතුය. ඔබ උරුම කර නොගත් ආන්තිකයක් වැනි ශෛලියක් සකසා ඇත්නම්, ඔබට පසුව ඇති ගුණාංගවල උරුමය අගය භාවිතා කළ හැකිය. උදාහරණයක් වශයෙන්:

සිරුර {margin: 1em; } p {margin: උරුමය; }}

උරුමය ව්යවහාරික අගයන් භාවිතා කරයි

දිගු භාවිතා කරන ෆොන්ට් ප්රමාණය වැනි උරුම වූ අගයන් සඳහා මෙය වැදගත් වේ. ගණනය කළ අගය යනු වෙබ් පිටුවක වෙනත් වටිනාකමක් ඇති වටිනාකමකි.

ඔබ ඔබේ සිරුරේ මූලද්රව්යයේ 1em හි අකුරු ප්රමාණය තෝරන්නේ නම්, ඔබගේ මුළු පිටුවම 1em ප්රමාණයෙන් පමණක් නොවේ. මෙය ප්රධාන මාතෘකා (H1-H6) සහ වෙනත් මූලද්රව්ය (සමහර බ්රවුසරයන් වගු ගුණාංගයන් වෙනස් ලෙස වෙනස් කිරීම) නිසා වෙබ් බ්රව්සරයේ සාපේක්ෂ විශාලත්වය ඇත. අනෙකුත් ෆොන්ට තරම තොරතුරු නොමැති විට, වෙබ් බ්රවුසරය පිටුවෙහි ඇති විශාලතම පෙළ සඳහා H1 සිරස්තලයක්, H2 සහ වෙනත් ය. ඔබේ සිරුරේ අංගය නිශ්චිත ෆොන්ටී ප්රමාණයකට සකස් කරන විට, එය "සාමාන්ය" අකුරු ප්රමාණය ලෙස භාවිතා කරනු ලබන අතර සිරස් මූලද්රව්ය වලින් එය ගණනය කෙරේ.

උරුමය හා පසුබිම් දේපල පිළිබඳ සටහනක්

ලැයිස්තුගත කර ඇති විලාසයන් ගණනාවක් W3C මත CSS 2 හි උරුමකම් නොලැබුණද, වෙබ් බ්රව්සර තවමත් වටිනාකම් උරුම කර ගනී. උදාහරණයක් ලෙස, ඔබ පහත සඳහන් HTML සහ CSS ලිවීමෙන් නම්: