இணையதள அலங்காரம் - 2

style கள் selector{property: value} என்கிற syntax ஐ கொண்டிருக்கும். அடைப்புக்குறிக்குள் "{}" property:value

என்கிற pair ஒன்றுக்கு மேல் கொடுக்க வேண்டுமானால் ";" (quot இல்லாமல்) property:value கொடுக்க வேண்டும்.

உதாரணமாக: style="font:TheneeUniTx;font-size:10;color:red"

சில style properties:

background-color இது background வண்ணம் கொடுக்கலாம்.

background-image:url("imagename.gif/jpg")

background-repeat:no-repeat

font-family:TheneeUniTx

border:1px solid orange

<div style="font-weight:900; background-repeat:no-repeat; font-family:TheneeUniTx;font-size:10;color:red"> உதாரணம் 1</div>

<div style="font:TheneeUniTx;font-size:13;color:green;font-weight:bold; vertical-align: middle; text-align: center;"> உதாரணம் 2</div>

<div style="font:TheneeUniTx;font-size:13;color:green;display:none"> here your google keywords which will not be visible in webpage</div>

<div style="font:TheneeUniTx;font-size:13;color:yellow;display:block">data will be visible to audience </div>

Styles கள் உதாரணங்கள் இணையத்தில் நிறைந்து காணப்படுகின்றன. டிவ் டேக் போன்றவற்றின் பார்டர்கள், அதன் வண்ணங்கள், ஒரு குறிப்பிட்ட இடத்தில் (position) ஒரு கட்டத்தையோ, ஒரு இமேஜையோ, அல்லது மெனுவையோ வைப்பதற்கு position property பயன்படுத்தப்படுகிறது. இதுபோன்று எழுதிக்கொண்டே செல்லலாம்.

சரி இப்பொழுது நீங்கள் நமுனா (form) ஒன்று உருவாக்குகிறீர்கள் அதில் கண்டிப்பாய் உள்ளிடவேண்டும் என்கிற வற்றில் * கொடுத்திருப்பார்கள் அந்த * சிகப்பு கலரில் வரவேண்டும், * கள் ஒன்றுக்கு மேற்பட்டவையாக இருக்கும். ஆகையால் திரும்பத்திரும்ப style attributes எழுதிக்கொண்டிருக்காமல் இருக்க என்ன செய்வது?

<style type="text/css">
<!--
.stars {color: red}
-->
</style>

Name<span class="stars">*</span>
Email<span class="stars">*</span>

இப்பொழுது இந்த stars style ஐ மற்ற இணையபக்கத்திற்கும் பயன்படுத்தவேண்டும். என்னசெய்ய வேண்டும்? அப்பொழுதுதான் .css என்கிற கோப்பு அவசியமும், எளிதுமாகிறது. Head செக்சனில் கீழே உள்ளவற்றை இட்டால் போதுமானது.

<link href="style.css" rel="stylesheet" type="text/css">

Name<span class="stars">*</span>
Email<span class="stars">*</span>

ஒரு இணையதளத்தின் Style ஐ காப்பி செய்ய முடியுமா?

முடியும். பொதுவாக இணையம் பாவிக்கும் எல்லோரும் ஒரு தளத்தை பார்த்தபின்பு அதன் அலங்காரத்தை பார்த்து அதைப்போல தன்னுடைய தளத்தையும் அமைக்க விரும்புவோம். சற்று விவரம் தெரிந்தவர்கள் அதன் source code பார்போம். ஆனால் நான் முன்பு கூறியது போல், பெரிய இணையதளங்கள் Style="...." என்கிற அட்ரிபுயூட் பயன்படுத்துவதில்லை. மாறாக class=" stylename" என்கிற அட்ரிபுயூடை தான் பயன்படுத்தப்படும்.

அதன் source code சென்று .css என்று தேடுங்கள், அதன் கோப்பு பெயர் தெரிந்துவிடும். இப்பொழுது உங்கள் internet temp போல்டருக்கு சென்று .css கோப்பை தேடுங்கள். அதை காப்பி செய்து பயன்படுத்திக்கொள்ளலாம்.

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

CSS(Cascading Style Sheet) இணையம் 2.0 (Web 2.0) என்கிற இன்றைய நவீன இணையத்திற்கு மிகப்பெரும் பங்காற்றுகிறது என்பதை நாம் தெரிந்து கொள்ளவேண்டும். javascript உடன் CSS ஐ இணைத்து இணைய வல்லுநர்கள் கண்கட்டு வித்தைகள் பலவற்றை செய்து அசத்துகின்றனர்.

அடுத்த பதிவுகளில் இன்ஷா அல்லாஹ்...

இணையம் 2.0 ன் காரணகர்த்தா AJAX என்கிற நுட்பத்தைப்பற்றியும், asp, php,aspx போன்றவற்றில் பய்ன்படுத்துவது/உருவாக்குவது எப்படி என்பனவற்றைப்பற்றியும் வரும் பதிவுகளில் எழுதவுள்ளேன்.அத்துடன் மைக்ரோசாப்ட் நிறுவனத்தின் அட்லாஸ் (ஜுலை) (ajax control) பற்றியும் எழுதுகிறேன்.

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