Header Ads

HTML Computer Code Element এইচটিএমএল কম্পিউটার কোড এলিমেন্ট

Image result for html computer code elements

এইচটিএমএল কম্পিউটার কোড এলিমেন্ট



এক নজরে এইচটিএমএল কম্পিউটার কোড এলিমেন্ট

ট্যাগবিবরণ
<code>প্রোগ্রামিং কোডকে বুঝায়।
<kbd>কীবোর্ড ইনপুটকে বুঝায়। 
<samp>কম্পিউটার আউটপুটকে বুঝায়।
<var>ভ্যারিয়েবলকে বুঝায়।

<code> এলিমেন্ট

কম্পিউটার কোড লেখার জন্য কন্টেইনার হিসেবে এইচটিএমএল <code> এলিমেন্ট ব্যবহার করা হয়।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল code এলিমেন্ট</title>
</head>
<body>
  <p>নিম্নে code এলিমেন্টের মধ্যে কিছু প্রোগ্রামিং কোড লেখা হয়েছে।</p>
  <code>
  var a = 5;<br>
  var b = 6;<br>
  document.getElementsByTagName("li").innerHTML = a * b;
  </code>
</body>
</html>

ফলাফল


<kbd> এলিমেন্ট

এইচটিএমএল <kbd> এলিমেন্ট দ্বারা কীবোর্ডের ইনপুট নির্দেশ করে।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল kbd এলিমেন্ট</title>
</head>
<body>
  <p>kbd এলিমেন্ট কীবোর্ড ইনপুট নির্দেশ করে।</p>
  <p><kbd>File | Open...</kbd></p>
</body>
</html>

ফলাফল


<samp> এলিমেন্ট

এইচটিএমএল <samp> এলিমেন্ট এর মাধ্যমে কম্পিউটার সিস্টেম বা প্রোগ্রাম হতে নমুনা আউটপুট দেখানো হয়।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল samp এলিমেন্ট</title>
</head>
<body>
  <p>samp এলিমেন্ট কম্পিউটার প্রোগ্রামের নমুনা আউটপুট নির্দেশ করে।</p>
  <samp>
  demo.example.com login: Apr 12 09:10:17
  Linux 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189
  </samp>
</body>
</html>

ফলাফল

<code> এলিমেন্ট

এইচটিএমএল <code> এলিমেন্ট দ্বারা প্রোগ্রামিং কোডের কিছু অংশকে তুলে ধরা হয়।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল code এলিমেন্ট</title>
</head>
<body>
  <p>কিছু প্রোগ্রামিং কোডঃ</p>
  <code>
  var a = 5;
  var b = 6;
  document.getElementById("test").innerHTML = a * b;
  </code>
</body>
</html>

ফলাফল

উপরের ফলাফলে লক্ষ্য করলে দেখবেন যে, <code> এলিমেন্ট অতিরিক্ত হোয়াইটস্পেস বা সাদা অংশ এবং লাইনব্রেক সংরক্ষন করে না।
এই সমস্যা সমাধানের জন্য আপনি <code> এলিমেন্টকে <pre> এলিমেন্টের মধ্যে রাখতে পারেন।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল code এলিমেন্ট</title>
</head>
<body>
  <p>কিছু প্রোগ্রামিং কোডঃ</p>
  <pre>
   <code>
   var a = 5;
   var b = 6;
   document.getElementById("test").innerHTML = a * b;
   </code>
  </pre>
</body>
</html>

ফলাফল


<var> এলিমেন্ট

এইচটিএমএল <var> এলিমেন্ট ভ্যারিয়েবলকে নির্দেশ করে।
এই ভ্যারিয়েবলটি গাণিতিক এক্সপ্রেশন বা প্রোগ্রামিং কনটেক্সটের ভ্যারিয়েবল হতে পারে।

উদাহরণ

<!DOCTYPE html>
<html>
<head>
  <title>এইচটিএমএল var এলিমেন্ট</title>
</head>
<body>
  <p>আইনস্টাইন লিখেছেনঃ <var>E</var> = <var>m</var><var>c</var><sup>2</sup></p>
</body>
</html>

ফলাফল


অধ্যায়ের সারাংশ

  1. ডকুমেন্টের কোড প্রদর্শনের জন্য এইচটিএমএল <code> এলিমেন্ট ব্যবহার করা হয়।
  2. কী-বোর্ড ইনপুট প্রদর্শনের জন্য এইচটিএমএল <kbd> এলিমেন্ট ব্যবহার করা হয়।
  3. কম্পিউটার কোড এর নমুনা আউটপুট দেখানোর জন্য এইচটিএমএল <samp> এলিমেন্ট ব্যবহার করা হয়।
  4. ভ্যারিয়েবল তৈরি করার জন্য এইচটিএমএল <var> এলিমেন্ট ব্যবহার করা হয়।

No comments

Powered by Blogger.