தகவல் தொழில்நுட்பக் களஞ்சியம்

தகவல் தொழில்நுட்ப முதல் தமிழ் வலைத்தளம் உங்களை அன்புடன் வரவேற்கின்றது.

Monday, July 28, 2014

HTML கற்போம் - 6

No comments | 

Cell spacing

<html>
<body>
<h4>Without cellspacing:</h4>
<table border="1">
<tr>
                                                 <td>First</td>
                                                <td>Row</td>
</tr>
<tr>
                                                 <td>Second</td>
                                                 <td>Row</td>
</tr>
</table>
<h4>With cellspacing="0":</h4>
<table border="1" cellspacing="0">
<tr>
                                                <td>First</td>
                                                <td>Row</td>
</tr>
<tr>
                                                 <td>Second</td>
                                                <td>Row</td>
</tr>
</table>
<h4>With cellspacing="10":</h4>
<table border="1" cellspacing="10">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>
<tr>
                                                 <td>Second</td>
                                                <td>Row</td>
</tr>
</table>
</body>
</html>

Without cellspacing:
First
Row
Second
Row

With cellspacing="0":
First
Row
Second
Row

With cellspacing="10":
First
Row
Second
Row


HTML Unordered Lists
வரிசைப்படுத்தப்படாத பட்டியல்களை அமைப்பதற்கு <ul> tag (ul – unordered list). ஒவ்வரு பட்டியல் உருப்படியையும் வரையறை செய்வாதற்கு <li> tag (li- list)பயன்படுகின்றது.
<ul>
            <li>Coffee</li>
            <li>Milk</li>
</ul>
Browser இல் பின்வருமாறு காட்சியளிக்கும்.
  • Coffee
  • Milk
HTML Ordered Lists
வரிசைப்படுத்தப்பட்ட பட்டியல்களை அமைப்பதற்கு <ol> tag (ol – ordered list). ஒவ்வரு பட்டியல் உருப்படியையும் வரையறை செய்வாதற்கு <li> tag (li- list)பயன்படுகின்றது.
<ol>
            <li>Coffee</li>
            <li>Milk</li>
</ol>
Browser இல் பின்வருமாறு காட்சியளிக்கும்.
  1. Coffee
  2. Milk
HTML Definition Lists
பட்டியலில் உள்ள ஒவ்வரு உருப்படி பற்றிய விபரிப்புக்களை வழங்குவதற்கு
<dl> - definition list
<dt> - definition item in the list
<dd> - describes the item in the list
போன்ற tag பயன்படுத்தப்படுகின்றது.
<dl>
            <dt>Coffee</dt>
            <dd>- black hot drink</dd>
            <dt>Milk</dt>
            <dd>- white cold drink</dd>
</dl>
Browser இல் பின்வருமாறு காட்சியளிக்கும்.
1.      Coffee
- black hot drink
2.      Milk
- white cold drin

வெவ்வேறு வகையான வருசைப்படுத்தப்பட்ட பட்டியல்களை சமர்பிக்கும் முறைக்கான உதாரணம்.
<html>
<body>
<h4>Numbered list:</h4>
<ol>
 <li>Apples</li>
 <li>Bananas</li>
 <li>Lemons</li>
                                                <li>Oranges</li>
</ol> 
<h4>Letters list:</h4>
<ol type="A">
 <li>Apples</li>
                                                <li>Bananas</li>
                                                <li>Lemons</li>
                                                <li>Oranges</li>
</ol> 
<h4>Lowercase letters list:</h4>
<ol type="a">
 <li>Apples</li>
 <li>Bananas</li>
 <li>Lemons</li>
 <li>Oranges</li>
</ol> 
<h4>Roman numbers list:</h4>
<ol type="I">
 <li>Apples</li>
 <li>Bananas</li>
                                                <li>Lemons</li>
                                                <li>Oranges</li>
</ol> 
<h4>Lowercase Roman numbers list:</h4>
<ol type="i">
 <li>Apples</li>
                                                <li>Bananas</li>
 <li>Lemons</li>
 <li>Oranges</li>
</ol> 
</body>
</html>

Browser இல் பின்வருமாறு காட்சியளிக்கும்.

Numbered list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Letters list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Lowercase letters list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Roman numbers list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges

Lowercase Roman numbers list:

  1. Apples
  2. Bananas
  3. Lemons
  4. Oranges
அடுக்குமுறைப்பட்டியல்களை சமர்பிக்கும் முறைக்கான உதாரணம்.
<html>
<body>
<h4>A nested List:</h4>
<ul>
 <li>Coffee</li>
                                                 <li>Tea
                                                                <ul>
                                                                                <li>Black tea</li>
                                                                                 <li>Green tea</li>
                                                                </ul>
                                                </li>
                                                <li>Milk</li>
</ul>
</body>
</html>

 

Browser இல் பின்வருமாறு காட்சியளிக்கும்.

A nested List:

  • Coffee
  • Tea
    • Black tea
    • Green tea
  • Milk
Tag
Description
<ol>
Defines an ordered list
<ul>
Defines an unordered list
<li>
Defines a list item
<dl>
Defines a definition list
<dt>
Defines an item in a definition list
<dd>
Defines a description of an item in a definition list

Sunday, July 27, 2014

HTML கற்போம் - 5

No comments | 

HTML Images

Example
<html>
<body>
<h2>Norwegian Mountain Trip</h2>
<img border="0" src="/images/pulpit.jpg" alt="Pulpit rock" width="304" height="228">
</body>
</html>

