Share
Facebook
Twitter
LinkedIn
Whatsapp
Instagram
Messenger

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


এইচটিএমএল এর কিছু এলিমেন্ট বা ট্যাগ আছে, যেগুলো ব্যবহার করে লেখার স্টাইল সরাসরি পরিবর্তন করে কম্পিউটারে বাবহ্রিত কিছু স্টাইল এর মত করা যায়। এই এলিমেন্ট বা ট্যাগ গুলোকে কম্পিউটার কোড এলিমেন্ট বলে। যেমন - <code>, <kbd> ইত্যাদি।


কম্পিউটার কোড

উদাহরণ

<code> 
x = 5; <br>
y = 6; <br>
z = x + y;
</code>
 
 

কোড এডিটর



<kbd> - কিবোর্ড ইনপুট

<kbd> ট্যাগ অর্থাৎ কীবোর্ড এলিমেন্ট, কিবোর্ডের ইনপুট বোতাম বা ভয়েস কমান্ডের মত স্টাইল করে লেখাকে প্রদর্শন করে। <kbd> ... <kbd> ট্যাগের মদ্ধবরতি লেখাগুলোই কিবোর্ড ইনপুট স্টাইল রুপে প্রকাশ করে। প্রায় সকল ব্রাউজারেই এটি বহুল প্রচলিত monospace ফন্টে প্রদর্শিত হয়।

উদাহরণ


<p>Copy the document by pressing <kbd>Ctrl + C</kbd></p>



ফলাফল

Save the document by pressing Ctrl + C
 
 

কোড এডিটর


এইচটিএমএল <kbd> ট্যাগ সম্পর্কে জানতে W3C এর 4.3.6.16 The kbd element ওয়েব পেজটি ব্রাউজ করুন।


<samp> - প্রোগ্রাম আউটপুট

<samp> ট্যাগ বা এলিমেন্ট ব্যবহার করে, প্রোগ্রাম বা কম্পিউটিং সিস্টেম থেকে প্রাপ্ত আউটপুট এর মত স্টাইল এর লেখা প্রদর্শন করা হয়। <Samp> ট্যাগ দ্বারা ঘিরে থাকা লেখাটুকু বহুল প্রচলিত monospace ফন্টেই প্রদর্শিত হয়।

উদাহরণ


<p>If you enter correct value, the program will return <samp>Sucess!</samp></p>



ফলাফল

If you enter correct value, the program will return Sucess!

 
 

কোড এডিটর


এইচটিএমএল <samp> ট্যাগ সম্পর্কে জানতে W3C এর 4.3.6.15 The samp element ওয়েব পেজটি ব্রাউজ করুন।


<code> - কম্পিউটার কোড

<code> ট্যাগ বা কোড এলিমেন্ট ব্যবহার করে, লেখাকে কম্পিউটার কোড এর মত স্টাইল প্রদান করা হয়। <code> ট্যাগ দ্বারা ঘিরে থাকা লেখাগুলো বহুল প্রচলিত monospace ফন্টে প্রদর্শিত হয়।

উদাহরণ


  <code>
  a = 10;
  b = 20;
  c = a + b;
  </code>
 

ফলাফল

a = 10;b = 20;c = a + b;
 
 

কোড এডিটর


এখানে একটি বিষয় হল <code> এলিমেন্টটি বাড়তি কোন হোয়াইট স্পেস ও লাইন ব্রেক যুক্ত করে না। তাই এটা ঠিক করতে, কোড গুলো একটি <pre> ... </pre> ট্যাগের ভিতরে রাখতে হবে অর্থাৎ <pre> ... </pre> ট্যাগের মাঝে <code> ... </code> এলিমেন্ট নেস্তিং করতে হবে।

<pre> ... </pre> ট্যাগ সম্পর্কে জানতে এইচটিএমএল পারাগ্রাফ টিউটোরিয়ালটি দেখুন।

উদাহরণ


<pre>
<code>
a = 10;
b = 20;
c = a + b;
</code>
</pre>
 

ফলাফল


a = 10;
b = 20;
c = a + b;


 
 

কোড এডিটর


এইচটিএমএল <code> ট্যাগ সম্পর্কে জানতে W3C এর 4.3.6.13 The code element ওয়েব পেজটি ব্রাউজ করুন।


<var> - ভেরিয়েবল এর জন্য

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

উদাহরণ


Electrical Power: <var>P</var> = <var>I<sup>2</sup>R</var>



ফলাফল

Electrical Power: P = I2R.

 
 

কোড এডিটর


এইচটিএমএল <var> ট্যাগ সম্পর্কে জানতে W3C এর 4.3.6.14 The var element ওয়েব পেজটি ব্রাউজ করুন।


কম্পিউটার কোড আউটপুট এলিমেন্ট

ট্যাগ বর্ণনা
<code> লেখাকে computer code স্টাইলে প্রদর্শন করে।
<kbd> লেখাকে keyboard স্টাইলে প্রদর্শন করে।
<samp> লেখাকে computer code স্টাইলে প্রদর্শন করে।
<tt> লেখাকে teletype স্টাইলে প্রদর্শন করে।
<var> লেখাকে variable স্টাইলে প্রদর্শন করে।
<pre> লেখাকে preformatted স্টাইলে প্রদর্শন করে।