এডভান্স ওয়েব ডিজাইন (ডিপলোমা ইন ওয়েব ডিজাইন) এইচটিএমএল এলিমেন্ট । (চিত্র সহ-৬)
এর আগে এইচটিএমএল ট্যাগ নিয়ে আলোচনা করলাম। একটা start tag (যেমন <div>) এবং end tag (যেমন </div>) এর মাঝে যা থাকে তা সহ পুরোটি একটা এলিমেন্ট। একটা এলিমেন্টের ভিতর ট্যাগের মতই এক বা একাধিক এলিমেন্ট থাকতে পারে বা থাকে (এটাকে nested এলিমেন্ট বলে)। নিচের উদাহরনটি দেখুন
01.<!DOCTYPE html>
02.<html>
03.<head>
04.
05.</head>
06.<body>
07.
08.<h1>Shobkeso demo heading</h1>
09.
10.<p>demo content goes here.</p>
11.
12.</body>
13.</html>
এখানে <html> </html> এর ভিতর যত কিছু আছে সব নিয়ে এটা একটা html এলিমেন্ট এরুপ body একটা এলিমেন্ট। একইভাবে বাকিগুলিও এক একটি এলিমেন্ট।
এলিমেন্টের ভিতর এলিমেন্ট থাকতে পারে আবার যেমন <h1></h1> এর ভিতর কোন এলিমেন্ট নেই, যে লেখাটি আছে সেটি হচ্ছে এর কনটেন্ট। তাই <h1></h1> এর ভিতরের লেখাটিসহ এটা h1 এলিমেন্ট।
আপনি কোডটি নিয়ে নোটপেট বা এখানে ক্লিক করে দেখে নিতে পারেন ।তবে নোটপেট এ save করার সময় anyname.html অথাত .html ফরমেট এ সেভ করবেন। অনলাইনে এখানে টেস্ট করুন
এই উহরনটিতে মোট ৫টি এলিমেন্ট আছে html এলিমেন্ট, head এলিমেন্ট, body, h1 এবং p এলিমেন্ট।
* ট্যাগের মত এখানে html এলিমেন্টের চাইল্ড এলিমেন্ট হচ্ছে বাকি সবগুলি এলিমেন্ট। আবার body হচ্ছে প্যারেন্ট এবং এর চাইল্ড হচ্ছে h1 ও p এলিমেন্ট। যে এলিমেন্টের ভিতর অন্য এলিমেন্ট থাকে সেটা হচ্ছে প্যারেন্ট এবং ভিতরের গুলি চাইল্ড এলিমেন্ট।
* মনে রাখবেন html ট্যাগ শুরু করেবেন ইংরেজী ছোট হাতের অক্ষর দিয়ে শেষ করবেন ছোট হাতের অক্ষর দিয়ে । উদাহরণ: <body>Your type here</body>
** মনে রাখবেন আমরা যত এলিমেন্ট ই লিখি না সব কেন body এলিমেন্টের ভিতরই লিখতে হবে, বাকি এলিমেন্ট যেমন head ইত্যাদির ভিতর শুধু নির্দিষ্ট কিছু এলিমেন্ট লেখা যায়। ব্রাউজারে শুধু ঐটুকুরই আউটপুট আসে যেটা body এলিমেন্টের ভিতর থাকে।
এলিমেন্ট প্রকার?
ব্লক লেভেল এবং ইনলাইন এলিমেন্ট
দুই ধরনের এলিমেন্ট আছে
ব্লকলেভেল এলিমেন্ট : যে এলিমেন্টগুলি বাই ডিফল্ট তার ডানে বামে পুরো জায়গা দখল করে থাকে সেগুলিকে ব্লক লেভেল এলিমেন্ট বলে। অন্যভাবে বলা যায় যে, যে এলিমেন্টগুলি শুরু হয় নতুন লাইনে (যখন ব্রাউজারে প্রদর্শন করবে) সেগুলি ব্লক লেভেল এলিমেন্ট।
div, p, h1, ul, li ইত্যাদি ব্লকলেভেল এলিমেন্ট।
ইনলাইন এলিমেন্ট : যে এলিমেন্টগুলির কারনে নতুন লাইন শুরু হয়না সেগুলি ইনলাইন এলিমেন্ট।
a, i, b, span, strong ইত্যাদি ইনলাইন এলিমেন্ট।
view source
print?
01.<!DOCTYPE html>
02.<html>
03.<head>
04.
05.</head>
06.<body>
07.
08.<h1>I am a block level element</h1>
09.
10.<p>I am block level element too</p>
11.
12.<strong>Yes, I am inline element</strong>
13.<a href="http://www.shobkeso.com">"a" This is a inline element </a>
14.
15.</body>
16.</html>
যদি আমাদের এই সাইটি আপনার ভাল লাগে তাহলে এখানে লাইক দিতে ভুলবেন না । আপনার লাইক এই সাইট টি মূল প্রেরণা আপনারা লাইক করলে সাইটি আরও ভাল ভাবে কাজ করতে আমাদের অনুপ্রেরণা আসবে www.facebook.com/shobkeso
এর আগে এইচটিএমএল ট্যাগ নিয়ে আলোচনা করলাম। একটা start tag (যেমন <div>) এবং end tag (যেমন </div>) এর মাঝে যা থাকে তা সহ পুরোটি একটা এলিমেন্ট। একটা এলিমেন্টের ভিতর ট্যাগের মতই এক বা একাধিক এলিমেন্ট থাকতে পারে বা থাকে (এটাকে nested এলিমেন্ট বলে)। নিচের উদাহরনটি দেখুন
01.<!DOCTYPE html>
02.<html>
03.<head>
04.
05.</head>
06.<body>
07.
08.<h1>Shobkeso demo heading</h1>
09.
10.<p>demo content goes here.</p>
11.
12.</body>
13.</html>
এখানে <html> </html> এর ভিতর যত কিছু আছে সব নিয়ে এটা একটা html এলিমেন্ট এরুপ body একটা এলিমেন্ট। একইভাবে বাকিগুলিও এক একটি এলিমেন্ট।
এলিমেন্টের ভিতর এলিমেন্ট থাকতে পারে আবার যেমন <h1></h1> এর ভিতর কোন এলিমেন্ট নেই, যে লেখাটি আছে সেটি হচ্ছে এর কনটেন্ট। তাই <h1></h1> এর ভিতরের লেখাটিসহ এটা h1 এলিমেন্ট।
আপনি কোডটি নিয়ে নোটপেট বা এখানে ক্লিক করে দেখে নিতে পারেন ।তবে নোটপেট এ save করার সময় anyname.html অথাত .html ফরমেট এ সেভ করবেন। অনলাইনে এখানে টেস্ট করুন
এই উহরনটিতে মোট ৫টি এলিমেন্ট আছে html এলিমেন্ট, head এলিমেন্ট, body, h1 এবং p এলিমেন্ট।
* ট্যাগের মত এখানে html এলিমেন্টের চাইল্ড এলিমেন্ট হচ্ছে বাকি সবগুলি এলিমেন্ট। আবার body হচ্ছে প্যারেন্ট এবং এর চাইল্ড হচ্ছে h1 ও p এলিমেন্ট। যে এলিমেন্টের ভিতর অন্য এলিমেন্ট থাকে সেটা হচ্ছে প্যারেন্ট এবং ভিতরের গুলি চাইল্ড এলিমেন্ট।
* মনে রাখবেন html ট্যাগ শুরু করেবেন ইংরেজী ছোট হাতের অক্ষর দিয়ে শেষ করবেন ছোট হাতের অক্ষর দিয়ে । উদাহরণ: <body>Your type here</body>
** মনে রাখবেন আমরা যত এলিমেন্ট ই লিখি না সব কেন body এলিমেন্টের ভিতরই লিখতে হবে, বাকি এলিমেন্ট যেমন head ইত্যাদির ভিতর শুধু নির্দিষ্ট কিছু এলিমেন্ট লেখা যায়। ব্রাউজারে শুধু ঐটুকুরই আউটপুট আসে যেটা body এলিমেন্টের ভিতর থাকে।
এলিমেন্ট প্রকার?
ব্লক লেভেল এবং ইনলাইন এলিমেন্ট
দুই ধরনের এলিমেন্ট আছে
ব্লকলেভেল এলিমেন্ট : যে এলিমেন্টগুলি বাই ডিফল্ট তার ডানে বামে পুরো জায়গা দখল করে থাকে সেগুলিকে ব্লক লেভেল এলিমেন্ট বলে। অন্যভাবে বলা যায় যে, যে এলিমেন্টগুলি শুরু হয় নতুন লাইনে (যখন ব্রাউজারে প্রদর্শন করবে) সেগুলি ব্লক লেভেল এলিমেন্ট।
div, p, h1, ul, li ইত্যাদি ব্লকলেভেল এলিমেন্ট।
ইনলাইন এলিমেন্ট : যে এলিমেন্টগুলির কারনে নতুন লাইন শুরু হয়না সেগুলি ইনলাইন এলিমেন্ট।
a, i, b, span, strong ইত্যাদি ইনলাইন এলিমেন্ট।
view source
print?
01.<!DOCTYPE html>
02.<html>
03.<head>
04.
05.</head>
06.<body>
07.
08.<h1>I am a block level element</h1>
09.
10.<p>I am block level element too</p>
11.
12.<strong>Yes, I am inline element</strong>
13.<a href="http://www.shobkeso.com">"a" This is a inline element </a>
14.
15.</body>
16.</html>
যদি আমাদের এই সাইটি আপনার ভাল লাগে তাহলে এখানে লাইক দিতে ভুলবেন না । আপনার লাইক এই সাইট টি মূল প্রেরণা আপনারা লাইক করলে সাইটি আরও ভাল ভাবে কাজ করতে আমাদের অনুপ্রেরণা আসবে www.facebook.com/shobkeso
+Copyright+%C2%A9+2011.JPG)
0 আপনার মতামত:
Post a Comment
আপনার যদি ভাল লাগে তাহলে আমরা খুশি হব। আমাদের অনুপ্রেরণা জানাতে কমেন্ট করুন আমাদের কে । আমরা আপনাকে আরও ভাল পোস্ট দেওয়ার চেষ্ঠা করব।
ভাই আমি যে বিষয় গুলো জানি তা পোস্ট করি ।
(বি:দ্র: যদি মনে হয় আমি এই বিষয় টি কপি করেছি তাহলে হ্যা কপি করেছি । কারণ আমি বিষয় টি সম্পর্কে কিছু জানি আর অন্য কে জানাতে পারি আরও সহজ ভাবে লিখি। ভাই অংক দুই ভাবে করা যায় একটি হচ্ছে সহজে আর একটি নিয়ম হচ্ছে কঠিন নিয়ম। আমি সহজ এবং সঠিক নিয়মে যদি কোন বিষয় প্রকাশ করি তাহলে ত হল। এতে করে যে লোক গুলো ভাল ভাবে কম্পিউটার জানে না তারা জানতে পারবে। আপনি কী চান না আমাদের দেশের সকল লোক কম্পিউটার সম্পর্কে জানুক? বি:দ্র টি লেখলাম য়ারা কম্পিউটার সম্পকে ভালে বা বেশি জানেন তাদের জন্য )