Text
color என்பது எழுத்துக்களின் நிறத்தைக் குறிக்க உதவும். பின்வரும் 3 விதங்களில் இதன் மதிப்பைக் கொடுக்கலாம் : HEX மதிப்பாகக் கொடுக்கலாம் (e.g: “#ff0000”) , ஒரு RGB மதிப்பாகக் கொடுக்கலாம் (e.g: “rgb(255,0,0)”) அல்லது ஒரு நிறத்தின் பெயரையே கூட கொடுக்கலாம். (e.g: “red”).
text-align என்பது எழுத்துக்களை ஒரே பக்கமாக ஒதுங்குபடுத்த உதவுகிறது. இதன் மதிப்பு Left என்று இருந்தால் இடப்பக்கத்திலும், Right என்று இருந்தால் வலப்பக்கத்திலும், center என்று இருக்கும்போது மையத்திலும் எழுத்துக்களை ஒதுங்குபடுத்துகிறது. Justify எனும் மதிப்பு இடப்பக்க, வலப்பக்க margin-களுக்கிடையில் எழுத்துக்களை சமப்படுத்தி ஒரே அளவில் வெளிப்படுத்தும்.
text-decoration என்பது ஒருவிஷயத்தை எழுதி அதை மற்றவர்களுக்குத் தெரியும் படியாக அடிப்பதற்கோ அல்லது link-ல் இருக்கும் அடிக்கோட்டினை எடுப்பதற்கோ பொதுவாகப் பயன்படும்.
text-transform என்பது மொத்தமாக எழுத்துக்களை ஒரே முறையில் மாற்ற உதவும். இதன் மதிப்பு uppercase என்று இருந்தால் அனைத்து எழுத்துக்களையும் பெரிய எழுத்திலும், lowercase எனில் அனைத்தையும் சிறிய எழுத்திலும், Capitalize என்று இருக்கும்போது ஒவ்வொரு வரியின் முதல் எழுத்தை மட்டும் பெரிதாகவும் மற்றதெல்லாம் சிறியதாகவும் அமைக்கும்.
text-indent என்பது அதன் மதிப்பினைப் பொறுத்து (eg. 50px) எழுத்துக்களை அவ்வளவு இடைவெளி விட்டு தள்ளி அமைக்கும்.
மேற்கண்ட அனைத்து விஷயங்களையும் வைத்து உருவாக்கப்பட்ட ஒரு HTML program-ஐ பின்வரும் உதாரணத்தில் காணலாம்.
[code]
<html>
<head>
<style>
p.first {color:green; text-decoration:overline; text-transform:uppercase; text-indent:50px;}
p.second {color:#0000ff; text-align:right; text-decoration:line-through; text-transform:lowercase;}
p.third {color:rgb(255,0,0); text-align:center; text-decoration:underline; text-decoration:capitalize;}
</style>
</head>
<body>
<p class=”first”> Dont Giveup! Keep on Trying! </p>
<p class=”second”>Even through it seems to be impossible, It will happen in your life one day. </p>
<p class=”third”> All the very best Friends! Wait to receive the surprises in your life!!!!!!</p>
</body>
</html>
[/code]
Font
font-family என்பது எழுத்துக்களின் வகையைக் குறிப்பிட உதவும். இதன் மதிப்பாக பல எழுத்து வகையைக் குறிப்பிடுவதன் மூலம் (“Times New Roman”, Times, serif), முதல் மதிப்பு இல்லையெனில் இரண்டாவது வகையிலும், இரண்டாவதும் இல்லையெனில் 3-வது வகையிலும் எழுத்துக்களை வெளிப்படுத்தும்.
font-style என்பது எழுத்துவகை எவ்விதத்தில் வெளிப்பட வேண்டும் என்பதைக் குறிக்கும். இது Normal, Italic, Bold, Oblique என்பது போன்ற மதிப்பினைப் பெற்று விளங்கும்.
font-size என்பது எழுத்துக்களின் அளவினைக் குறிக்கும். இது px-அலகிலோ அல்லது em-அலகிலோ குறிப்பிடப்படும்.
மேற்கண்ட அனைத்து விஷயங்களையும் வைத்து உருவாக்கப்பட்ட ஒரு HTML program-ஐ பின்வரும் உதாரணத்தில் காணலாம்.
[code]
<html>
<head>
<style>
p.first {font-family:”Tiems New Roman”, Times, serif; font-style:normal; font-size:10;}
p.second {font-style:italic; font-size:20;}
p.third {font-style:bold; font-size:30;}
</style>
</head>
<body>
<p class=”first”> Dont Giveup! Keep on Trying! </p>
<p class=”second”>Even through it seems to be impossible, It will happen in your life one day. </p>
<p class=”third”> All the very best Friends! Wait to receive the surprises in your life!!!!!!</p>
</body>
</html>
[/code]
து.நித்யா
தொடரின் பிற பகுதிகளைப் படிக்க – www.kaniyam.com/category/css-in-tamil/