آموزش برنامه نویسی HTML

آموزش برنامه نویسی HTML

مقدمه و معرفی زبان HTML

معرفی زبان HTML :

   عبارت HTML مخفف (Hyper Text Markup Language) است . Html زبان استاندارد طراحی صفحات وب است و کليه کدهای صفحه اعم از طرف سرور و طرف مشتری در نهايت به کدهای HTML تبديل شده و توسط مرورگر نمايش داده می شوند.

   HTML یک زبان نشانه گذاری است ، به اين معنی که بخش های مختلف توسط اجزايی به نام تگ از هم جدا شده ، که هر کدام دارای کاربرد و خواص مربوط خود هستند . اين تگ ها به مرورگر اعلام می کنند که هر بخش از صفحه چه نوع عنصری است و بايد به چه صورت نمايش داده شود .
در يک صحفه HTML می توان انواع عناصر از قبيل متن ، تيتر ، عکس ، جدول و … را قرار داد ، که برای هر عنصر بايد از تگ مربوط به آن استفاده کرد . صفحات HTML فقط از کد ها که به صورت متن هستند تشکيل شده اند .


مفهوم تگ های HTML :

تگ های HTML برای نشانه گذاری محتويات صفحات به کار می روند و باعث می شوند که مرورگر بتواند تشخيص دهد هر بخش چه نوع عنصری است. هر تگ HTML ، يک بخش ابتدايی و يک بخش انتهايی دارد که هم نام بوده و به صورت استاندارد طبق شکل کلی زير به کار می روند :

< تگ انتها / >    محتويات    < تگ ابتدا >
مثال : < label > ….. < /label >

تگ ابتدايی مشخص کننده آغاز تگ و تگ پايانی ، مشخص کننده انتهای تگ است . هر تگ HTML ، بايد حتما در ادامه توسط تگ پايانی بسته شود . کليه نوشته ها و تگ های ديگری که در بين تگ ابتدا و پايان نوشته می شوند ، محتويات تگ را تشکيل می دهند .


خواص تگ های HTML :

هر تگ دارای مجموعه از خواص است که ويژگی های مختلف آنها را تعيين می کند . هر يک از اين خواص را می توان در درون تگ ابتدايي معرفی و مقدار دهی کرد .
راهنمايي : در ادامه هر يک از تگ های HTML معرفی شده و در صفحه مربوط به آنها خواص مربوطه نيز در جدول خواص مهم قرار داده شده اند . در ستون نام خاصيت نام آن و در ستون نوع خاصيت انواع مقادير قابل قبول برای آن خاصيت تعيين شده است .

مثال : برای مثال تگ < table > دارای خاصيتی به نام Border است ، که به دور جدول کادر يا حاشيه ايجاد می کند . نحوه تعريف و مقدار دهی آن به صورت زير است :
توجه : در هنگام تعريف بايد بين خاصيت و مقدار آن علامت = قرار داده و همچنين مقدارها بايد درون علامت ” ” قرار بگيرند .

< table border = “1” >  محتويات  < /table >

راهنمايی 2 : در بخش آموزش تگ ها سعی شده تا با ارائه مثال های مناسب مطالب توضيحی را در عمل نشان داد . برای اين منظور از جدول Example استفاده شده است ، که اين جدول دارای 2 قسمت است . در قسمت کد ، کد واقعی مورد نياز برای هدف ارائه شده و در قسمت خروجی نيز خروجی کد که به صورت اکتيو توسط مرورگر توليد شده ، نشان داده شده است .
توجه : تمام مثال های قسمت آموزش HTML بر طبق استانداردهای نرم افزار Microsoft Visual Studio 2005 طراحی شده و توسط مرورگرهاي مطرح Internet Explorer و FireFox تست شده است .

نکات مهم :

  1. تگ های HTML نسبت به بزرگ و کوچک بودن حروف حساس نيستند ، يعنی تگ های < b > با < B > برابر هستند .
  2. می توان يک تگ را در تگ ابتدايي نيز بست . برای اين کار از يک علامت / بعد از نام تگ و خواص مورد نظر تعريف شده استفاده می کنيم . در اين حالت نمی توان متن يا تگ ديگری را به عنوان محتويات برای آن تگ در نظر گرفت .
    توجه کاربرد اين روش در مورد تگ هايي مثل < table > , < td > , < tr > و … امکان پذير نيست .

    Example :
    < br / >
    < input type = “text” name =”family” … / >

  3. هر تگ HTML محتویات درون خود را تحت تاثير قرار می دهد . برای مثال تگ < b > برای توپر کردن ( bold ) نوشته به کار می رود و چنانچه متنی بين تگ باز و بسته < b > قرار بگيرد ، توپر می شود .

حل آنلاین تلفنی مشکلات کامپیوتری و مشکلات موبایل با موبایل کمک – رایانه کمک تماس بگیرید

تگ های مقدماتی Html

  1. تگ< html > :

    محدوده کد صفحه HTML را مشخص می کند و به مرورگر مي فهماند که اين يک صفحه HTML است . فقط کدهاي درون اين محدوده توسط مرورگر اجرا می شود .

    مثال : در مثال زير بدنه اصلی يک صفحه با تگ < html > مشخص شده است :

    Example
    کد
    < html >
      < head >
        < title > The title of the page < /title >
    < /head >
    < body >

    The content of the page

    < /body >

    < /html >
    محدوده اصلی صفحه html
    تگ سر عنوان head
    تگ عنوان صفحهبدنه اصلی صفحه
    .
    .
    .
    پايان بدنه اصلی صفحه
    پايان محدوده اصلی صفحه

    تگ < body > :

    اين تگ بدنه اصلی صفحه HTML را معرفی می کند و شامل کليه محتويات قابل نمايش در صفحه ازقبيل نوشته ها ، عکس ها ، لينک ها و … است . فقط محتويات اين قسمت توسط مرورگر به عنوان خروجی نمايش داده می شوند .
    کدهای محتويات خروجی بين تگ باز و بسته < body > تعريف می شوند .

    خواص مهم
    نام خاصيت نوع خاصيت شرح
    alink نام رنگ
    rgb(x,x,x)
    #xxxxxx
    مشخص کننده رنگ لينک های فعال در صفحه است . رنگ میتواند به روش های زير تعيين شود :

    1. نام رنگ مثل blue يا red .
    2. تعيين رنگ به وسيله تابع rgb به صورت زير :
      ( مقدار رنگ قرمز ، مقدار رنگ سبز ، مقدار رنگ آبی ) rgb
      اين تابع مقدار 3 رنگ را با هم ترکيب کرده و يک رنگ را ايجاد می کند .که مقدار رنگ توسط عددی بين 0 تا 255 تعيين می شود ، که هر چه عدد بزرگتر باشد ميزان آن رنگ در کل رنگ بيشتر خواهد بود .

      Example : rgb (10,65,232)

    3. نعيين رنگ به صورت عددی ترکيبی در مبنای 16 هگزادسيمال :
      ميزان رنگ آبی ميزان رنگ سبز ميزان رنگ قرمز #

      Example : #08FF00

    background URL
    نام – مسير فايل
    آدرس عکس يا فایلی که به عنوان پس زمينه صفحه مورد استفاده قرار می گيرد را تعيين می کند .
    bgcolor نام رنگ
    rgb(x,x,x)
    #xxxxxx
    می توان توسط اين خاصيت يک رنگ را به عنوان رنگ پس زمينه صفحه قرار داد .
    link نام رنگ
    rgb(x,x,x)
    #xxxxxx
    مشخص کننده رنگ کليه لينک های صفحه است .
    text نام رنگ
    rgb(x,x,x)
    #xxxxxx
    رنگ پيش فرض نوشته های درون صفحه را تعيين می کند که به صورت استاندارد مشکی است .
    vlink نام رنگ
    rgb(x,x,x)
    #xxxxxx
    رنگ لينک هايی در صفحه که قبلا يکبار کليک شده اند را مشخص می کند و به اين منظور استفاده می شود که کاربر متوجه شود آن لينک را قبلا مشاهده کرده است .
    Example
    کد
    < html >
      < head >
        < title > The title of the page < /title >
    < /head >

      < body >

    The content of the page   محتويات قابل نمايش توسط مرورگر

    < /body >

    < /html >

کمک رایانه
مشکلات رایانه ای
سوالات رایانه ای
پاسخگویی به سوالات رایانه ای 

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *