பல்சுவை தகவல்கள்

HTML Tutorials 20-FONT குறிஒட்டும் அதில் பயன்படுத்தும் பண்புகளும்

Author: Infomas | டிசம்பர் 30, 2014 |

எளிய தமிழில் HTML தொடரில் அடுத்து நாம் காணவிருப்பது குறி

ஒட்டாகும். இதில் பயன்படுத்தப்படும் பண்புகளைப் பற்றியும் பார்க்கலாம்.

FONT என்றால் எழுத்து. எழுத்தில் எத்தனையோ வகைகள் இருக்கின்றன.

இதற்கு பல்வேறு வகையான நிறங்களையும் கொடுக்கலாம்.

குறிஒட்டில் FACE, SIZE மற்றும் COLOR என்னும் பண்புகளைச் சேர்ப்பதன் மூலம் எழுத்தின் வகை, எழுத்தின் அளவு, எழுத்தின் நிறம் போன்றவற்றை மாற்றி அமைக்க முடியும்.

அதாவது இவ்வாறு இருக்க வேண்டும

Sample Text

SIZE பண்பு

SIZE பண்பினை குறி ஒட்டில் கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

1 முதல் 7 வரை எழுத்தின் அளவுகளை இதில்

பயன்படுத்தலாம். Default(கொடாநிலை)ஆக எழுத்தின் அளவு 3 என

இருக்கும்.

உதாரணம்: Change the font size to 3

COLOR பண்பு

உரை எந்த நிறத்தில் தெரிய வேண்டும் என்பதைக் குறிப்பிட COLOR பண்பு

பயன்படுகிறது. இதில் நிறத்தின் பெயரையோ அல்லது அதற்கான RGB

குறிமுறையையோ கொடுக்கலாம்.

COLOR பண்பினை கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

THIS TEXTX IS RED

அல்லது இப்படியும் நிறத்தின் பெயரையும் கொடுக்கலாம்.

THIS TEXT IS RED

FACE பண்பு

உரை எந்த எழுத்து வகையில் காட்டபட வேண்டும் என்பதைக் குறிக்க FACE

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

பயன்படுத்தப்படும் எழுத்து வகைகளை ஏற்றுக் கொள்கின்றன. உலவியால்

காட்ட முடியாத எழுத்து வகைகளை ஏற்றுக் கொள்கின்றன. உலவியால்

காட்ட முடியாத எழுத்து வகையை நாம் கொடுக்கும்போது, உரையானது

கொடாநிலை(DEFAULT) எழுத்து வகையில் காட்டப்படும்.

FACE பண்பினை குறி ஒட்டில் கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

உ.ம்.

Welcome Friends

குறிஒட்டில் ஒரே நேரத்தில் ஒன்றுக்கு மேற்பட்ட பண்புகளைப் பயன்படுத்தலாம்.

உதாரணம்: Happy Birthday

இவ்வாறு குறிஒட்டில் ஒன்றுக்கும் மேற்பட்ட பண்புகளைப் பயன்படுத்தலாம்..

ஒரு உதாரண நிரல்வரிகளைக் காண்போம்..

<HTML>

<HEAD><TITLE>Changing the Font, Size and Color </TITLE>

</HEAD>

<BODY>

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

</BODY>

மேற்கண்ட நிரலை நோட்பேடில் எழுதி .html என்ற விரிவுடன் சேமித்து உலவியில் திறந்து பாருங்கள்.

இவ்வாறு இருக்கும்.

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

www.masinfom.blogspot.com

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 19-BIG TAG மற்றும் SMALL TAG

Author: Infomas | டிசம்பர் 30, 2014 |

கடந்த இடுகையில் <BODY>குறிஒட்டில் பயன்படுத்தப்படும் LINK Attribution-

சிறப்புப் பண்பைப் பற்றிப் பார்த்தோம். தவறவிட்டவர்கள் இணைப்பைக்

கிளிக் செய்து பார்த்துக்கொள்ளுங்கள்.

இன்றையப் பாடத்தில் மேலும் இரண்டு குறிஒட்டுகளைப் பற்றிப்

பார்ப்போம்.

இதில் <BIG> மற்றும் என்ற குறி ஒட்டுகளைப் பற்றிப் பார்க்க

இருக்கிறோம்.

<BIG></BIG> என்ற குறிஒட்டுகள் நாம் எழுதிய எழுத்துகளை அதைவிட சற்று பெரியதாக காட்டப் பயன்படுகிறது.
என்ற குறிஒட்டுகள் நாம் எழுதிய எழுத்துகளை அதைவிட சற்று சிறியதாக காட்டப் பயன்படுகிறது.

<HTML>

<HEAD>

<TITLE> BIG TAG and SMALL TAG</TITLE>

</HEAD>

<BODY>

<BIG>BIG என்ற குறிஒட்டு நாம் எழுதிய எழுத்துகளை அதைவிட சற்று பெரியதாக காட்டப் பயன்படுகிறது. </BIG>

SMALL என்ற குறிஒட்டு நாம் எழுதிய எழுத்துகளை அதைவிட சற்று பெரியதாக காட்டப் பயன்படுகிறது

</BODY>

</HTML>

மேற்கண்ட நிரல் வரிகளை வழக்கம்போலவே நோட்பேடில் எழுதி .html என்ற விரிவுடன் சேமித்து உலவியில் திறந்து பாருங்கள்.

அதன் வெளிப்பாடு இவ்வாறு இருக்கும்.

BIG என்ற குறிஒட்டு நாம் எழுதிய எழுத்துகளை அதைவிட சற்று பெரியதாக காட்டப் பயன்படுகிறது.

SMALL என்ற குறிஒட்டு நாம் எழுதிய எழுத்துகளை அதைவிட சற்று பெரியதாக காட்டப் பயன்படுகிறது

அருண்
www.masinfom.blogspot.com

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 18- LINK Attributions in BODY TAG

Author: Infomas | டிசம்பர் 30, 2014 |

கடந்த பதிவில் Body tag- ல் BACKGROUND பண்பு என்பதைப் பற்றிப் பார்த்தோம்.

தவறவிட்டவர்கள் இணைப்பில் சென்று பதிவைப் படித்துவிட்டுத்

தொடரவும்.

Link பண்பு:

HTML ஆவணத்தில், ஒரு ஆவணத்திலிருந்து மற்றொரு ஆவணத்திற்கு

இணைப்பை ஏற்படுத்த முடியும். இணைப்பை ஏற்படுத்தும் முறைகளைப்

பற்றி பின்வரும் பாடங்களில் படிப்போம். இந்த இணைப்பிற்குப் பயன்படும்

நிறத்தை LINK பண்பின் மூலம் கொடுக்கலாம்.

Internet Explorer, Netscape Navigator போன்ற உலவிகள், சாதாரணமாக இணைப்புகளை நீல நிறத்தில் காட்டுகின்றன. இந்த நிறத்தை நாம் மாற்றிக் கொள்ள முடியும். உதாரணமாக, இந்த இணைப்பைப் பச்சை நிறத்தில் காட்ட

எனும் குறிமுறையைப் பயன்படுத்த வேண்டும்.

VLINK பண்பு(Attribution)

இந்தப் பண்பு, நாம் ஏற்கனவே பார்த்த இணைப்புகளின் நிறத்தை மாற்றிக்

காட்ட பயன்படுகிறது. இன்டர்நெட் எக்ஸ்புரோர்ரும், நெட்ஸ்கேப்

நேவிகேட்டரும் சாதாரணமாக இந்த இணைப்புகளை ஊதா நிறத்தில்

காட்டுகின்றன. இந்த நிறத்தையும் நாம் மாற்றிக்கொள்ள முடியும்.

ஏற்கனவே பார்வையிட்ட இணைப்புகளை சிவப்பு நிறத்தில் காட்ட

என்னும் குறிமுறையைப் பயன்படுத்த வேண்டும்.

ALINK பண்பு (Attribution)

சுட்டியை ஒரு இணைப்புச் சொல்லின் மீது நிறுத்தும்போது ஏற்படும்

இணைப்பு இயங்கு இணைப்பு (Active Link) எனப்படும். இன்டர்நெட்

எக்ஸ்புரோளரும், நெட்ஸ்கேப் நேவிகேட்டரும் இயங்கு இணைப்பினை

சாதாரணமாக சிவப்பு நிறத்தில் காட்டும். இந்த இணைப்பிற்கும் நாம்

வேண்டிய நிறத்தைக் கொடுக்கலாம்.

உதாரணமாக,

என்னும் குறிமுறை இணைப்பினை அக்வா நிறத்தில் காட்டும்.

உதாரண நிரல் ஒன்றைப் பார்ப்போம்.

<HTML>

<HEAD>

<TITLE>LINK ATTRIBUTION In BODY TAG</TITLE>

</HEAD>

<BODY LINK = "Green" VLINK = "Red" ALINK = "aqua">

இணையப் பக்கங்களில் உள்ள இணைப்புகளுக்கு இணைப்பு பண்புகளும் மூலம் நாம் நினைக்கும் நிறத்தைக் கொடுக்க முடியும்.

<a href="http://www.thangampalani.com/search/label/confidence"> தன்னம்பிக்கை தகவல்கள்</a>

