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

কেমন আছেন সবাই।আশা করি সবাই ভাল আছেন।

আজকে আমি আপনাদের সাথে html এর একটি বেসিক জিনিষ নিয়ে আলোচোনা করব।সাথে থাকুন।

আজকে আমি font সংক্রান্ত বিভিন্ন ট্যাগ নিয়ে আলোচোনা করব।মানে font এর আকার,আকৃতি,ধরন এসবের নানা ট্যাগ নিয়ে আলোচোনা করব।

bold ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে আপনার লাইন এর অক্ষরগুলো গাঢ় দেখাবে।এই ট্যাগ এর  নিয়ম হচ্ছে <b>……………………………….</b>

italic ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে লাইন এর অক্ষরগুলো একটু বাকা দেখাবে।এই ট্যাগ এর নিয়ম হচ্ছে <i>................................</i>

blink ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে আপনার লাইন এর অক্ষরগুলো জলা-নেভা করবে।এই ট্যাগ ব্যাবহার করার নিয়ম হচ্ছে <blink>………………..</blink>

emphasis ট্যাগঃ

ধরুন আপনি একটা লাইন এর অক্ষরগুলো ইতালিক বাকা অক্ষরে লিখবেন,কিন্তু গাঢ় তখন আপনাকে emphasis ট্যাগ ব্যাবহার করতে হবে।এই ট্যাগ ব্যাবহার করার নিয়ম হচ্ছে <em>…………………</em>

strong ট্যাগঃ

অনেকে একটা লাইন এর অক্ষরগুলো গাঢ় করার জন্য bolt ট্যাগ এর বদলে strong ট্যাগ ব্যাবহার করে।এই ট্যাগ এর নিয়ম হচ্ছে <strong>……………………</strong>

underline ট্যাগঃ

এই ট্যাগ ব্যাবহার করে কোন লেখার নিচে দাগ দেওয়া হয়।এই ট্যাগ এর নিয়ম হচ্ছে <u>………………..</u>

strike ট্যাগঃ

এই ট্যাগ এর ব্যাবহার underline ট্যাগ এর মত।লেখার নিচে দাগ দেওয়ার জন্য এই ট্যাগ ব্যাবহার করা হয়।এই ট্যাগ এর নিয়ম হচ্ছে <strike>………………</strike>

big ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে লাইনটির অক্ষরগুলো বড় দেখাবে। এই ট্যাগ এর নিয়ম হচ্ছে <big>……………………..</big>

small ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে একটা লাইন এর অক্ষরগুলো ছোট দেখায়। এই ট্যাগ এর নিয়ম হচ্ছে <small>……………..</small>

type writer ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে ওই লাইন এর অক্ষরগুলো আগেরকার আমলের টাইপ রাইটার মেশিন এর অক্ষরের মত দেখাবে। এই ট্যাগ এর নিয়ম হচ্ছে <tt>………………..</tt>

subscript ট্যাগঃ

একটি লাইন এর কোন অক্ষরকে বা কোন অংশকে একঘর নিচে নামানোর দরকার হয় তখন এই ট্যাগ ব্যাবহার করা হয়। এই ট্যাগ এর নিয়ম হচ্ছে <sub>………………</sub>

superscript ট্যাগঃ

একটি লাইন এর কোন অক্ষরকে বা কোন অংশকে একঘর উপরে উঠানোর দরকার হয় তখন এই ট্যাগ ব্যাবহার করা হয়। এই ট্যাগ এর নিয়ম হচ্ছে <sup>………….</sup>

এতোক্ষন আমরা দেখলাম কিভাবে এই ট্যাগগুলো ব্যাবহার করা যায়।এবার আমরা দেখব এর বাস্তব প্রয়োগ।উপরের ট্যাগ গুলো ব্যাবহার করে আসুন একটা কোডিং তৈরি করি।


<html>

<head>

<title>

We love techtunes

</title>

</head>

<body>

<b>we love techtunes</b><br>

<i> we love techtunes</i><br>

<blink> we love techtunes</blink><br>

<em> we love techtunes</em><br>

<strong> we love techtunes</strong><br>

<strike> we love techtunes</strike><br>

<u> we love techtunes</u><br>

<big> we love techtunes</big><br>

<small> we love techtunes</small><br>

<tt> we love techtunes</tt><br>

This is water H<sub>2</sub>O <br>

This is mathematical term  A<sup>2</sup>+B<sup>2</sup>

</body>

</html>

***তারপর তা rea.html নামে সেভ করে double click করে ওপেন করুন।দেখুন কেমন দেখা যাচ্ছে।

যদি কোন কিছু না বুঝে থাকেন তবে আমাকে জানান।সবাই ভাল থাকবেন।

Level 0

আমি সাবিহা। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 13 বছর 8 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 98 টি টিউন ও 753 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 3 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।

খুব সাধারন একটি মানুষ।সারাদিন কম্পিউটার নিয়ে পড়ে থাকি।মুভি দেখি,ব্লগ এ ব্লগ এ ঘুরাঘুরি করি।পড়ালেখা করতে বরাবরই ভয় লাগে। আর ফেসবুক এ একটা পেজ খুলেছি।যারা সময় পাবেন একটু ঢু মেরে আসবেন।


