آموزش HTML - تگ ها

عناصر کد کامپیوتری HTML (تگ‌ها) قالب‌بندی و سبک‌های متنی منحصربه‌فردی را برای انواع مختلف پیام‌های مرتبط با کد ارائه می‌دهند؛ مانند ورودی کیبورد، متن‌های پیش‌قالب‌بندی‌شده، قطعه‌کدها، متغیرها و خروجی‌های نمونه. عناصر کد کامپیوتری به شرح زیر فهرست شده‌اند:

• عنصر <kbd>
• عنصر <pre>
• عنصر <code>
• عنصر <var>
• عنصر <samp>

عنصر <kbd> در HTML

تگ <kbd> برای تعریف ورودی کیبورد (صفحه‌کلید) استفاده می‌شود. زمانی از این تگ استفاده کنید که می‌خواهید کاربر کلیدهایی را روی کیبورد خود فشار دهد؛ برای مثال کلیدهای میان‌بر Ctrl+C برای کپی، Esc برای خروج و غیره.

مثال

اکنون بیایید مثالی برای پیاده‌سازی تگ <kbd> ببینیم:

<!DOCTYPE html>
<html>
   <body>
      <h2>Example of kbd Tag</h2>
      <p>Use the following shortcut keys:</p>
      <p><strong>Cut</strong>  <kbd>CTRL</kbd>+<kbd>X</kbd></p>
      <p><strong>Copy</strong>  <kbd>CTRL</kbd>+<kbd>C</kbd></p>
      <p><strong>Paste</strong>  <kbd>CTRL</kbd>+<kbd>V</kbd></p>
      <p><strong>Undo</strong>  <kbd>CTRL</kbd>+<kbd>Z</kbd></p>
   </body>
</html>

عنصر <pre> در HTML

تگ <pre> در HTML برای تنظیم متن‌های پیش‌قالب‌بندی‌شده (Preformatted) استفاده می‌شود. این متن فواصل (Space) و شکست‌های خط (Line breaks) را حفظ می‌کند و در صفحه وب دقیقاً همان‌گونه که در کد HTML دیده می‌شود ظاهر می‌گردد.

مثال

اکنون بیایید مثالی برای پیاده‌سازی تگ <pre> ببینیم:

<!DOCTYPE html>
<html>
   <body>
      <h2>Example of pre Tag</h2>
      <pre>
  This is a demo text
  and will appear
  in the same format as
  it
  is visible
  here. The pre tag displays
  the text in a fixed-width
  font. It preserves
  both spaces and
  line breaks as you can see
  here.
</pre>
   </body>
</html>

عنصر <code> در HTML

تگ <code> برای قالب‌بندی کد در یک سند HTML استفاده می‌شود. برای مثال، برای نوشتن و قالب‌بندی مناسب کدهای جاوا، از عنصر <code> استفاده کنید.

مثال

اکنون بیایید مثالی برای پیاده‌سازی عنصر <code> ببینیم:

<!DOCTYPE html>
<html>
   <body>
      <h1>Example of code Tag</h1>
      <h2>C++</h2>
      <code>
         #include 
         <iostream>
      </code>
      <h2>C</h2>
      <code>
         #include 
         <stdio.h>
      </code>
   </body>
</html>

عنصر <var> در HTML

تگ <var> در HTML برای نمایش عبارات ریاضی در محاسبات استفاده می‌شود.

مثال

اکنون بیایید مثالی برای پیاده‌سازی تگ <var> ببینیم:

<!DOCTYPE html>
<html>
   <body>
      <h2>Example of var Tag</h2>
      Sample equation  <var>2x</var> - <var>2z</var> = <var>3y</var> + 9
   </body>
</html>

عنصر <samp> در HTML

تگ <samp> یک تگ عبارتی (phrase tag) است که برای قالب‌بندی متن در سند HTML استفاده می‌شود.

مثال

اکنون بیایید مثالی برای پیاده‌سازی عنصر <samp> ببینیم:

<!DOCTYPE html>
<html>
   <body>
      <h2>Exam Results</h2>
      <p><s>Result would be announced on 6th June.</s></p>
      <samp>New date for results is 7th June.</samp>
   </body>
</html>

عناصر کد کامپیوتر در HTML

در ادامه فهرستی از تگ‌های کد کامپیوتر به همراه توضیحات آن‌ها آورده شده است که برای تعریف ورودی کاربر و کدهای کامپیوتری استفاده می‌شوند: