دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)



  • ۲۰
  • آبان

جلسه ۴۱ : HTML چیست؟ – تکنولوژی اینترنت

  • دسته‌بندی‌ها :
جلسه ۴۱ : HTML چیست؟ – تکنولوژی اینترنت
    • جزئیات
    • نوع محتواآموزشی

      مقدمه

      سلام دوستان عزیز وب سایت آموزشی پی وی لرن و وقت بخیر به علاقمندان آموزش تکنولوژی های اینترنتی. HTML چیست و چه کاربردی دارد؟ در این بخش به دنبال پاسخی برای این پرسش هستیم. با ادامه ی مطالب آموزشی تکنولوژی اینترنت همراه باشید.

      HTML چیست و چه کاربردی دارد؟

      در ابتدا می خواهیم بدانیم که HTML چیست و چه کاربردی دارد؟ با ما همراه باشید.

      HTML مخفف Hyper Text Markup Language است. این یک زبان قالب بندی است که برای تعریف ظاهر و محتوای یک صفحه وب استفاده می شود. به ما امکان می دهد متن ، گرافیک ، صدا و فیلم را در یک صفحه وب سازماندهی کنیم. HTML دارای ویژگی های خاصی است که بررسی خواهیم کرد.

      امتیاز کلیدی:

      • کلمه Hypertext به متنی اشاره دارد که به عنوان یک لینک عمل می کند.
      • نشانه گذاری یا Markup به نمادهایی اطلاق می شود که برای تعریف ساختار متن استفاده می شوند. علائم نشانه گذاری به مرورگر می گوید چگونه متن را نمایش دهد و اغلب به آن ها تگ (tag) می گویند.
      • کلمه Language به سینتکسی که شبیه به هر زبان دیگر است، اشاره دارد.

      HTML توسط Tim Berners-Lee در CERN ایجاد شده است.

      نسخه های HTML

      جدول زیر نسخه های مختلف HTML را نشان می دهد:

       

      ورژنسال
      HTML 1.0۱۹۹۱
      HTML 2.0۱۹۹۵
      HTML 3.2۱۹۹۷
      HTML 4.0۱۹۹۹
      XHTML۲۰۰۰
      HTML5۲۰۱۲

      برچسب ها یا تگ های HTML

      Tag ، دستوری است که به مرورگر وب می گوید که چگونه متن ، صدا ، گرافیک یا فیلم را در صفحه وب نمایش دهید.

      امتیاز کلیدی:

      • برچسب ها با کارکترهاي > < مشخص شده اند.
      • آن ها با کارکتر کم تر از (<) شروع می شوند و با کاراکتر بیش تر از (>) به پایان می رسند.
      • tag name بین کارکترهاي > < مشخص شده است.
      • بیش تر تگ ها معمولاً به صورت جفت اتفاق می افتند: start tag و closing tag
      • start tag به سادگی tag name است که در کارکتر هاي > < محصور شده است در حالی که closing tag شامل یک اسلش (/) است.
      • بعضی از برچسب ها خالی هستند، یعنی closing tag را ندارند.
      • برچسب ها موردی حساس نیستند.
      • تگ نِیم استارت و کلوز باید یکسان باشد. به عنوان مثال <b> hello </i> ، نامعتبر است زیرا این دو دو متفاوت هستند.
      • اگر کاراکتر های (<>) را برای یک برچسب مشخص نکنید ، مرورگر tag name را به عنوان یک متن ساده تلقی خواهد کرد.
      • این تگ همچنین می تواند ویژگی هایی برای ارائه اطلاعات اضافی درباره تگ برای مرورگر داشته باشد.

      تگ های اصلی یا basic tags

      در جدول زیر تگ های HTML اصلی که صفحه اصلی را تعریف می کنند نشان می دهد:

       

      تگتوضیح
      <html> </html>سند را به عنوان یک صفحه وب مشخص می کند.
      <head> </head>اطلاعات توصیفی درباره اسناد وب را مشخص می کند.
      <title> </title>عنوان صفحه وب را مشخص می کند.
      <body> </body>بدنه ی یک سند وب را مشخص می کند.

      کد زیر نشان می دهد که چگونه از basic tags استفاده کنیم.

      مثال : 

      قالب بندی تگ ها

      در جدول زیر تگ های HTML مورد استفاده برای قالب بندی متن نمایش داده شده است:

       

      تگتوضیح
      <b> </b>متن را به صورت bold مشخص می کند. به عنوان مثال. this is bold text
      <em> </em>این یک عبارت متنی  است. متن تأکید شده را مشخص می کند. به عنوان مثال. Emphasized text
      <strong> </strong>این یک تگ phrase است. متن مهم را مشخص می کند. به عنوان مثال.  this is strong text.
      <i> </i>محتوای برچسب italic به صورت italic نمایش داده می شود. به عنوان مثال.  Italic text
      <sub> </sub>متن زیرنویس را مشخص می کند. به عنوان مثال.  X1
      <sup> </sup>متن بالا نویس را تعریف می کند. به عنوان مثال. X2
      <ins> </ins>متن درج شده را مشخص می کند. به عنوان مثال.  The price of pen is now ۲۰۱۵
      <del> </del>متن حذف شده را مشخص می کند. به عنوان مثال. The price of pen is now ۲۰۱۵
      <mark> </mark>متن مارک شده را مشخص می کند. به عنوان مثال. It is raining

      در ادامه تگ های Table رو مورد بررسی قرار خواهیم داد.

      تگ های Table

      جدول زیر تگ های Table متداول را شرح می دهد:

       

      تگتوضیح
      <table> </table>یک جدول را مشخص می کند.
      <tr> </tr>یک ردیف در جدول را مشخص می کند.
      <th> </th>هدر سلول در جدول را مشخص می کند.
      <td> </td>داده ها را در یک سلول از جدول مشخص می کند.
      <caption> </caption>عنوان جدول را مشخص می کند.
      <colgroup> </colgroup>گروهی از ستون ها را در یک جدول برای قالب بندی مشخص می کند.

      تگ های List

      در جدول زیر تگ های List متداول استفاده می شود:

       

      تگتوضیح
      <ul> </ul>یک unordered list را مشخص می کند.
      <ol> </ol>یک ordered list را مشخص می کند.
      <li> </li>یک list item را مشخص می کند..
      <dl> </dl>یک description list را مشخص می کند..
      <dt> </dt> ترم در یک description list را مشخص می کند.
      <dd> </dd>description ترم در یک description list را مشخص می کند.

      فریم ها

      فریم ها به ما کمک می کنند تا پنجره مرورگر را به چندین قسمت مستطیلی تقسیم کنیم. هر منطقه حاوی صفحه وب html جداگانه است و هر یک از آن ها به طور مستقل کار می کنند.

      مجموعه ای از فریم ها در کل مرورگر به عنوان فریم شناخته می شود. این به مرورگر می گوید که چگونه می تواند پنجره مرورگر را به فریم ها و صفحات وب تقسیم کند.

      در جدول زیر تگ های مختلفی که برای ایجاد فریم استفاده شده است را توضیح می دهد:

       

      تگتوضیح
      <frameset> </frameset>این جایگزین تگ <body> است. این تگ ها را که معمولاً در عنصر <body> استفاده می شود را شامل نمی شود. در عوض شامل عنصر <frame> است که برای اضافه کردن هر فریم استفاده می شود.
      <frame> </frame>محتوای فریم های مختلف را در یک صفحه وب مشخص می کند.
      <base> </base>برای تنظیم فریم هدف پیش فرض در هر صفحه ای که حاوی پیوندهایی باشد که محتوای آن ها در یک قاب دیگر نمایش داده می شود ، استفاده می شود

      فرم ها (Forms)

      برای وارد کردن مقادیر از Form ها استفاده می شود. این مقادیر برای پردازش به سرور ارسال می شوند. فرم ها از عناصر ورودی مانند فیلدهای متنی ، چک باکس ها ، دکمه های رادیویی ، لیست ها و غیره برای وارد کردن داده ها در آن استفاده می کنند.

      جدول زیر تگ های متداول را هنگام ایجاد فرم شرح می دهد:

       

      TagDescription
      <form> </form>برای ایجاد فرم HTML استفاده می شود.
      <input> </input>فیلد ورودی را مشخص می کند.
      <textarea> </textarea>کنترل منطقه متن را مشخص می کند که اجازه می دهد متن چند خطی را وارد کنید.
      <label> </label>تگ مربوط به یک عنصر ورودی را مشخص می کند.

      مبحث HTML چیست و چه کاربردی دارد؟ رو در این جا به پایان می رسونیم.

      کلام پایانی

      دوستان ممنون از این که با مباحث تکنولوژی اینترنتی از وب سایت آموزشی پی وی لرن همراه هستید. با موضوع HTML چیست و چه کاربردی دارد؟ در این بخش از آموزش تکنولوژی اینترنت همراه بودیم. در بخش بعدی مبحث CSS رو مورد بررسی قرار خواهیم داد. بنابراین اگر به این مبحث علاقمند هستید با ادامه ی مباحث نیز همراه و همگام باشید.

      QR: جلسه ۴۱ : HTML چیست؟ – تکنولوژی اینترنت
      به اشتراک بگذارید
      , , , ,


      دیدگاه کاربران

      لیست مطالب دوره

      مطالب ویژه