</BODY>

</HTML>

* இந்த நிரலை NotePad-ல் எழுதி .html என்ற விரிவுடன் சேமித்து சோதனை செய்து கொள்ளுங்கள்.

இணையப் பக்கங்களில் உள்ள இணைப்புகளுக்கு இணைப்பு பண்புகளும்

மூலம் நாம் நினைக்கும் நிறத்தைக் கொடுக்க முடியும்.

மேற்கண்ட நிரலில் உலவிகள் சாதாரணமாக இணைப்புகளைக் காட்டும்

நிறத்திலிருந்து முற்றிலும் மாறுபட்ட நிறங்களைக் கொடுத்திருக்கிறேன்.

1. இணைப்பு பச்சை நிறத்தில் காட்ட வேண்டும் என குறிப்பிட்டிருக்கிறேன்.

2. ஏற்கனவே பார்வையிட்ட(சொடுக்கப்பட்ட பிறகு) இணைப்பை சிவப்பு நிறத்திலும்

3. இணைப்பின் மீது சுட்டியை (Mouse) நிறுத்தும்போது தோன்றும் நிறமானது அக்வா நிறத்திலும் காட்டபட வேண்டும் என நிரல்வரிகளை அமைத்திருக்கிறேன்.

அடுத்த பதிவில் மேலும் சில முக்கிய குறிஒட்டுகளைப்(TAGs) பற்றிப்

பார்ப்போம்.

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 17- Body tag- ல் BACKGROUND பண்பு..

Author: Infomas | டிசம்பர் 30, 2014 |

கடந்த இடுகையில் Body குறிஒட்டில் பயன்படுத்தப்படும் சிறப்புப் பண்புகளில் ஒன்றான TEXT என்ற பண்பைப் பார்த்தோம். முந்தையப் பதிவில் பார்த்த BGCOLOR என்ற பண்பை போன்றதே

இன்றையப் பதிவில் பார்க்கப்போகும் BACKGROUND என்ற பண்பும்.

HTML ஆவணத்தில் முக்கிய குறிஒட்டான tag-ல் பயன்படுத்தப்படும் சிறப்புப் பண்புகளைப் பற்றி கற்றுக்கொண்டிருக்கிறோம் என்பதை மறவாதீர்கள்.

இந்த BACKGROUND பண்பானது உங்கள் HTML ஆவணத்தில் பின்னணியில் படத்தைச் சேர்க்கப் பயன்படுகிறது. அதாவது முன்பு பார்த்த BGCOLOR என்ற பண்பைப் பார்த்தோமல்லவா? அதைப்போன்றேதான்.. ஒரே ஒரு வித்தியாசம் என்னவெனில் BGCOLOR பண்பில் பின்னணியில் நிறத்தை வைக்கிறோம். BACKGROUND பண்பு பின்னணியில் படத்தை வைக்கிறோம். அவ்வளவே.

இவ்வாறு படத்தை வைக்க TAG-ல் BACKGROUND என்ற சிறப்புப் பண்பைச் சேர்க்க வேண்டும்.

உ.ம்.

<HTML>

<HEAD>

<TITLE>Background in BODY TAG</TITLE>

</HEAD>

<BODY BACKGROUND="IMAGE URL" >

இந்த நிரல் HTML ஆவணத்தில் வலைபக்கங்களின் பின்னணியில் படங்களை வைக்கப் பயன்படும் background என்ற சிறப்புப் பண்பைப் பற்றியது

</BODY>

</HTML>

மேற்கண்ட நிரலில் படத்தினுடைய URL -லை கொடுக்கவேண்டும்.

உலவியில் இதனுடைய வெளிப்பாடு இவ்வாறு இருக்கும்.

இதில் நீங்கள் வைக்க வேண்டிய படத்தின் சரியான கோப்புத் தடத்தைப்(File Path or image url) பதிய வேண்டும். அப்போதுதான் படமானது உங்கள் HTML வலைப்பக்கத்தின் பின்னணியில் படம் தோன்றும்.

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

படத்தின் மீது ரைட் கிளிக் செய்து Properties என்பதைத் தேர்ந்தெடுங்கள்.
அதில் General என்ற டேபில் கீழே Location என்பதற்கு நேராக இருக்கும் பைல்பாத்தை-file path(கோப்புத் தடம்) காப்பி செய்து செய்துகொள்ளுங்கள்.
பிறகு HTML ஆவணத்தில் இறுதியாக அந்த படத்தின் பெயர் என்னவோ அதை தட்டச்சிட்டு சேமித்துக்கொள்ளுங்கள்.

அதாவது இவ்வாறு இருக்க வேண்டும்.

C:\Users\User\Desktop\imagename.jpg

