Site icon Trickbd.com

আসুন HTML শিখি একদম শুরু থেকে । [পর্ব-3] By~RtRaselBD

Unnamed

আসসালামু আলাইকুম ।
প্রিয় ট্রিকবিডির বন্দুরা আপনারা সবাই কেমন আছেন। আশা করি আল্লাহর রহমতে সবাই ভালো আছেন। আর ট্রিকবিডির সাথে থাকলে সবাই ভালো থাকে । এটা সবাই জানে ।

আজ আমরা HTML এর ট্যাগ নিয়ে আলোচনা করবো ।

বিঃদ্রঃ ট্রিকবিডিতে কোড দেখা যায় না তাই পোষ্টের ভিতর কোড এ > এর পরিবর্তে ) এবং <এর পরিবর্তে ( দ্বারা দেওয়া হয়েছে ।

প্রথমে আমরা যেকোন একটা এইচটিএমএল ডকুমেন্ট দেখি সেখানে অবশ্যই ট্যাগ থাকে। যেমন নিচের ডকুমেন্ট টি দেখুন এখানে (html), (head), (/ head), (body) ইত্যাদি এক একটি শব্দকে ট্যাগ বলে। যেমন html শব্দটি এই দুই চিহ্ন দিয়ে মুড়িয়ে যখন HTML  ডকুমেন্টে লিখি তখন এটার নাম html ট্যাগ। এরুপ শত শত ট্যাগ আছে এইচটিএমএল এ। যেমন প্যারাগ্রাফ ট্যাগ (p) (/p), হেডিং (h1) (/ h1) ট্যাগ ইত্যাদি।

(!DOCTYPE html)(html)(head)(title)Html tips by Tipsjanbd(/title)(/head)(body)(h1)heading tag(/h1)(p)content(/p)(/body)(/html)

প্রায় সব ট্যাগেরই একটা সমাপ্তি ট্যাগ থাকে যেমন উপরে (html) ট্যাগটির সমাপ্তি ট্যাগ (closing tag বলা হয়) হচ্ছে (/html) আবার (h1) এর ক্লজিং ট্যাগ হল (/h1) এভাবে বাকি সবগুলি। টেকনিকাল শব্দ যেটা ব্যবহৃত হয় সেটা হচ্ছে শুরুর ট্যাগটিকে বলে opening tag বা start tag আর শেষের ট্যাগটিকে বলে closing tag  বা end tag. দুটোই একই শুধু ক্লজিং ট্যাগে একটা ব্যাকস্লাস (/) চিহ্ন বেশি থাকে।
এই ওপেনিং এবং ক্লজিং ট্যাগের ভিতর কনটেন্ট দিতে হয়।
যেমন উপরে দিয়েছি।
** এই ট্যাগই হচ্ছে এইচটিএমএল এর মুল জিনিস। শত শত ট্যাগ আছে, যত বেশি মনে রাখতে পারবেন ততই দ্রুত কাজ করতে পারবেন। তবে অনেকদিন ধরে কাজ করলে বেশিরভাগ প্রয়োজনীয় ট্যাগগুলি মুখস্থই থাকে। পরবর্তীতে ধীরে ধীরে সব ট্যাগ দেওয়া হবে ।
** কিছু কিছু ট্যাগ আছে এগুলির ক্লজিং ট্যাগ নেই যেমন ইনপুট ট্যাগ, ইমেজ ট্যাগ ইত্যাদি। এই ট্যাগগুলি সামান্য একটু ভিন্ন।
(img src="/rasel.jpg"/)<br /><br />
(input type="submit" value="save" /)<br /><br />

দেখুন ইমেজ ট্যাগ শুরু হয়েছে (img এভাবে আর শেষ হয়েছে /) এই চিহ্ন দিয়ে।
ইনপুট ট্যাগটিও তদ্রুপ। আর মাঝে যে জিনিসগুলি দেখছেন (src, type ইত্যাদি) এগুলি সংশ্লিষ্ট ট্যাগটির এট্রিবিউট।

**প্রত্যেকটি ট্যাগরই কাজ নির্দিষ্ট করা আছে যেমন আপনার এইচটিএমএল ডকুমেন্টে আপনি যদি প্যারাগ্রাফ দিতে চান তখন (p) (/p) ট্যাগের ভিতর তা দিতে হবে, হেডিং দিলে (h1) (/ h1) ট্যাগের ভিতর দিতে হবে (বড় ফন্টের হেডিং হলে (h1), সাইজ অনুযায়ী (h6) পর্যন্ত আছে)।
টেক্সট ফিল্ড দিতে হলে input ট্যাগ, ছবি দিতে চাইলে img ট্যাগ, ব্রাউজারের টাইটেল বার দেখানোর জন্য আছে (title) (/ title) ট্যাগ ।
* উপরে যে ডকুমেন্টটি দিয়েছি সেখানে (html)(/html) কে বলে প্যারেন্ট ট্যাগ পুরো ডকুমেন্ট টির জন্য কেননা পুরো ডকুমেন্টে যত ট্যাগ আছে সবগুলি এর ভিতরে রাখা হয়েছে। ভিতরের ব্যবহৃত ট্যাগগুলি হল এর চাইল্ড ট্যাগ। একইভাবে head ট্যাগের চাইল্ড ট্যাগ হল title ট্যাগ কিন্তু title ট্যাগের কোন চাইল্ড ট্যাগ নেই। আবার দেখুন body হল প্যারেন্ট ট্যাগ এবং এর চাইল্ড ট্যাগ এখানে (p) এবং  (h1)
তো আজ আর বেশি কিছু বলবো না ।
সবাইকে ধন্যবাদ ।

সকল প্রকার টিপস পেতে আমার সাইটে ভিজিট করুন ।
LikerBD.Top