HTML Text Formatting in Easy Bengali 2024

ওয়েব ডেভেলপমেন্টে HTML খুবই গুরুত্বপূর্ণ একটি ভাষা, যার মাধ্যমে আমরা বিভিন্ন ধরনের ওয়েবপেজ তৈরি করতে পারি। HTML এ Text Formatting একটি গুরুত্বপূর্ণ বিষয় যা ওয়েবপেজে বিভিন্ন ধরণের টেক্সটকে আকর্ষণীয় এবং পঠনযোগ্য করতে ব্যবহৃত হয়। এই ব্লগে, আমরা HTML এর বিভিন্ন Formatting ট্যাগ এবং তাদের ব্যবহার সম্পর্কে বিস্তারিত জানব।

Table of Contents

HTML এ Text Formatting কী?

HTML এ Text Formatting বলতে টেক্সটকে বোল্ড, ইটালিক, আন্ডারলাইন, ইত্যাদি রূপে সাজানোর প্রক্রিয়াকে বোঝায়। এটি user এর দৃষ্টি আকর্ষণ করতে এবং কনটেন্টকে আরও পঠনযোগ্য করতে সাহায্য করে। HTML এ Text Formatting করতে বিভিন্ন ট্যাগ ব্যবহৃত হয়।

HTML Text Formating techinbengali

বিভিন্ন ফরম্যাটিং TAG এবং তাদের ব্যবহার

Bold টেক্সট (<b> ট্যাগ):

HTML এ কোনো টেক্সটকে বোল্ড করতে <b> ট্যাগ ব্যবহার করা হয়। এটি টেক্সটকে একটু মোটা করে প্রদর্শন করে, যা সাধারণত গুরুত্বপূর্ণ বিষয়বস্তুতে ব্যবহার করা হয়।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
    <p>Subscribe Our YouTube Channel: <b>Subscribe</b></p>
</body>
</html>
HTML

Example

Subscribe Our YouTube Channel: Subscribe

এখানে, “Subscribe” টেক্সটটি <b> ট্যাগের মধ্যে থাকার কারণে Bold (বোল্ড) হয়ে প্রদর্শিত হবে।

Strong টেক্সট (<strong> ট্যাগ):

<strong> ট্যাগ ব্যবহার করা হয় কোনো টেক্সটকে গুরুত্বপূর্ণ বা জোরালো বোঝাতে। এটি <b> ট্যাগের মতোই বোল্ড দেখায়, তবে এটি আরও গুরুত্ব দিয়ে বোঝায়।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
    <p>This is <strong>Important Text</strong>.</p>
</body>
</html>
HTML

Example

This is Important Text.

এখানে, “Important Text” টেক্সটটি জোরালোভাবে প্রদর্শিত হবে।

Italic টেক্সট (<i> ট্যাগ):

HTML এ টেক্সটকে ইটালিক করতে <i> ট্যাগ ব্যবহার করা হয়। এটি টেক্সটকে হালকা বাঁকা করে প্রদর্শন করে।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
    <p>This is <i>italic</i> text.</p>
</body>
</html>
HTML

Example

This is italic text.

এখানে, “italic” টেক্সটটি ইটালিক আকারে প্রদর্শিত হবে।

Emphasized টেক্সট (<em> ট্যাগ):

<em> ট্যাগটিও ইটালিক প্রদর্শন করে, কিন্তু এটি কোনো টেক্সটকে গুরুত্ব সহকারে প্রদর্শন করতে ব্যবহৃত হয়।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
   <p>This is <em>Emphasized</em> text.</p>
</body>
</html>
HTML

Example

This is Emphasized text.

এখানে, “Emphasized” টেক্সটটি ইটালিক এবং গুরুত্বসহকারে প্রদর্শিত হবে।

Marked টেক্সট (<mark> ট্যাগ):

<mark> ট্যাগ ব্যবহার করা হয় টেক্সটকে হাইলাইট করতে, যা পাঠকদের দৃষ্টি আকর্ষণ করতে সাহায্য করে।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
    <p>Don't forget to <mark>subscribe</mark> to our channel.</p>
</body>
</html>
HTML

Example

Don't forget to subscribe to our channel.

এখানে, “subscribe” টেক্সটটি হাইলাইট হয়ে প্রদর্শিত হবে।

Deleted টেক্সট (<del> ট্যাগ):

