آموزش برنامه نویسی 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 تست شده است .
نکات مهم :
- تگ های HTML نسبت به بزرگ و کوچک بودن حروف حساس نيستند ، يعنی تگ های < b > با < B > برابر هستند .
- می توان يک تگ را در تگ ابتدايي نيز بست . برای اين کار از يک علامت / بعد از نام تگ و خواص مورد نظر تعريف شده استفاده می کنيم . در اين حالت نمی توان متن يا تگ ديگری را به عنوان محتويات برای آن تگ در نظر گرفت .
توجه کاربرد اين روش در مورد تگ هايي مثل < table > , < td > , < tr > و … امکان پذير نيست .Example :
< br / >
< input type = “text” name =”family” … / > - هر تگ HTML محتویات درون خود را تحت تاثير قرار می دهد . برای مثال تگ < b > برای توپر کردن ( bold ) نوشته به کار می رود و چنانچه متنی بين تگ باز و بسته < b > قرار بگيرد ، توپر می شود .
حل آنلاین تلفنی مشکلات کامپیوتری و مشکلات موبایل با موبایل کمک – رایانه کمک تماس بگیرید
تگ های مقدماتی Html
-
تگ< 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
تگ عنوان صفحهبدنه اصلی صفحه
.
.
.
پايان بدنه اصلی صفحه
پايان محدوده اصلی صفحه
اين تگ بدنه اصلی صفحه HTML را معرفی می کند و شامل کليه محتويات قابل نمايش در صفحه ازقبيل نوشته ها ، عکس ها ، لينک ها و … است . فقط محتويات اين قسمت توسط مرورگر به عنوان خروجی نمايش داده می شوند .
کدهای محتويات خروجی بين تگ باز و بسته < body > تعريف می شوند .خواص مهم نام خاصيت نوع خاصيت شرح alink نام رنگ
rgb(x,x,x)
#xxxxxxمشخص کننده رنگ لينک های فعال در صفحه است . رنگ میتواند به روش های زير تعيين شود : - نام رنگ مثل blue يا red .
- تعيين رنگ به وسيله تابع rgb به صورت زير :
( مقدار رنگ قرمز ، مقدار رنگ سبز ، مقدار رنگ آبی ) rgb
اين تابع مقدار 3 رنگ را با هم ترکيب کرده و يک رنگ را ايجاد می کند .که مقدار رنگ توسط عددی بين 0 تا 255 تعيين می شود ، که هر چه عدد بزرگتر باشد ميزان آن رنگ در کل رنگ بيشتر خواهد بود .Example : rgb (10,65,232)
- نعيين رنگ به صورت عددی ترکيبی در مبنای 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 >
کمک رایانه
مشکلات رایانه ای
سوالات رایانه ای
پاسخگویی به سوالات رایانه ای