இவ்வாறு கோப்புத் தடத்தை காப்பி செய்துகொண்டு உங்கள் HTML ஆவணத்தில்

<BODY BACKGROUND="IMAGE URL" > என்பதில் IMAGE URL

என்பதை நீக்கிவிட்டு நீங்கள் காப்பி செய்த படத்தின் தடத்தை(FILE PATH) பேஸ்ட் செய்துகொள்ளுங்கள்.

அதாவது இப்படி இருக்க வேண்டும்.

<BODY BACKGROUND="C:\Users\User\Desktop\imagename.jpg" >

இப்போது முழு HTML ஆவணம்

<HTML>

<HEAD>

<TITLE>Background in BODY TAG</TITLE>

</HEAD>

<BODY BACKGROUND="C:\Users\User\Desktop\imagename.jpg" >

இந்த HTML ஆவணம் பின்னணியில் படங்களை வைக்கப் BODY குறி ஒட்டில் பயன்படுத்தக்கூடிய background என்ற சிறப்புப் பண்பைப் பற்றியது.

</BODY>

</HTML>

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

குறிப்பு: படத்திற்கான URL அல்லது File Path சரியாக தட்டச்சிடப்பட்டுள்ளதா அல்லது சரியாக காப்பி பேஸ்ட் செய்துள்ளதா என்பதை ஒரு முறை சோதனை செய்துகொள்ளுங்கள். சிறு தவறு ஏற்படினும் படமானது பின்னணியில் தோன்றாது.

BODY TAG-ல் பயன்படுத்தக்கூடிய சிறப்புப் பண்புகளில் ஒன்றான இணைப்பு பண்பைப் (LINK Attributions) பற்றி இனி வரும் பதிவுகளில் காணலாம்.

பதிவானது பலரையும் சென்றடைய திரட்டிகளில் ஓட்டுப்போட உங்களைக் கேட்டுக்கொள்கிறேன். உங்கள் நண்பர்களுக்கு பகிர சமூதளங்களில் பதிவைப் பகிர்ந்திடுங்கள். நன்றி நண்பர்களே மீண்டும் அடுத்த பதிவில் சந்திப்போம்....!!

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 16-HTML ஆவணத்தில் தமிழை வெளிப்படுத்த

Author: Infomas | டிசம்பர் 30, 2014 |

வெற்றிகரமாகச் சென்றுகொண்டிருக்கும் நமது 'எளிய தமிழில் HTML

கற்றுக்கொள்ள' தொடரில் HTML தொடர்பான அடிப்படைப் பாடங்களை

(கற்றுக்கொண்டு)பார்த்துக்கொண்டு வருகிறோம்.

ஒவ்வொரு பாடத்திலும் எளிமையான தமிழ்வார்த்தைகளைப்

பயன்படுத்தியே வருகிறேன்.

ஒரு HTML ஆவணத்தில் தமிழ் வார்த்தைகளைப் பயன்படுத்தி, அதை HTML

கோப்பாகச் சேமிக்கும்போது ஒரு சிலப் பிரச்னைகள் வரலாம்.

அதாவது தமிழில் எழுதிய உங்களுடைய கோப்புகளை உலவியில்

திறக்கும்போது எழுத்துகள் சரியாக இல்லாமல் சிறு சிறு கட்டங்களாக தோன்றும். அல்லது புரியாத குறியீடுகளைப் போன்ற தோற்றத்தை ஏற்படுத்தும்.

<HTML>

<HEAD>

<TITLE>

How to display tamil in a HTML Document

</TITLE>

</HEAD>

<BODY>

நீங்கள் உங்கள் HTML கோப்புகளை ஒருங்குறி (யுனிகோட்) எழுத்துகளாக தட்டச்சிட்டு, அதை பின்வருமாறு சேமிக்க வேண்டும்.

</BODY>

</HTML>

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

அதில் UTF-8 என்பதைத் தேர்ந்தெடுத்து சேமித்து விடுங்கள்.

சேமித்த HTML கோப்பை(File) உலவியில்(Internet Browser) திறக்கும்போது வலைப்பக்கமானது தமிழிலேயே காட்டும்.

இனி நீங்கள் தமிழில் எழுதும் ஒவ்வொரு புதிய ஹெச்.டி.எம்.எல். கோப்பையும் இந்த முறையில் சேமியுங்கள். பிறகு வலைஉலவியில் திறந்து பார்க்கும்போது வலைப்பக்கமானது(Web Page) அழகு தமிழிலேயே வெளிப்படும்.

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 15-Body tag- ல் TEXT பண்பு..

Author: Infomas | டிசம்பர் 30, 2014 |

வணக்கம் நண்பர்களே.. கடந்த இடுகையில்<BODY>

குறிஒட்டின்(TAG)-ல் பயன்படுத்தக்கூடிய பண்புகளில் ஒன்றான

BGCOLOR என்பதைப் பற்றி விரிவாகப் பார்த்தோம். படிக்கத்

தவறியவர்கள் இந்த இணைப்பை கிளிக் செய்து

பார்த்துக்கொள்ளுங்கள்.

இன்றையப் பாடத்தில் TEXT பண்பு என்பதைப் பற்றிப் பார்ப்போம்.

நீங்கள் உருவாக்கும் HTML ஆவணத்தில் சாதாரணமாக எழுத்துகள்

கறுப்பு நிறத்தில் இருக்கும். இதை நாம் மாற்றலாம். அதற்கு இந்த TEXT

என்ற பண்பு பயன்படுகிறது.

உம். <BODY BGCOLOR="red" TEXT="White"> என்று கொடுத்துப்

பாருங்கள். இதன் விளைவு பின்னணி நிறம் சிவப்பாகவும், அதில்

நீங்கள் தட்டச்சிடும் உரையானது வெண்மை நிறத்திலும் இருக்கும்.

உ.ம்.

ஒரு HTML ஆவணத்தைப் பார்ப்போம்.

<HTML>

<HEAD>

<TITLE>BGCOLOR AND TEXT COLOR</TITLE>

</HEAD>

<BODY BGCOLOR="red" TEXT="White">

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

</BODY>

</HTML>

இந்த நிரலை Notepad எழுதி .html என்ற விரிவுடன் சேமித்து உங்கள்

உலவியில் திறந்துபாருங்கள்.

மேற்கண்ட HTML ஆவணத்தில் பின்னணி நிறம் மற்றும் எழுத்தின்

நிறத்தையும் நிர்ணயிக்கும் சிறப்புப் பண்புகளான BGCOLOR, TEXT என்ற

இரு பண்புகளைப் பயன்படுத்தியிருக்கிறேன்.

உலவியில் இதனுடைய வெளிப்பாடு(OUTPUT) இவ்வாறு இருக்கும்.

இந்த HTML ஆவணம் பிண்ணனி நிறத்தையும், அதில் இடம்பெறும்

எழுத்துக்களின் நிறத்தையும் குறிக்கும் வகையில்

அமைக்கப்பட்டிருக்கிறது. அதாவது பின்னணி நிறம் சிவப்பாகவும்,

அதில் இடம்பெறும் எழுத்துகள் வெண்மையாகவும் இருக்குமாறு BODY

குறி ஒட்டில் சிறப்புப் பண்புகளைப் பயன்படுத்தி எழுதப்பட்டிருக்கிறது.

இதில் பின்னணி நிறம் சிவப்பாகவும், அதில் இடம்பெற்றுள்ள

உரைக்கான எழுத்துகள் அனைத்தும் வெண்மை நிறத்திலும்

இருப்பதைப் பாருங்கள். இவ்வாறு நமக்கு விருப்பமான வண்ணங்களில்

எழுத்துகளை TEXT பண்பைப் <BODY> TAG-ல் பயன்படுத்துவதன்

மூலம் பெற்றுக்கொள்ளலாம்.

குறிப்பு: இந்த சிறப்புப் பண்புகள் அனைத்தும் Body என்னும் குறிஒட்டில்(Tag) பயன்படுத்தக்கூடியவை என்பதை நினைவில் வைத்திருங்கள்.

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 14-Body tag-ல் சிறப்புப் பண்பு bgcolor

Author: Infomas | டிசம்பர் 30, 2014 |

ஒரு HTML ஆவணத்தின் உரைப்பகுதியானது <BODY> மற்றும் </BODY>

என்னும் குறி ஒட்டுகளுக்கு(Tags) இடையே இருக்கும்.

இது நமக்குத் தெரிந்ததே. இந்த BODY குறிஒட்டில்(TAG) லும் நிறைய சிறப்புப்

பண்புகளைச் சேர்க்க முடியும். அந்த வகையில் ஒரு ஆவணத்தின் பின்னணி

நிறத்தை கொடுக்கக்கூடிய சிறப்புப் பண்பான BGCOLOR என்பதைப் பற்றி

பார்ப்போம்.

<BODY> குறி ஒட்டில் பண்புகளைச் சேர்ப்பதன் மூலம் பின்னணி

நிறம்(BACKGROUND),பின்னணியில் படம்(Background Image), எழுத்தின்

நிறம்(Font COLOR) இணைப்புக் கோட்டின் நிறம்(LINK LINE COLOR)

போன்றவற்றைக் கொடுக்க முடியும்.

