எச்.ரி.எம்.எல்(HTML)அல்லது மீசுட்டு மொழி 1என்ற பதிவில் ஏற்கனவே HTML பற்றிய ஒரு தொடக்கத்தை வெளியிட்டிருந்தேன். அதன் தொடர்ச்சியாக இந்த பதிவு இடம் பெறுகின்றது.இன்று HTML பற்றிய அடுத்த கட்டத்திற்கு செல்ல உள்ளோம். எப்படிHTML Coding எழுதி Run பண்ணுவது என்று பார்ப்போம்.இது பெரிய விடயமே இல்லை சாதாரண ஒரு சின்ன விடயம்தான்.
<!DOCTYPE html>
<html>
<Head>
<title> My first Html</title>
</head>
<body>
Welcome to my webpage .
</body>
</html>
நீங்கள் Notepad ஐ திறந்து அதில் மேலுள்ள Coding ஐ அப்படியே Type செய்து Save பண்ணுங்கள். பண்ணும் போது .Html என்னும் Extension ஐ பயன்படுத்துங்கள்.அப்போதுதான் அது Html File என்று Notepad ற்கு தெரியும் இல்லாவிடின் அதை வெறும் Text Fileஆகவே வாசிக்கும்.
இங்கு Head க்குள் உள்ள Title இல் உள்ளது தலையங்கமாக அமைவதை காணலாம் ஏனென்றால் நாம் சில வேளை 100 கணக்கான HTML Page எழுதுவோம் அவற்றை நமக்கு இலகுவாக வேறு பிரிக்கத்தான் இந்த <title> உதவுகின்றது. My First Html என்பதே Browser இல் Heading ஆகத் தெரியும்.
இங்கு Body க்குள் எழுதப்பட்ட அனைத்தும் தான் வெளியில் அதாவது Browser இல் தெரியும் உதாரணத்திற்காக Body க்குள் Welcome to my webpage.இப்படி எழுதியிருக்கின்றேன் அதுதான் Browser தெரியும் பாருங்கள்.
அவ்வளவுதான் இனி நீங்கள் உங்களுக்கு விரும்பிய வாறு Coding செய்து webpage அழகுபடுத்திக் கொள்ளுங்கள்.நீங்கள் யோசிக்கலாம் எப்படி இனி எமது உள்ளடக்கங்களை அழகு படுத்துவது என்று ஆம் அதற்கும் நிறைய Html Tag கள் உள்ளன அவற்றை மெல்ல மெல்ல பார்ப்பபோம்.
அடுத்ததாக Html இன் Heading பற்றி பார்க்கலாம் முக்கியமானதாக இதுவும் விளங்குகின்றது. எழுத்துக்களுக்கான வேறு வேறான அளவுகளை கொடுக்கின்றது. இதை Heading Tag என்று அழைப்பர் <h> என்ற குறியீட்டின் மூலம் குறிக்கப்படுகின்றது.இது <h1>தொடக்கம் <h6> வரைஉள்ளது.
<h1>Welcome to my webpage</h1>
<h2>Welcome to my webpage</h2>
<h3>Welcome to my webpage</h3>
<h4>Welcome to my webpage</h4>
<h5>Welcome to my webpage</h5>
<h6>Welcome to my webpage</h6>
Body க்குள் இதை Type செய்து பாருங்கள் வித்தியாசம் விளங்கும்.<h1>ஆனது மிகப்பெரிய Heading ஐயும் <h6>ஆனது மிகச்சிறிய Heading ஐயும் கொடுக்கின்றது.
அடுத்ததாக Paragraph பற்றிப்பார்ப்போம்.
Look at the document in your browser.
You might have expected your document to appear as you typed it, on two lines, but instead you should see something like this:
This is my first web page How exciting.
This is because web browsers don’t usually take any notice of what line your code is on. It also doesn’t take any notice of spaces (you would get the same result if you typed “This is my first web page How exciting”).
If you want text to appear on different lines or, rather, if you intend there to be two distinct blocks of text (because, remember, HTML is about meaning, not presentation), you need to explicitly state that.
Change your two lines of content so that they look like this:
இது ஒன்றுமில்லை சும்மா ஒரு உதாரணத்திற்காகத்தான். மேலுள்ளதை இரண்டு தரம் இடைவெளி விட்டு விட்டு Paste பண்ணுங்கள் எப்படி வருகின்றது என்று பாருங்கள்.
பிறகு <p>ஐ கொடுத்து Paste பண்ணிபாருங்கள் புரிகிறதா வித்தியாசம். ஒரு அழகான Paragraph ஐ உருவாக்கவே இந்த பயன்படுகின்றது.Html ஆனது Body க்குள் உள்ள இடைவெளிகளை கணக்கில் எடுக்காது. அதுதான் நாம் மேல் இடைவெளிவிட்டதையும் சேர்த்துக் காட்டுகின்றது. <p> tag கொடுத்ததும் பிரித்துக் காட்டுகின்றது.
<p>........................</p>
இப்படித்தான் HTML இன் செயற்பாடுகள் நடைபெறுகின்றது.
நன்றி மீண்டும் தொடருவோம் ஒரு பதிவுடன்
0 comments:
Post a Comment