The <img> Tag and the Src Attribute
HTML,இல்  images ஆனது  <img> tag இனால் வரையரை செய்யப்படும்.
<img> tag ஆனது  closing tag கொண்டிருப்பது இல்லை இது attributes மட்டும் கொண்டிருக்கும்
<img src=”image path/image URL” alt=”image description” width="value" height="value">
Src attributes இனால் image இருக்கம் இடத்தினையும், alt attributes இனால் imageபற்றிய தகவலும் வழங்கப்படும் இத்தகவல் வெளியீடாக அமையாது. அத்துடன் படத்தின் நீள அகலங்கள் width, height என்ற attributes இனால் வழங்கப்படும்.

HTML Tables
HTML document இல் Tables ஆனது  <table> tag வரையறை செய்யப்படும்.
Table இல் உள்ள ஒவ்வரு row வும் <tr> tag (Table row) இனாலும், ஒவ்வரு cellலும்<td> tag (table data) இனாலும் வரையறை செய்யப்படும்.


Table Example
<table border="1">
            <tr>
                        <td>row 1, cell 1</td>
                        <td>row 1, cell 2</td>
            </tr>
            <tr>
                        <td>row 2, cell 1</td>
                        <td>row 2, cell 2</td>
            </tr>
</table>
Browser இல் பின்வருமாறு காட்சியளிக்கும்.
row 1, cell 1
row 1, cell 2
row 2, cell 1
row 2, cell 2

Saturday, July 26, 2014

HTML கற்போம் - 4

No comments | 

The HTML <meta> Element

<meta> tag (Metadata) ஆனது குறிப்பிட்ட HTML document இன் விபரிப்பை வழங்குவதாக அமையும். இது குறிப்பட்ட HTML  page இன் வெளியீடாக அமையாது. இதனுல் search engines  பயன்படுத்தும் keywords கள் உள்ளடக்கப்படும்.
<meta> tags , <head> element இனுல் வளங்கப்படும்

<meta> Tags - Examples

search engines தேவையான keywords வரையறை செய்வதற்கும், குறித்த இணையத்தளம் பற்றிய விபரிப்பினை மேற்கொள்வதற்கும்,  <meta> tag பயன்படுகின்றது.
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
<meta name="description" content="Free Web tutorials on HTML and CSS">
<meta name="author" content="Hege Refsnes">
<meta http-equiv="refresh" content="30">  - Refresh document every 30 seconds:

HTML Formatting Tags
1.
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><em>This text is emphasized</em></p>
<p><i>This text is italic</i></p>
<p><small>This text is small</small></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>

</body>
</html>



Browser இல் பின்வருமாறு காட்சியளிக்கும்.
This text is bold
This text is strong
This text is emphasized
This text is italic
This text is small
This is subscript and superscript
2.
<html>
<head><title> font face, font color, font size, and background color</title> </head>
     <body bgcolor=”#c0f2d9”> <! Define background color >
     <h1> <font color=”orange”> Our Country</h1> <! Define font color >
     <p> <font face=”arial” fontsize=”3”> My School </p> <! Define font,font size >
     </body>
</html>


Tag
Description
<b>
Defines bold text
<em>
Defines emphasized text 
<i>
Defines a part of text in an alternate voice or mood
<small>
Defines smaller text
<strong>
Defines important text
<sub>
Defines subscripted text
<sup>
Defines superscripted text

Friday, July 18, 2014

HTML கற்போம் - 3

No comments | 

HTML Attributes
  • HTML elements ஒவ்வொன்றும் attributes கொண்டிருக்கலாம்
  • ஒவ்வொரு Attributes உம் குறிப்பிட்ட element  க்குரிய மேலதிக தகவலைத்தரும்.
  • Attributes ஒவ்வொன்றும் ஆரம்ப tag இல் குறிப்பிடப்படும்.
Example
<a href=" http://www.schoolnet.lk ">This is a link</a>  இங்கு href என்பது attributeஆகவும்  http://www.schoolnet.lk என்பது குறிப்பட்ட attribute க்குரிய Valueவாகவும் காணப்படும்.

HTML Lines
 <hr>tag ஆனது HTML page இல்  horizontal line உருவாக்கப்பயன்படும்.
Example
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p>
<hr>
<p>This is a paragraph.</p> 

HTML Comments
HTML code இனை விழங்கி கொள்வதற்காக இதனை பயன்படுத்துவர். இதனை உங்கள் browser இல் வெளியீடாக தராது.
<!-- This is a comment --> 


HTML Line Breaks
ஒரு குறிப்பட்ட பந்தியினுல் புதிய வரியினை உருவாக்குவதற்கு <br> tagபயன்படுத்தப்படும்.
Example
<p>This is<br>a para<br>graph with line breaks</p>
 <br> tag ஒரு empty HTML element ஆகும். இது end tag இனை கொண்டிருக்காது.

The HTML <head> Element

<head> tag இனுல் scripts, meta, browser ,style sheets க்குரிய கட்டளைகளை கொண்டிருக்கும். பின்வரும் tags , head பகுதியினுல் உள்ளடக்கப்படும். <title>, <style>, <meta>, <link>, <script>, <noscript>, <base>.

The HTML <title> Element

<title> tag ஆனது குறிப்பிட்ட HTML document க்கான தலைப்பை வழங்குவதற்கு பயன்படும். இது ஒரு HTML document க்கு கட்டாயமனது ஆகும்.
  • browser toolbar இன் தலையங்கமாகவும்.
  • favourite ஆக browser இல் சேமிக்கப்படும் கோப்பின் பெயராகவும்.
  • தேடல் இயந்திரத்தின் தேடல் பெயராகவும்(search-engine results) காணப்படும்.

<html>
                <head>
                                <title>Title of the document</title>
                </head>

                <body>
                                The content of the document......
                </body>

</html>


Blogger Tips and TricksLatest Tips For BloggersBlogger Tricks

சொயற்படுத்துங்கள்

சொயற்படுத்துங்கள்

Blog Archive

Total Pageviews