வியாழன், 12 ஆகஸ்ட், 2010

மீஉரை - பட்டியல்களும் படங்களும்

இவ்வளவு தமிழில் படிச்சாச்சு. முழுசா மீஉரை நிரல் அமைப்பில் என்னெல்லாம் இருக்கிறது என்று பார்க்க வேண்டும் என்று ஆர்வம் இருப்பவர்கள் http://w3schools.com/html/default.asp என்ற முகவரியில் இருக்கும் பாடங்களைப் பார்க்கலாம்.

வலைப்பக்க உள்ளடக்கத்தில் நிரல் எழுத நாம் இதுவரை பார்த்த கொக்கிகள் -
<a></a> - <நங்கூரம்></நங்கூரம்>
<br /> - <முறி />
<p></p> - <பத்தி></பத்தி>

இன்றைக்கு பட்டியல்களும், படங்களும்.

நாம் உருவாக்கும் இணையத்தளத்தில் மூன்று சுட்டிகளைச் சேர்த்திருந்தோம். மூன்றையும் ஒரு பட்டியலாகக் காட்ட வேண்டுமானால், இரண்டு வகைக் கொக்கிகள் இருக்கின்றன.

<வரிசை பட்டியல்> </வரிசை பட்டியல்> - <ol> </ol>
<வரிசையில்லா பட்டியல்> </வரிசையில்லா பட்டியல்) - <ul> </ul>

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

செய்ய வேண்டியது இவ்வளவுதான். நமது webpage1.html பக்கத்தில் போன பகுதியில் சேர்த்த <முறி> கொக்கிகளை நீக்கி விட்டு வரிசையான பட்டியல் கொக்கிகளைச் சேர்ப்போம்

<ol>
<li><a href="tamil-movies/webpage2.html"> தமிழ்ப் படங்கள் </a></li>
<li><a href="http://truetamilans.blogspot.com/">உண்மைத் தமிழனின் வலைப்பதிவு </a></li>
<li><a href="webpage3.html">என்னைப் பற்றி</a></li>
</ol>

மேலே சொன்ன வரிசை பட்டியல் கொக்கிகளை உருப்படிகள் பட்டியலுக்கு முன்னும் பின்னும் குறிப்பிட்டு விட்டு, ஒவ்வொரு உருப்படியையும் பிரித்துக் காட்ட <உருப்படி> </உருப்படி) என்ற கொக்கிகளைக் கொடுக்க வேண்டும். (<li> </li>)

கோப்பை சேமித்து பயர்பாக்சில் திறந்து பார்த்தால், தொடுப்புகள் இப்படிக் காட்டப்பட்டிருக்கும்.
  1. தமிழ்ப் படங்கள்

  2. உண்மைத் தமிழனின் வலைப்பதிவு

  3. என்னைப் பற்றி
1, 2, 3 என்று எண் கொடுத்து எழுதினால் முதலில் வருவது முதலிடம் பெற்றிருக்கிறது என்று பொருளாகி விடுமே! இப்படி எண் இல்லாமல் பட்டியல் போட வேண்டும் என்று நினைத்தால், <வரிசைப் பட்டியல்> கொக்கிகளுக்குப் பதிலாக, வரிசையற்ற பட்டியல் கொக்கிகளை மாற்றி விடுங்கள்.

<ul>
<li><a href="tamil-movies/webpage2.html"> தமிழ்ப் படங்கள் </a></li>
<li><a href="http://truetamilans.blogspot.com/">உண்மைத் தமிழனின் வலைப்பதிவு </a></li>
<li><a href="webpage3.html">என்னைப் பற்றி</a></li>
</ul>

பக்கத்தில் இப்படி தெரியும்.
இப்போ நம்ம புகைப்படத்தை அல்லது இன்னொரு படத்தை இந்தப் பக்கத்தில் சேர்க்கணும். அதற்கு <படம் /> என்று கொக்கி இருக்கிறது. படம் கொக்கியில் படக் கோப்பின் இருப்பிடத்தையும் பெயரை சுட்டிகளுக்காக நங்கூரம் கொக்கியில் கொடுத்தது போலக் கொடுத்தால் போதும்.

<படம் மூலக்கோப்பு="" />
<img src="http://img.photobucket.com/albums/v462/tamilsaran/DSC_0019.jpg" />

<a> கொக்கியில் hrefக்குக் கொடுத்தது போல இந்தப் படக் கோப்பு webpage1.html என்ற கோப்பு இருக்கும் அதே கணினியில் அதே அடைவில் அல்லது இன்னொரு அடைவில் இருக்கலாம், அல்லது இணைக்கப்பட்டுள்ள வேறு கணினிகளில் (இணையம் அல்லது அதற்கு நிகரான முறைமைகளின் மூலம் அணுக முடிகிற கணினிகள்) இருக்கலாம்.

மேலே சொன்ன வரியை webpage3.html என்ற பக்கத்தில் சேர்த்து விட்டால், என்னைப் பற்றி என்ற பக்கத்தில் இப்போது ஒரு புகைப்படமும் தெரியும்! so simple!

இந்த கொக்கிகளில் என்னென்ன இயல்புகளைச் சேர்க்கலாம் என்று பின்னொரு பகுதியில் பார்க்கலாம்.

கருத்துகள் இல்லை:

கருத்துரையிடுக