<del> ট্যাগটি ব্যবহার করা হয় কোনো টেক্সটের ওপর স্ট্রাইক থ্রু লাইন যোগ করতে, যা মুছে ফেলা বা অকার্যকর টেক্সট নির্দেশ করে।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
   <p>Original Price: <del>500/-</del> Discounted Price: 400/- </p>
</body>
</html>
HTML

Example

Original Price: 500/- Discounted Price: 400/-

এখানে, “500/-” টেক্সটটির ওপর একটি স্ট্রাইক থ্রু লাইন থাকবে।

Subscript টেক্সট (<sub> ট্যাগ):

সাবস্ক্রিপ্ট টেক্সট সাধারণত নিচের দিকে ছোট করে প্রদর্শিত হয় এবং এটি বৈজ্ঞানিক ফর্মুলা বা কেমিক্যাল symbol গুলির জন্য ব্যবহৃত হয়।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
   <p>Water Formula: H<sub>2</sub>O</p>
</body>
</html>
HTML

Example

Water Formula: H2O

এখানে, “H₂O” এ “2” সাবস্ক্রিপ্ট আকারে প্রদর্শিত হবে।

Superscript টেক্সট (<sup> ট্যাগ):

সুপারস্ক্রিপ্ট টেক্সট সাধারণত উপরের দিকে ছোট করে প্রদর্শিত হয় এবং এটি গণিতের সূচক বা ত্রুটি নির্দেশ করার জন্য ব্যবহৃত হয়।

HTML CODE

<!DOCTYPE html>
<html>
<head>
    <title>HTML Text Formatting</title>
</head>
<body>
   <p>5<sup>2</sup> = 25</p>
</body>
</html>
HTML

Example

52 = 25

এখানে, “5²” এ “2” সুপারস্ক্রিপ্ট আকারে প্রদর্শিত হবে।

HTML Comment

HTML Comment কী?

HTML কমেন্ট হল কোডের একটি অংশ যা ব্রাউজারে দেখা যায় না এবং ওয়েবপেজে এর কোনো প্রভাব ফেলে না। কমেন্টগুলি মূলত কোডের মধ্যে নোটস, নির্দেশিকা, বা ব্যাখ্যা করতে ব্যবহৃত হয়, যা কোডার বা অন্যান্য ডেভেলপারদের জন্য বোঝা সহজ করে দেয়। এটি ডিবাগিং এবং কোডের মেইনটেনেন্সের জন্য খুবই গুরুত্বপূর্ণ। কমেন্ট ব্যবহার করে , কোডের কোনো নির্দিষ্ট অংশকে সাময়িকভাবে বন্ধ করা যায়।

HTML Paragraph : https://youtu.be/COblexHhzmU?si=seFo38Y-Fu0j0TIv

HTML কমেন্টের Syntax

HTML এ কমেন্ট তৈরি করা খুবই সহজ। এর জন্য নির্দিষ্ট একটি সিনট্যাক্স ব্যবহার করতে হয় –

<!– দিয়ে কমেন্ট শুরু হয় এবং –> দিয়ে শেষ হয়। এই দুই চিহ্নের মধ্যে যা কিছু লেখা হবে, সেটিই হলো comments , যেটি ব্রাউজারে প্রদর্শিত হবে না।

<!--  এখানে আপনার কমেন্ট লিখুন  -->
<!DOCTYPE html>
<html>
<head>
    <title>HTML Comments Example</title>
</head>
<body>
    <!-- this is a comment-->
    <p>This is a paragraph.</p>
    <!-- this is another comment-->
    <h2>This is a Heading</h2>
</body>
</html>
HTML

This is a paragraph.This is a Heading

উপরের উদাহরণে, HTML কমেন্টগুলি কেবল কোডের ব্যাখ্যা প্রদান করতে ব্যবহৃত হয়েছে এবং এগুলি ওয়েবপেজে দেখা যাবে না।

উপসংহার ( Conclusion )

HTML এর বিভিন্ন Formatting ট্যাগ ব্যবহার করে আপনি আপনার ওয়েবপেজের টেক্সটকে আরও আকর্ষণীয় এবং পঠনযোগ্য করতে পারেন। প্রতিটি ট্যাগের নিজস্ব ব্যবহার এবং গুরুত্ব রয়েছে। এই ব্লগটি HTML এর Text Formatting সম্পর্কে একটি বিস্তারিত ধারণা প্রদান করে এবং আপনি কিভাবে এটি ব্যবহার করতে পারেন তা বোঝায়। আশা করি, এটি আপনাকে HTML এ Text Formatting সম্পর্কে আরও ভালোভাবে বুঝতে সাহায্য করেছে।