<BODY> குறிஒட்டில் (Tag ) BGCOLOR, TEXT, BACKGROUND, LINK, VLING, ALINK, LEFTMARGIN மற்றும் TOPMARGIN போன்ற பண்புகளைக் கொடுக்க முடியும். இந்தப் பண்புகளைப் பற்றிக் இன்றையப் பாடத்தில் பார்ப்போம்.

BGCOLOR - (பின்னணி நிறம்) பண்பு

<BODY> என்ற குறி ஒட்டில் BGCOLOR என்னும் பண்பைச் சேர்ப்பதன் மூலம் பக்கத்தின் JSன்னணி நிறத்தைக் கொடுக்க முடியும். RGB நிறக் குறிமுறையைப்(Color names) பயன்படுத்துதல், ஆறு இலக்க பதினறும எண்ணைப் (Color Values)பயன்படுத்துதல் போன்ற இரு வழிகளில் நிறத்தைக் கொடுக்க முடியும்.

ஆறு இலக்க பதினறும எண்ணில் முதல் இரண்டு இலக்கம் சிவப்பு நிறத்தையும், அடுத்த இரண்டு இலக்கம் பச்சை நிறத்தையும், கடைசி இரண்டு இலக்கம் ஊதா நிறத்தையும் குறிக்கின்றன. இவை அனைத்தும் முதன்மை நிறங்களான (RGB - RED, GREEN, BLUE) ஆகியவை.

எடுத்துக்காட்டாக FFFFFF என்பது வெள்ளை நிறத்தையும், FF0000 என்பது சிவப்பு நிறத்தையும், FFFF00 என்பது மஞ்சள் நிறத்தையும் குறிக்கின்றன. நிறத்தை இவ்வாறு பதின்றும இலக்கங்களில் கொடுப்பது சிரமமானதாக இருக்கலாம்.

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

black, silver, Grey, white, maroon, red, purple, fuchsia, green, lime, Olive, yellow, navy, blue, teal மற்றும் aqua என்பன போன்ற பதினாறு வகை நிறங்கள் வரை ஏற்றுக்கொள்கின்றன.

உதாரணம் ஒன்றைப் பார்ப்போம்.

என்று கொடுக்கும்போது உங்கள் வலைப்பக்கத்தின் பின்னணி நிறமானது பச்சை நிறத்தில் காணப்படும்.

பின்னணி நிறம் எதுவும் இல்லையெனில் எப்போதும்போல வெண்மையாகவே இருக்கும்.

<HTML>

<HEAD>

<TITLE>How to put background color in html page?</TITLE>

</HEAD>

<BODY bgcolor="green">

வணக்கம் நண்பர்களே,

இது அருண். நான் உங்களுக்குஎளிய தமிழில்<

HTML எனும் தலைப்பில்

கற்றுக்கொடுக்க ஆரம்பித்திருக்கிறேன்.

தொடர்ந்து இந்தத் தொடர்பதிவைப்

படித்து பயன்பெற வேண்டுகிறேன்.

நன்றி

</BODY>

</HTML>

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

அடுத்தப் பதிவில் இதே <body> குறிஒட்டில் இன்னும் சில சிறப்புப் பண்புகள் இருக்கிறது. அதில்TEXT பண்பு, BACKGROUND பண்பு(attributes)களைப்பற்றிப் படிப்போம்.

Source : http://www.thangampalani.com/

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 13-BR (Break) tag

Author: Infomas | டிசம்பர் 30, 2014 |

இது எதற்கென்றால் ஒரு வரியை முடித்து, அடுத்த வரிக்குச் செல்ல

வேண்டும் என்பதை Browser-க்கு சொல்லப் பயன்படும் குறிஒட்டாகும்.

கீழக்காணும் எடுத்துக்காட்டைக் கவனியுங்கள்..

<HTML>

<HEAD>

<TITLE>THIS IS MY OWN PAGE</TITLE>

</HEAD>

<BODY>

<CENTER>வணக்கம் நண்பர்களே, 

இது அருண். நான் உங்களுக்குஎளிய தமிழில் 

HTML எனும் தலைப்பில் 

கற்றுக்கொடுக்க ஆரம்பித்திருக்கிறேன். 

தொடர்ந்து இந்தத் தொடர்பதிவைப் 

படித்து பயன்பெற வேண்டுகிறேன். 

நன்றி</CENTER>

</BODY>

</HTML>

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

மேற்கண்டவற்றின் வெளிபாடு(உலவியில்) இவ்வாறு இருக்கும்.

வணக்கம் நண்பர்களே,

இது அருண். நான் உங்களுக்குஎளிய தமிழில்

HTML எனும் தலைப்பில்