টিউনস


আরও টিউনস


টিউনারের আরও টিউনস


টিউমেন্টস

নতুন কিছু ট্যাগ জানলাম। ধন্যবাদ

প্রথম পৃষ্ঠায় একসাথে ৩টি টিউটোরিয়াল দেখে খুশির পাশাপাশি পোস্টে ঢুকে আশাহত হলাম।এই জিনিষগুলো রকিবুল ভাই পাশেই শেখাচ্ছেন।এভাবে হুড়হুড়ি করে ছোট ছোট টিউটোরিয়াল লিখলে মানসম্পন্ন হয় না।আস্তে আস্তে ভেবে সময় নিয়ে বড় করে লিখুন তাতে ভিজিটরদেরও আগ্রহ থাকে।আর ট্যাগগুলোর উদাহরন স্ক্রিনশটে না দিয়ে এখানেই দিতে পারেন যেহেতু নরম্যাল এইচটিএমএল টিটিতে সাপোর্ট করে।পোস্টের অভ্যন্তরে হেডলাইন,এলাইনমেন্ট,ইমেজ এগুলো সুন্দরভাবে করা উচিত যাতে টিউটোরিয়ালটি আকর্ষনীয় হয়।বেশী বেশী পোস্ট করে টপটিউনার হওয়াতে কোন সার্থকতা নেই।প্রথম পৃষ্ঠায় একসাথে ৩টি টিউটোরিয়াল দেখে খুসির পাশাপাশি আশাহত হলাম।[ যেমন, এই টিউটোরিয়ালগুলো দেখুন কত সুন্দর করে লেখক লিখেছেনঃ http://www.somewhereinblog.net/blog/the_uncertain/29271737 ] আশাকরি কমেন্টের মর্মার্থ বুঝতে পেরেছেন।আপনি পরিচিত প্রিয় মানুষ তাই বললাম।মাইন্ড খাইয়েন না। 😀

    আপনার প্রতিটি প্রশ্নের উত্তর আমি যেদিন আমি html এর লাস্ট টিউন করব সেদিন দিব।ততদিন একটু অপেক্ষা করুন।
    আজকে শুধু আপনাকে কয়েকটা কথা বলব।বাস্তব কথা।আপনাকে লাইক করি বলে এই কথাগুলো বলছি।অন্যভাবে নিবেন না।
    একটু আগে আপনি আমাকে একটা কথা বলেছেন যে “””বেশী বেশী পোস্ট করে টপটিউনার হওয়াতে কোন সার্থকতা নেই ।“”” টিটি কে বড় ভালবাসি তাই যদি কম্পিউটার এর একটা নতুন জিনিষ জানতে পারি,তা এখানে শেয়ার করি।
    আপনাকে বলি প্রতিটা জিনিষ এর শুরু হয় বেসিক থেকে।প্রথমেই যদি আপনি কঠিন জিনিষ শুরু করেন,তাহলে তা কেউ বুঝবে না,যদি তার আগে না জানা থাকে।আমি ব্যাক্তিগতভাবে একটা কথা মানি যে কাউকে যদি বেসিক থেকে ভালভাবে গড়ে তোলা হয়,তবে সে পরবর্তীতে যত কঠিন ধাপেই যাক না কেন সে পারবে।আর এক একটা নতুন বিষয় এক একটা টিউন এ আলোচোনা করাই ভালো।তাতে যারা নতুন শিখছে তাদের কাছে সহজ লাগবে।আমি আমার টিউনগুলো যারা সবকিছু পারে তাদের জন্য করি নাই,যারা আমার মত কম পারে তাদের জন্য করেছি।
    ***আমি এই টিউন এ সাধারন যতগুলো ট্যাগ জানি তা আলোচোনা করেছি,আগের টিউন এ কিভাবে heading ট্যাগ ইউস করতে হয়,আর কিভাবে তা ছোট বড় করতে হয় তা দেখিয়েছি।এভাবে যত আগে যাবেন তত সহজ জিনিষ পাবেন।
    ***আর আপনি বললেন পাশেই রকিবুল ভাই শেখাচ্ছেন।আমি সবসমই মানি উনি খুব ভাল একজন টিউনার।উনার মত টিউনার আমি কখনই হতে পারব না।কিন্তু আপনি কি দেখেছেন উনি html বিষয়ে লাস্ট টিউন কবে করেছে।উনি লাস্ট টিউন করেছেন মানে html এর 6th পার্ট লিখেছেন জানুয়ারী মাসে।এর পর আরো ৭ মাস কেটে গেছে উনি html এর উপরে আর টিউন করেন নাই।এভাবে যদি অপেক্ষা করতে হয় তাতে মানুষের html শিখতে আরো ৩-৪ বছর লাগবে।
    ***আর আমাকে এক মাস সময় দিন,১ মাস চেয়েছি বেশি না,আমি html এর যা জানি তা এখানে শেয়ার করব।
    ***আর আমি জানি কিভাবে ওয়াদা রাখতে হয়।আমি powerpoint শুরু করে শেষ করেছি।word এর ৭০ ভাগ শেষ করেছি।varsity খোলার ১ মাসের মধ্যে word শেষ করব।html ও ১ মাসের মধ্যে শেষ করব।
    just wait and see………………………………………..

Level 0

আপু মানুষ যাই যা বলুক কান দিয়েন না। আপনি চালিয়ে যান। অনেক সুন্দর হচ্ছে। ভাল কাজের নিন্দুক থাকবেই

যেভাবে চালিয়ে যাচ্ছেন সেইভাবে চালিয়ে যান।আজকের টিউন ভালো লাগছে :)।চালিয়ে যান।

