কম্পিউটার

HTML পাঠ্য বিন্যাসে জোর দেওয়া:বোল্ড, ইটালিক এবং আন্ডারলাইন

কোন কিছুর প্রতি দৃষ্টি আকর্ষণ করার জন্য HTML এ আপনার টেক্সট ফরম্যাট করার অনেক উপায় আছে। এই পোস্টে, আমরা কীভাবে আপনার টেক্সটকে এইচটিএমএল-এ ফরম্যাট করতে হবে তা নিয়ে কথা বলব যাতে বোল্ড হতে হয়, তির্যক হতে হয় বা আন্ডারলাইন করতে হয়। আপনি কিছুক্ষণের মধ্যেই একজন ফরম্যাটিং পেশাদার হয়ে উঠবেন!

বোল্ড

পাঠ্যকে বোল্ড-এ সেট করা হচ্ছে HTML5-এর আগে HTML-এ আপনি <b> দিয়ে সাহসী হতে চেয়েছিলেন এমন পাঠ্যের চারপাশে জড়িত। ট্যাগ:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is <b>bold</b></p>
   <script src="script.js"></script>
 </body>
</html>

যখন HTML5 স্ট্যান্ডার্ড প্রকাশ করা হয়েছিল, তখন পাঠ্যকে বোল্ড করার পছন্দের উপায়টি <strong> ব্যবহার করে পরিবর্তিত হয়েছে। ট্যাগ:

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is also <strong>bold</strong></p>
   <script src="script.js"></script>
 </body>
</html>

শুধুমাত্র <b> এর মধ্যে পার্থক্য এবং <strong> উপাদান শব্দার্থবিদ্যা। স্ক্রীন রিডাররা <strong> দেখতে পাবেন tags এবং স্পষ্টভাবে টেক্সটটি পড়ার সময় আরও জোর দেবে। <b> এর জন্য অনুমতি দেয় না।

ইটালিকস

বোল্ড এর সাথে একই , দুটি ভিন্ন মান আছে যা আমরা তির্যক লেখা তৈরির জন্য জানি। HTML5 স্ট্যান্ডার্ডের আগে, ইটালিক টেক্সটকে <i>-এ এনক্যাপসুলেট করে তৈরি করা হয়েছিল। ট্যাগ.

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <link href="style.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
   <p>This text is in <i>italics</i></p>
   <script src="script.js"></script>
 </body>
</html>

যেহেতু HTML5 স্ট্যান্ডার্ড হয়ে উঠেছে, <i> ট্যাগ আরও শব্দার্থিক <em> এর জন্য পথ তৈরি করেছে ট্যাগ জোর-এর জন্য “em” সংক্ষিপ্ত . <em> ট্যাগ একটি স্ক্রিন রিডারকে সংকেত দেয় যাতে পাঠ্যকে আরও জোর দেওয়া যায় যাতে একজন ব্যবহারকারী সাধারণ পাঠ্য এবং জোর দেওয়া পাঠ্যের মধ্যে পার্থক্য করতে পারে।

81% অংশগ্রহণকারী বলেছেন যে তারা বুটক্যাম্পে যোগ দেওয়ার পরে তাদের প্রযুক্তিগত কাজের সম্ভাবনা সম্পর্কে আরও আত্মবিশ্বাসী বোধ করেছেন। আজই একটি বুটক্যাম্পের সাথে মিলিত হন৷

গড় বুটক্যাম্প গ্র্যাড একটি বুটক্যাম্প শুরু করা থেকে শুরু করে তাদের প্রথম চাকরি খোঁজা পর্যন্ত ক্যারিয়ারের পরিবর্তনে ছয় মাসেরও কম সময় কাটিয়েছে।

আন্ডারলাইন

এইচটিএমএল আন্ডারলাইন করা পাঠ্যটি প্রায়শই ভুল বানান বোঝাতে ব্যবহৃত হয়। হাইপারলিঙ্কের জন্য বিভ্রান্ত হতে পারে এমন জায়গায় এটি ব্যবহার করবেন না। আপনার পাঠ্যকে <u> দিয়ে মার্কআপ করুন ট্যাগগুলিকে ফরম্যাট করার জন্য চিহ্নিত করতে এবং তারপর আপনি যে ধরনের আন্ডারলাইন শৈলী চান তা নির্দেশ করতে CSS ব্যবহার করুন৷

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
   <style>
     p u {
       text-decoration: underline red wavy;
     }
   </style>
 </head>
 <body>
   <p>This is a <u>mispelled</u> word</p>
 </body>
</html>



উপসংহার

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


  1. HTML DOM বোল্ড অবজেক্ট

  2. এইচটিএমএল প্লেসহোল্ডার অ্যাট্রিবিউট

  3. এইচটিএমএল টেক্সট ফরম্যাটিং

  4. HTML DOM আন্ডারলাইন অবজেক্ট