টিউনারপেজের “ছিন্নমূল কর্মসূচী” এক অনন্য মানবিকতা সুলভ দৃষ্টিভঙ্গির অনন্য স্বার্থক দৃষ্টান্ত । এই কাজে টিউনারপেজের সফলতা আশা করে আজকের টিউটোরিয়ালটি শুরু করছি ।আমার আগের টিউটোরিয়াল গুলো লিংক নিচে রয়েছে ,বুঝতে অসুবিধা হলে আগের লিংক গুলো দেখে নিন নতুবা মন্তব্য বাক্সে মন্তব্যের মাধ্যমে জানান ।আমার আজকের অলোচ্য বিষয় হল html-এর Table ট্যাগ ।
Table Tag:-
ওয়েবপেজের মধ্যে কোন ছক বা Table তৈরি করতে ব্যবহার হয় এই ট্যাগটি ।Table Tag-টি <tr> Tag-এর মাধ্যমে ছকের মধ্যে সারি(row) এবং <td> Tag-এর মাধ্যমে ছকের মধ্যে স্তম্ভ(Column or Cell) তৈরি করে । টেবিল ট্যাগটিতে কতগুলি বিশেষ Attributes-ও ব্যবহার করা যায় ।Attributes গুলি হল border,cellspacing,cellpadding ইত্যাদি ।
এর প্রাথমিক গঠন
| ইনপুট কোড | ব্রাউজারে আউটপুট | ||||||
|---|---|---|---|---|---|---|---|
| <table border=”2″> <tr><td>১ম সারি,১ম স্তম্ভ </td><td>১ম সারি,২য় স্তম্ভ </td><td>১ম সারি,৩য় স্তম্ভ </td></tr> <tr><td>২য় সারি,১ম স্তম্ভ </td><td>২য় সারি,২য় স্তম্ভ </td><td>২য় সারি,৩য় স্তম্ভ </td></tr> </table> |
|
border,cellspacing,cellpadding Attributes-গুলির মান হয় কোন একটি পূর্ণাঙ্গ গানিতিক মান ।border Attribute-টি ছকের বহিঃরেখা নির্দেশ করে ।cellspacing আর cellpadding Attribute-দুটি ছক-মধ্যস্হ লেখার মধ্যে ব্যবধান তৈরি করে ।এছাড়াও <td> tag-টির জন্য কিছু বিশেষ Attributes আছে ।যেমন rowspan,colspan । rowspan Attribute-টি সারিকে সংকুচিত করে আর colspan Attribute-টি স্তম্ভকে সংকুচিত করে ।ছকের মধ্যে কোন লেখাকে শিরোনাম হিসেবে ব্যবহার করার জন্য সেই সারির <td> গুলিকে <th> লিখতে হয় ।প্রসঙ্গত উল্লেখ্য যে tr-এর অর্থ Table Row, td-এর অর্থ Table Data, th-এর অর্থ Table Heading ।
যেমন
| ইনপুট কোড | ব্রাউজারে আউটপুট | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| <table border=”1″ cellspacing=”3″ cellpadding=”4″> <tr><th bgcolor=”red”>১ম স্তম্ভ</th><th>২য় স্তম্ভ</th><th>৩য় স্তম্ভ</th></tr> <tr><td rowspan=”2″>১ম সারি, ১ম স্তম্ভ</td><td>১ম সারি,২য় স্তম্ভ</td><td>১ম সারি, ৩য় স্তম্ভ</td></tr> <tr><td>২য় সারি,২য় স্তম্ভ</td><td>২য় সারি, ৩য় স্তম্ভ</td></tr> <tr bgcolor=”green”><td colspan=”3″> ৩য় সারি, ১ম স্তম্ভ</td></tr></table> |
|
|||||||||||
নিচের উদাহরণটি নিজে করার চেষ্টা করুন
 |
 |
 |
|
 |
আজ এ-পর্যন্তই ।ধন্যবাদন্তে 
ভাল থাকুন নিজে আর ভাল রাখুন অপরকে…।
পূর্ব আলোচনাসমূহ-
Html শেখার সহজ উপায় : অধ্যায় ১
Html শেখার সহজ উপায় : অধ্যায় ২
Html শেখার সহজ উপায় : অধ্যায় ৩
Html শেখার সহজ উপায় : অধ্যায় ৪
Html শেখার সহজ উপায় : অধ্যায় ৫
html শেখার সহজ উপায় : অধ্যায় ৬
ভাই খুবই ভালো করে সাজিয়ে লিখেন আপনি। পরে ভালো লাগল,২ঘন্টার মধ্যে আপনার ৬টা লেসন ভালো ভাবেই আয়ও করেছি। টেবল টাও সহজেই বুজলাম কিন্তু “cellpaddin” জিনিস টা কি মাথায় ঢুকতেছে না একটু eleborate করে বলবেন প্লিজ!
ভাই টিউন তা খুব এ ভালো লাগলো . আসা করি অল্প দিনে HTML শিখে jabo
আপনাকে অনেক অনেক ধন্যবাদ শেয়ার করার জন্য। ভাল থাকবেন।
আমি নিয়মিত অনুশীলন করতেছি।
আমি কয়েকবার শেখার চেষ্টা করেছি কিন্তু পারিনি তার একটাই কারন, আমি যতবারই শেখার চেষ্টা করেছি ততবারই পালিয়েছি। তবে আপনার উপস্থাপনা টা আমার ভাল লেঘেছে, এমন একজন টিচার পেলে মনে হয় পালাতে হতনা
সব golo tune-e chomotkar..
remi ke?????
আপনার এই টিউন থেকে অনেক কিছু শিখতে পারলাম… শেয়ার করার জন্ন আপনাকে ধন্নবাদ… (আমার কম্পিউটারে য-ফলা প্রোবলেম আছে)
the most important lesson in HTML.(table).
ধন্যব!দ।
আমি html শেখার দিকে পূর্ণ মনোনিবেশ করেছি, এতে আপনার টিউনগুলো অনেক উপকারে লাগছে, এজন্য আপনাকে অনেক অনেক ধন্যবাদ।
একটা সমস্যা হচ্ছে, ধরুন আমি কোন বাটনে/পিকচারে, লিংক তৈরী করবো (যেমন ডাউনলোড লিংক) তাহলে কোডিং টা কেমন হবে?
একি পাজে ওপেন করতে চাইলে ডাউনলোড লিঙ্ক !
eএখানে আপনি টিউনারপেজের যায়গায় আপনার ডাউনলোড লিঙ্ক দিন, যেমন
NUMB ডাউনলোড লিঙ্ক !
আর যদি ছবিতে লিঙ্ক করতে চান তাহলে এটা ব্যবহার করুন,
যেমন,
হায় হায় আমি তো ভুইলায় গেসিলাম যে এখানে html কোড শো করবে না এইভাবে :P নিচে দেখুন
একি পেজে ওপেন করতে চাইলে <a href=”http://www.tunerpage.com/”>ডাউনলোড লিঙ্ক !</a>
eএখানে আপনি টিউনারপেজের যায়গায় আপনার ডাউনলোড লিঙ্ক দিন, যেমন
<a href=”http://www.tunerpage.com/numb.mp3″>NUMB ডাউনলোড লিঙ্ক !</a>
আর যদি ছবিতে লিঙ্ক করতে চান তাহলে এটা ব্যবহার করুন,
<a href=”The URL of the site”><img src=”The URL of the image”></a>
যেমন,
<a href=”http://www.tunerpage.com”><img src=”http://a1.twimg.com/profile_images/1230726555/symbol_normal.png”></a>
অনেক উপকার করলেন রাসেল ভাই, আমার সাইটে কোন বাটন তৈরী করতে পারছিলাম না। অনেক কাজে লাগবে। ধন্যবাদ। ভালো থাকবেন
আপনাকেও ধন্যবাদ ! যে কোন প্রয়োজনে টিউনারপেজের সাথেই থাকুন (যেমনটা আমি থাকি :))
সাথেই থাকুন, সমস্যা হলে সাথে সাথে জানাবেন মতামত বিভাগে বা সাহায্য বিভাগে
আপনার সাথে আমি একমত।
খুব ভাল লাগল।ধন্যবাদ।
একমত।