கற்றுக்கொடுக்க ஆரம்பித்திருக்கிறேன்.

தொடர்ந்து இந்தத் தொடர்பதிவைப்

படித்து பயன்பெற வேண்டுகிறேன்.

நன்றி

என்ன காரணம்?

ஒவ்வொரு வரி முடிவிலும் Tag சேர்த்திருப்பதால் இந்த மாற்றம்

வந்திருக்கிறது. இதிலிருந்து Tag -ன் பயன்பாடு என்ன என்பது

புரிந்திருக்கும்.

உங்களுக்கு தேவைப்படும் இடங்களில் இந்த Tag

பயன்படுத்திக்கொள்ளலாம். குறிப்பாக செய்யுள்கள், கவிதைகள்

போன்றவைகளை அடுத்த வரிகளில் அவைகள் உள்ளது உள்ளபடியே

காட்டினால்தான் பொருள்தரக்கூடிய வகையில் இருக்கும். இதற்கும் இந்த

Tag பயன்படுகிறது.

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

HTML Tutorials 12-CENTER tag

Author: Infomas | டிசம்பர் 30, 2014 |

எளிய தமிழில் HTML கற்றுக்கொள்ள தொடர் மூலம் நிறைய புதிய

நண்பர்களைப் பெற்றிருப்பதில் மிக்க மகிழ்ச்சி. விடுபட்ட கடந்த

மூன்றுநாட்களுக்கான பதிவுகளையும் சீரான இடைவெளியில் இன்றைய

வேலைநாளில் பதிவிட எண்ணியிருக்கிறேன். பதிவிற்கு வருவோம்.

கடந்த பதிவில் பத்திக் குறி ஒட்டில் (Paragraph Tag) இசைவுப்(Align) பண்புகளைப் (attributes) பற்றிப் பார்த்தோம்.

இப்பதிவில் <CENTER> மற்றும் </CENTER> ஆகிய குறி ஒட்டுகளைக் காண்போம். இந்தக் குறிஒட்டுகளுக்கு(Tags) இடையில் உள்ள உரை உலவித்திரையில் கிடைமட்டமாக(Horizontal) மையப்படுத்திக் காட்டப்பட பயன்படுத்தப்படுகிறது.அதாவது வலைப்பக்கத்தில் மையப்படுத்தி(Center) காண்பிக்கும்.

கீழ்க்கண்ட நிரல்வரிகளை notepade-ல் எழுதி வழக்கம்போலவே .html என்ற விரிவுடன் சேமித்து, உங்கள் கோப்பை Internet Explorer, Google Chrome, Firefox போன்ற உலவிகளில் திறந்துப் பாருங்கள். உரையானது மையப்படுத்திக் காண்பிக்கப்பட்டிருக்கும்.

<HTML>

<HEAD>

</HEAD>

<BODY>

<CENTER>HI Masinfom BLOG VIEWERS</CENTER>

</BODY>

</HTML>

இதன் வெளிப்பாடு இவ்வாறு இருக்கும்.

HI Masinfom BLOG VIEWERS

இவ்வாறு ஒரு உரையை நடுவில், மையப்படுத்தி காண்பிக்க இந்த <center></center>குறிஒட்டுகள் காண்பிக்கப் பயன்படுகிறது.அடுத்த பதிவில் (Break Tag)ஐப் பற்றிப் பார்ப்போம்

HTML, HTML Tutorial, Subjects(Computer Programming Languages)

செவ்வாய், 30 டிசம்பர், 2014

எளிய தமிழில் HTML தொடரில் அடுத்து நாம் காணவிருப்பது <FONT>குறி

ஒட்டாகும். இதில் பயன்படுத்தப்படும் பண்புகளைப் பற்றியும் பார்க்கலாம்.

FONT என்றால் எழுத்து. எழுத்தில் எத்தனையோ வகைகள் இருக்கின்றன.

இதற்கு பல்வேறு வகையான நிறங்களையும் கொடுக்கலாம்.

அதாவது இவ்வாறு இருக்க வேண்டும

<FONT SIZE="Size of the text in pixels" COLOR="Color Name" FACE="font name"> Sample Text</FONT>

SIZE பண்பு

SIZE பண்பினை <FONT> குறி ஒட்டில் கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

<FONT SIZE= "Value"> 1 முதல் 7 வரை எழுத்தின் அளவுகளை இதில்

பயன்படுத்தலாம். Default(கொடாநிலை)ஆக எழுத்தின் அளவு 3 என

இருக்கும்.

உதாரணம்: <FONT SIZE="3">Change the font size to 3</FONT>

COLOR பண்பு

உரை எந்த நிறத்தில் தெரிய வேண்டும் என்பதைக் குறிப்பிட COLOR பண்பு

