Search This Blog

Thursday, September 22, 2011

আসুন শিখি HTML [পর্ব-৬]


আজকে থেকে আমরা আস্তে আস্তে একটু কঠিন এর দিকে যাব।প্রতিদিন অনুশীলন করুন,দেখবেন এইসব কোডিং- ফোডিং  পানির মতন সহজ লাগবে।তো চলুন শুরু করে দেওয়া যাক
***আজকে আমরা আলোচোনা করব heading element নিয়ে
***প্রথমে আপনাদের মাথায় আসতে পারে heading element কী?
***ধরুন আপনি একটি paragraph লিখছেন।এখন এই পারাগ্রাফ এর শিরোনাম দিতে হবে।তারপর paragraph এর বিষয়বস্তু।আজকে আমরা শিখব কিভাবে এই শিরোনাম দিতে হয়
***এই শিরোনাম দিতে যে ট্যাগ ব্যাবহার হরা হয় তা হচ্ছে <h1>…………………</h1>  ট্যাগ।তো আসুন দেখি কিভাবে এই ট্যাগ ব্যাবহার করা যায়
***এই ট্যাগ ব্যাবহার করা খুবই simple.আপনি যেই লাইনকে শিরোনাম বানাতে চান,সেই লাইন এর শুরুতে <h1>  আর লাইন এর শেষে </h1>  অ্যাড করুন। আসুন এবার এই নিয়ম অনুসারে একটি কোডিং করি
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>

<head>

<title>

আমরাও পারি

</title>

</head>

<body>

<h1>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h1>

<p>আমাদের ছোট দেশটির নাম বাংলাদেশ।এই বাংলার আনাচে কানাচে ছড়িয়ে ছিটিয়ে আছে কিছু উদ্দমি মানুষ।যারা দেশকে ভালবাসে নিজের জীবনের থেকেও বেশী।তারা দেশের জন্য কিছু করে সবার কাছে বলে বেড়ায়  না যে আমি দেশের জন্য এই কাজটা করেছি।তাদের এই অবদান শুধু দেশ জানে আর সে নিযে জানে।এরাই হল সত্তিকারের মানুষ।মানুষের মত মানুষ।আর কিছু মানুষ আছে যেমন আমাদের রাজনীতির রুই-কাতলারা,তারা দেশের জন্য কত কিছু করছে!!!!!!দেশের উন্নয়নের চিন্তায় তাদের নাকি ঘুম আসে না।এই সব রুই কাতলাদের যখন সত্যিকারের মানুষের পাশে দাড়া করাবেন তখন আপনারই অপমান লাগবে যে আপনি ফেরেশতাদের সাথে নরকের কীটকে দাড়া করিয়েছেন।</p>

</body>

</title>
***এখানে <h1>............</h1> দিয়ে heading আর <p>...........</p> দিয়ে paragraph indicate করেছে
***এবার এটিকে নোটপ্যাড লিখে সেভ করে double click করে ওপেন করুন



***এতক্ষন আমারা শিখলাম কিভাবে heading দেওয়া যায়।এবার আমরা শিখব heading এর নানা রুপ নিয়ে
***এই লেখাটি মন দিয়ে পড়ুন।কারন পরবর্তীতে অনেক টিউন এটার ব্যাবহার রয়েছে
আমরা যে heading নিয়ে আলোচোনা করেছি তার ৬টি রুপ আছে।আসুন দেখি সেগুলো কি কি?
  1. <h1>............</h1>
  2. <h2>............</h2>
  3. <h3>............</h3>
  4. <h4>............</h4>
  5. <h5>............</h5>
  6. <h6>............</h6>
***আপনাদের মনে প্রশ্ন আস্তে পারে h1,h2,h3,h4,h5,h6 কেন??এবার আসুন এই বিষইয়ে একটু কথা বলি
***খুবই সহজ ব্যাপার। h1 হতে ক্রমানুসারে যত নিচের দিকে নামতে থাকবে heading তত ছোট হতে থাকবে।মানে <h1>........</h1>  হতে <h2>.......</h2> এর heading ছোট। আর <h6>.......</h6> এর heading সবছেয়ে ছোট
***তাহলে আসুন এবার বাস্তব উদাহরন দেখি।আপ্নারা আমার সাথে এই কোডিংটুকু লিখুন
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>

<head>

<title>

আমরাও পারি

</title>

</head>

<body>

<h1>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h1>

<h2>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h2>

<h3>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h3>

<h4>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h4>

<h5>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h5>

<h6>আমরাই পারি এই দেশের প্রতিটি মানুষের মুখে হাসি ফুটাতে।</h6>

</body>

</title>
***আমাদের কোডিং লেখা শেষ।এবার এটাকে aya.html নামে সেভ করে double click করে ওপেন করুন



সবাই ভাল থাকবেন
লেখকঃ সাবিহা
সুত্রঃ টেকটিউনস

No comments:

Post a Comment