F.A.Q

HTML এ Text Formatting কী?

HTML এ Text Formatting বলতে টেক্সটকে বোল্ড, ইটালিক, আন্ডারলাইন ইত্যাদি রূপে প্রদর্শনের প্রক্রিয়াকে বোঝায়, যা ওয়েবপেজে কনটেন্টকে আরও আকর্ষণীয় এবং পঠনযোগ্য করে।

HTML এ বোল্ড টেক্সট তৈরি করার জন্য কোন ট্যাগটি ব্যবহৃত হয়?

HTML এ বোল্ড টেক্সট তৈরি করতে <b> ট্যাগ ব্যবহার করা হয়।

<strong> ট্যাগের কাজ কী?

<strong> ট্যাগটি একটি টেক্সটকে জোরালো বা গুরুত্বপূর্ণ বোঝাতে ব্যবহার করা হয়। এটি বোল্ড আকারে টেক্সট প্রদর্শন করে।

ইটালিক টেক্সট তৈরি করতে HTML এ কোন ট্যাগটি ব্যবহার করা হয়?

HTML এ ইটালিক টেক্সট তৈরি করতে <i> ট্যাগ ব্যবহার করা হয়।

<em> ট্যাগ এবং <i> ট্যাগের মধ্যে পার্থক্য কী?

<i> ট্যাগ ইটালিক টেক্সট প্রদর্শন করে, যেখানে <em> ট্যাগও ইটালিক প্রদর্শন করে কিন্তু এটি টেক্সটের উপর গুরুত্ব আরোপ করে।

কোন ট্যাগটি টেক্সটকে হাইলাইট করতে ব্যবহৃত হয়?

HTML এ টেক্সট হাইলাইট করতে <mark> ট্যাগ ব্যবহার করা হয়।

সাবস্ক্রিপ্ট টেক্সট তৈরি করতে কোন ট্যাগ ব্যবহার করা হয়?

HTML এ সাবস্ক্রিপ্ট টেক্সট তৈরি করতে <sub> ট্যাগ ব্যবহার করা হয়, যা টেক্সটকে নিচের দিকে ছোট করে প্রদর্শন করে।

<sup> ট্যাগের কাজ কী?

<sup> ট্যাগটি টেক্সটকে সুপারস্ক্রিপ্ট আকারে প্রদর্শন করে, যা টেক্সটকে উপরের দিকে ছোট করে দেখায়।

HTML এ টেক্সট ফরম্যাটিং কেন গুরুত্বপূর্ণ?

HTML এ টেক্সট ফরম্যাটিং গুরুত্বপূর্ণ কারণ এটি কনটেন্টকে আরও পঠনযোগ্য এবং দৃষ্টি আকর্ষণীয় করে তোলে, যা ব্যবহারকারীদের অভিজ্ঞতাকে উন্নত করে।

HTML এ কিভাবে comment করতে হয় ?

<!– দিয়ে শুরু এবং –> দিয়ে শেষ। এই দুটি চিহ্নের মাঝে কমেন্টস লিখতে হবে।

Webpage এ কি Comment দেখা যায় ?

না, এটি মূলত কোডের মধ্যে নোটস, নির্দেশিকা, বা ব্যাখ্যা করতে ব্যবহৃত হয়|

Leave a Comment

iQOO Neo9 Pro 5G শীঘ্রই ভারতে আসতে চলেছে realme GT 5 Pro, সাথে রয়েছে দুর্দান্ত ফিচারস Infinix NOTE 40 pro 5G launched in India with best features ১৫০০০ এর নিচে এটিই সবার সেরা বাজেট স্মার্ট ফোন , Redmi Note 12 5g ভারতে খুব তারাতারি লঞ্চ হতে চলেছে ২০,০০০ এর নিচে Vivo T3x 5G স্মার্ট ফোনটি , এক ঝলকে দেখে নিন কি কি থাকছে ?
iQOO Neo9 Pro 5G শীঘ্রই ভারতে আসতে চলেছে realme GT 5 Pro, সাথে রয়েছে দুর্দান্ত ফিচারস Infinix NOTE 40 pro 5G launched in India with best features ১৫০০০ এর নিচে এটিই সবার সেরা বাজেট স্মার্ট ফোন , Redmi Note 12 5g ভারতে খুব তারাতারি লঞ্চ হতে চলেছে ২০,০০০ এর নিচে Vivo T3x 5G স্মার্ট ফোনটি , এক ঝলকে দেখে নিন কি কি থাকছে ?