এইচটিএমএল মার্কআপ ল্যাংগুয়েজ লেখার সময় বিভিন্ন ধরনের ফর্মেশন দরকার হয় | বিভিন্ন স্টাইলে এইচটিএমএল ল্যাংগুয়েজ এর মধ্যে ওয়েব পেজের কনটেন্ট গুলো কে সাজিয়ে নেওয়ার জন্য ফরমেটিং এলিমেন্ট ব্যবহার করা হয় |
আজকের এই চ্যাপ্টার থেকে আমরা এইচটিএমএল ফরমেটিং এলিমেন্ট সম্পর্কে বিস্তারিত ভাবে জানবো |
আজকের এই চ্যাপ্টার থেকে আপনি যা যা জানতে পারবেন –
- এইচটিএমএল ফরমেটিং এলিমেন্ট কি
- এইচটিএমএল এ কতগুলো ফরমেটিং এলিমেন্ট রয়েছে তার লিস্ট
- ফরমেটিং এলিমেন্ট এর ব্যবহার উদাহরণসহ
- ফরমেটিং এলিমেন্ট এর ব্যবহারের প্রয়োজনীয়তা
তাহলে চলুন উপরের বিষয়গুলো কে আমরা দেখেনি-
এইচটিএমএল ফরমেট এলিমেন্ট কি ?
এইচটিএমএল ল্যাঙ্গুয়েজ এর মাধ্যমে ওয়েব পেজকে সুন্দরভাবে ফরমেটিং করার জন্য যে ট্যাগ গুলো ব্যবহার করা হয় সেটি হচ্ছে এইচটিএমএল ফরমিটিং ট্যাগ | আর এই ট্যাগের মাধ্যমে বিভিন্ন ধরনের কনটেন্ট দিয়ে যেসব কাজ ডিজাইন করা হয় সেটা হচ্ছে এইচটিএমএল ফরমেটিং এলেমেন্ট |
যেমন, যদি লেখার মধ্য আমরা কোন লেখাকে বড় করে দেখাতে চাই তাহলে এইচটিএমএল ফরমেটিং Bold (b) এলিমেন্ট ব্যবহার করা হয় |
এইচটিএমএল মার্কআপ ল্যাংগুয়েজ কতগুলো ফরমেটিং এলিমেন্ট রয়েছে তার লিস্ট
- <b> This is Bold text </b>
- <I> This is italic text </i>
- <u> This is underline text</u>
- <del> This is deleted text</del>
- <em> This is emphasized text <em>
- <sub> This is subscript text</sub>
- <sup> This is superscript text</sup>
- <mark> This is mark/highlight text</mark>
- <strong> This is Important text </strong>
- <small> This is Smaller text <small>
- <pre> This is Pre text </pre>
উপরের লিস্টের প্রতিটি হচ্ছে ফরমেটিং এলিমেন্ট | চলুন তাহলে আমরাই ফরমেটিং এলিমেন্ট এর ব্যবহার গুলো জেনে নি |
এইচটিএমএল ফরমেটিং এলিমেন্ট এর ব্যবহার
এইচটিএমএল ল্যাঙ্গুয়েজ এর মাধ্যমে যখন ওয়েব পেজ তৈরি করা হয় সেই ওয়েবপেজকে সাজানোর জন্য বিভিন্ন ধরনের ফরমেটিং এলেমেন্ট ব্যবহার করা হয় |
এখানে আমরা সবথেকে বেশি ব্যবহৃত ফরম্যাট ব্যবহার সম্পর্কে বিস্তারিতভাবে জানব |
- Bold Element – সাধারণত <B> ট্যাগ এর মাধ্যমে কোন ওয়েব পেজে নির্দিষ্ট কোন কনটেন্টকে বোল্ড করা হয় | যদি আমি একটি উদাহরণের মাধ্যমে দেখি তাহলে যেভাবেই Bold লেখার মধ্য করবে –
<b> This is a bold text </b>
সাধারণত এভাবেই লেখাকে ওয়েব পেজে বোর্ড আকারে প্রিন্ট করা হয় |
- Italic Text – ওয়েব পেজের মধ্যে কোন লেখাকে ইটালিক বা হালকা করার জন্য ইটালিক ট্যাগ ব্যবহার করা হয় |
<i> This is a Italic text </i>
এই ফরমেট ফলো করে যেকোনো টেক্সটকে আপনারা ইটালিক করতে পারেন |
- Underline text – কোন নিচে আন্ডারলাইন করার জন্য আন্ডারলাইন এলেমেন্ট ব্যবহার করা হয় |
<u> This is underline text </u>
- Deleted text – কোন লেখাকে ডিলিট করার জন্য ডেল্টা ইউজ করা হয় |
<del> This is a deleted text </del>
- Emphasized text – ইটালিক থেকে একটু বেশি বাঁকা করতে এবং লেখাকে জোর প্রদান করার ক্ষেত্রে ব্যবহার করা হয় |
<em> This is emphasized text </em>
- Subscription Text– কোন লেখাকে সাবস্ক্রিপশন বা উপরে তোলার জন্য এই ট্যাগ ব্যবহার করা হয় |
<sub> This is a Subscription text </sub>
- Superscription Text – কোন লেখাকে সুপেরস্ক্রিপশন বা নিচে লেখার জন্য এই ট্যাগ ব্যবহার করা হয় |
<sup> This is a Superscription text </sup>
- Mark text – কোন লেখাকে মার্ক বা হাইলাইট করে প্রদর্শন করার ক্ষেত্রে মার্ক ট্যাগ ব্যবহার করা হয় |
<mark> this is mark text </mark>
- Strong Text – কোন ইম্পর্টেন্ট লেখাকে প্রদর্শন করার ক্ষেত্রে স্ট্রং ট্যাগ ব্যবহার করা হয় |
<strong> This is strong text </strong>
- Small text – লেখাকে অপেক্ষাকৃত অনেক ছোট বোঝাতে স্মলার টেক্সট ইউজ করা হয় |
<small > This is smaller text </small>
- Pre text – যখন কোন ওয়েব পেজে কবিতা বা কোন উদ্ধৃতি ব্যবহার করা হয় তখন তার লাইনকে ঠিক রাখার জন্য Pre ট্যাগ ইউজ করা হয় |
<pre> This is a pre text </pre>
এখানে প্রত্যেকটি বিষয়ে যেভাবে ওয়েবপেজের লিখতে হবে সেভাবে লিখে দেখানো হয়েছে আপনাদের যেকোনো প্রয়োজনে ওপরের ফরমেট অনুসারে এই এলিমেন্ট গুলো আপনারা ওয়েবপেজে ব্যবহার করতে পারবেন |
এইচটিএমএল ফরমেটিং ব্যবহারের প্রয়োজনীয়তা
কোন লেখাকে সুন্দরভাবে প্রদর্শনের জন্য ওয়েব পেজে বিভিন্ন ধরনের ফরমেটিং ব্যবহার করা হয় যা ওয়েবপেজকে দেখতে আকর্ষণীয় করে তোলে এবং একটা ইউনিক ডিজাইন প্রদর্শন করে | যার ফলে যেকোনো ভিউয়ার সেই ওয়েবপেজটির দেখতে বা পেজ এর প্রত্যেকটি কনটেন্ট পড়তে খুবই স্বাচ্ছন্দ্যবোধ করে |
এছাড়া ওয়েব পেজের কোন নির্দিষ্ট বিষয় বিহারের সামনে সুন্দর ভাবে তুলে ধরার জন্য এইচটিএমএল ফরমেটিং এলিমেন্ট খুবই গুরুত্বপূর্ণ ভূমিকা পালন করে |
আজকে আমরা এইচটিএমএল ফরমেটিং সম্পর্কে বিস্তারিতভাবে জানানোর চেষ্টা করেছি এই বিষয়ে যদি আপনাদের কোন প্রশ্ন থাকে বা কোথাও বুঝতে সমস্যা হয় অবশ্যই কমেন্টে জানাবেন |