பயன்படுகிறது. இதில் நிறத்தின் பெயரையோ அல்லது அதற்கான RGB

குறிமுறையையோ கொடுக்கலாம்.

COLOR பண்பினை <FONT> கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

<FONT COLOR="#FF000">THIS TEXTX IS RED</FONT>

அல்லது இப்படியும் நிறத்தின் பெயரையும் கொடுக்கலாம்.

<FONT COLOR="red">THIS TEXT IS RED</FONT>

FACE பண்பு

உரை எந்த எழுத்து வகையில் காட்டபட வேண்டும் என்பதைக் குறிக்க FACE

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

பயன்படுத்தப்படும் எழுத்து வகைகளை ஏற்றுக் கொள்கின்றன. உலவியால்

காட்ட முடியாத எழுத்து வகைகளை ஏற்றுக் கொள்கின்றன. உலவியால்

காட்ட முடியாத எழுத்து வகையை நாம் கொடுக்கும்போது, உரையானது

கொடாநிலை(DEFAULT) எழுத்து வகையில் காட்டப்படும்.

FACE பண்பினை <FONT> குறி ஒட்டில் கீழ்க்கண்டவாறு பயன்படுத்தலாம்.

உ.ம்.

<FONT FACE="Arial">Welcome Friends</FONT>

<FONT > குறிஒட்டில் ஒரே நேரத்தில் ஒன்றுக்கு மேற்பட்ட பண்புகளைப் பயன்படுத்தலாம்.

உதாரணம்: <FONT FACE="Arial" SIZE="5" COLOR="Blue">Happy Birthday</FONT>

இவ்வாறு <FONT> குறிஒட்டில் ஒன்றுக்கும் மேற்பட்ட பண்புகளைப் பயன்படுத்தலாம்..

ஒரு உதாரண நிரல்வரிகளைக் காண்போம்..

<HTML>

<HEAD><TITLE>Changing the Font, Size and Color </TITLE>

</HEAD>

<BODY>

<FONT face= "arial" size="3" color="red">Dear Friends..!"</FONT> <BR>

<FONT face= "digital" size="3" color="green">Dear Friends..!"</FONT> <BR>

<FONT face= "forte" size="3" color="blue">Dear Friends..!"</FONT> <BR>

<FONT face= "elephant" size="3" maroon="red">Dear Friends..!"</FONT> <BR>

<FONT face= "alerian" size="3" color="navy">Dear Friends..!"</FONT> <BR>

</BODY>

மேற்கண்ட நிரலை நோட்பேடில் எழுதி .html என்ற விரிவுடன் சேமித்து உலவியில் திறந்து பாருங்கள்.

இவ்வாறு இருக்கும்.

Dear Friends..!"

Dear Friends..!"

Dear Friends..!" Dear Friends..!" Dear Friends..!"

இன்றையப் பதிவில் பார்க்கப்போகும் BACKGROUND என்ற பண்பும்.

மேற்கண்ட நிரலில் படத்தினுடைய URL -லை கொடுக்கவேண்டும். உலவியில் இதனுடைய வெளிப்பாடு இவ்வாறு இருக்கும்.

வணக்கம் நண்பர்களே.. கடந்த இடுகையில்<BODY>

குறிஒட்டின்(TAG)-ல் பயன்படுத்தக்கூடிய பண்புகளில் ஒன்றான

BGCOLOR என்பதைப் பற்றி விரிவாகப் பார்த்தோம். படிக்கத்

தவறியவர்கள் இந்த இணைப்பை கிளிக் செய்து

பார்த்துக்கொள்ளுங்கள்.

இன்றையப் பாடத்தில் TEXT பண்பு என்பதைப் பற்றிப் பார்ப்போம்.

நீங்கள் உருவாக்கும் HTML ஆவணத்தில் சாதாரணமாக எழுத்துகள்

கறுப்பு நிறத்தில் இருக்கும். இதை நாம் மாற்றலாம். அதற்கு இந்த TEXT

என்ற பண்பு பயன்படுகிறது.

<HTML>

<HEAD>

இந்த நிரலை Notepad எழுதி .html என்ற விரிவுடன் சேமித்து உங்கள்

உலவியில் திறந்துபாருங்கள்.

இந்த HTML ஆவணம் பிண்ணனி நிறத்தையும், அதில் இடம்பெறும்

Dear Friends..!"

Dear Friends..!"

Dear Friends..!"

மேற்கண்ட நிரலில் படத்தினுடைய URL -லை கொடுக்கவேண்டும்.

உலவியில் இதனுடைய வெளிப்பாடு இவ்வாறு இருக்கும்.