আপু আমি বাস্ততার জন্য অনেক দিন পর টিটি আসলাম,আপনার টিউন দেখে খুব ভাল লাগলো,আমার HTML শেখার খুব শক ছিল,তবে আপু আপনি যদি এর কাজ গুলা আলাদা ভাবে বললে আমার জন্য একটু হত…।।

আপু আমি বাস্ততার জন্য অনেক দিন পর টিটি আসলাম,আপনার টিউন দেখে খুব ভাল লাগলো,আমার HTML শেখার খুব শক ছিল,তবে আপু আপনি যদি এর কাজ গুলা আলাদা ভাবে বললে আমার জন্য একটু ভালো হত…।।

আপনি কমেন্ট বুঝতে পারেন নি।আপনার সুবিধার জন্যই বলেছিলাম।কি আর করা।রকিবুল ভাইয়ের উদাহরন অন্য কারণে দিয়েছি।

Level 0

Thanks

আমার এক স্যার আছে, সবসময় বলেন ” অল্প অল্প পড়া, বেশী বেশী শিখা”
উনি ক্লাশে সবসময় কম পড়া দিতেন, আর কম দিত বলে ৯০% স্টুডেন্টই উনার পড়া শিখে আসত। আমি আসলে বলতে চাইতেছি আপনি যেভাবে চালিয়ে যাইতেছেন সেভাবেই যান। কম কম বলে শিখে মজা পাচ্ছি।

Level 0

Carry on………

হা হা এইভাবে খুটিনাটি লিখলে শিখার মজাই আলাদা। তবে একটা ব্যাপারে নাঈম ভাইয়ের সাথে একমত যে কিছু কিছু কোডের উদাহারন আপনি চাইলে টিউনেই দিয়ে দিতে পারেন। যেমন we love techtunes এটার আসল মজা ছবিতে নষ্ট হয়ে গেছে। 😛 লিখতে থাকুন। সাথেই আছি।

    we love techtunes এর কথা বলতে চেয়েছি। 😉

      we love techtunesআশ্চর্য এর আগের কমেন্টে আমি আসল কোডটি দেয় নাই। এরপরও গায়েব হয়ে গেল। কিছুই বুজলাম না। 🙁

এবারো গায়েব হা হা। আমরা টেকটিউনসকে ভালবাসি দেখা যাক এইবার কি হয় 😛

টেকটিউনস

    @মিনহাজুল হক শাওন: অনেক অনেক অনেক ধন্যবাদ শাওন ভাই, আমি নোটপ্যাডের কথা বলি নাই, এই খানে টিউমেন্ট করার ব্যাপারে বলেছি। এবং আপনার টিউমেন্ট দেখার পরই আমার সমস্যা দূর হল।

     আবারো ধন্যবাদ। 

    😀

আপনি যেভাবে শিখাচ্ছেন, সেই ভাবেই শিখান ভাল হচ্ছে। blink ট্যাগঃ

এই ট্যাগ ব্যাবহার করলে আপনার লাইন এর অক্ষরগুলো জলা-নেভা করবে।এই ট্যাগ ব্যাবহার করার নিয়ম হচ্ছে ……………….. এটা কাজ করতেছে না কেন ?

নাঈম ভাই এটা কি হল!!!!!!! (১২৯)

Level 0

@নিশাচর নাইম…. ভাই আমরা কম বুঝি তাই এভাবেই শিখতে চাই। আপনার মত বেশি বুঝি না,আমাদের জন্য এটাই উপযোগী ।
@সবিহা আপু আমি SEO জানি কিন্তু HTML ছাড়া পূর্ণতা পাচ্ছিল ।আপনার পোষ্ট গুলো থেকে HTML শিখতেছি ।ধন্যবাদ

italic এবং emphasis এর মধ্যে পার্থক্য কি??????

Level 0

dot.

Level 0

786

চমৎকার টিউন

আজকেরটা একটু কঠিন লাগল। তবে, টেকটিউন থেকে অনেক কিছু শিখতে পারছি।

আজকেরটা একটু কঠিন লাগল। তবে, টেকটিউনস থেকে অনেক কিছু শিখতে পারছি।

Level 0

Thanks.

Level 0

আপু আমার অনেক ইচ্ছা ছিল এইচটিএমএল শিখার !!!!!!!!!!!
but ভাল কিছু পাচ্ছিলাম না …।
i hope aupner ai tune theke অনেক কিছু learn korte parbo!!!!!!!!!!!
dowa korben plzzz

thank you apuni