تگ < html > :

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

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


لینک فیلم اینجا کلیک کنید


                                                  ادیتور آنلاین اینجا کلیک کنید

                                                  ادیتور آنلاین اینجا کلیک کنید2


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 >

تگ < head > :

تگ < head > در بر گیرنده ااطلاعات کلی درباره سند وب است که این اطلاعات Meta-Information به معنای (اطلاعات درباره) نامیده می شود . 
کلیه اطلاعات درون تگ < head > توسط مرورگر نمایش داده نمی شوند .براساس استاندارد HTML فقط تگ های زیر قابل استفاده در بخش head هستند :
< base > , < link > , < meta > , < title > , < style > , < script >

 

خواص مهم

 

نام خاصیت

نوع خاصیت

شرح

profile

URL مسیر

لیستی از آدرس فایل ها یا صفحاتی که در بر گیرنده اطلاعات کلی (meta-information) راجع به محتویات صفحه هستند ، را شامل می شود .

 

تگ < title > :

این تگ عنوان صفحه را که مرورگر در هنگام باز کردن صفحه در نوار عنوان نمایش می دهد را مشخص می کند . متنی که بین تگ باز وبسته < title > قرار بگیرد عنوان صفحه را تعیین می کند . تگ < title > باید در قسمت head صفحه قرار بگیرد .
عنوان صفحه ارتباطی به نام فایل صفحه ندارد و بهتر است حداکثر تا 15 حرف باشد .

Example

 

کد

< html >
  < head > 
    < title > This is the title of the page   عنوان صفحه < /title >
  < /head > 
  < body >
    ... 
  < /body >
< /html >

 

تگ <Doctype!> :

این تگ اولین سطر از کد صفحه وب است و به مرورگر نوع و نسخه استفاده شده از زبان برنامه نویسی HTML یا XHTML را اعلام می کند . لازم به ذکر است که هر صفحه فقط می تواند یک نوع Doctype داشته باشد .
نکته : تگ < Doctype! > تنها تگی است که تگ انتهایی ندارد و در تگ ابتدایی هم توسط علامت / بسته نمی شود .

انواع ورژن های قابل استفاده در صفحات وب : 
1) HTML :

زبان HTML سه حالت کلی دارد : 
Strict , Traditional , Frameset
کدهای زیر باید در قسمت < Doctype! > جهت استفاده از هر یک از حالت های فوق تایپ شود :

 

HTML Strict DTD

نام

زمانی مورد استفاده قرار می گیرد که طراح بخواهد از شیوه قالب دهی به صفحات (CSS) استفاده نماید .

شرح

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" >

کد

 

 

 

HTML Traditional DTD

نام

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

شرح

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" >

کد

 

HTML Frameset DTD

نام

زمانی مورد استفاده قرار می گیرد که بخواهیم در صفحات از قاب ها (Frames) استفاده کنیم .

شرح

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd" >

کد

 

 

2) XHTML :

زبان XHTML سه حالت کلی دارد : 
Strict , Traditional , Frameset
کدهای زیر باید در قسمت < Doctype! > جهت استفاده از هر یک از حالت های فوق تایپ شود :

 

 

XHTML Strict DTD

نام

زمانی مورد استفاده قرار می گیرد که طراح بخواهد از شیوه قالب دهی به صفحات (CSS) استفاده نماید .

شرح

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >

کد

 

 

XHTML Traditional DTD

نام

زمانی مورد استفاده قرار می گیرد که طراح می خواهد از قابلیت های جدید XHTML استفاده نکند ، زیرا مرورگر بازدید کنندگان سایت ممکن است از شیوه قالب دهی صفحات (CSS) پشتیبانی نکند .

شرح

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

کد

 

 

 

XHTML Frameset DTD

نام

زمانی مورد استفاده قرار می گیرد که بخواهیم در صفحات از قاب ها (Frames) استفاده کنیم .

شرح

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd" >

کد

 

 

تگ < meta > :

این تگ اطلاعات کلی درباره مطالب درون صفحه وب ، توضیحات ضروری و واژه های کلیدی مرتبط با موضوع صفحه جهت استفاده موتورهای جستجو را شامل می شود .
چیدمان مناسب و استفاده از کلید واژه های مرتبط به موضوع صفحه ، باعث بهتر نمایش داده شدن صفحه و سایت در قسمت جستجوی موتورهای جستجو می شود .

- تعیین کلیدواژه ها برای موتورهای جستجو :

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

< meta name ="keywords" content="Html,CSS,XML,Java Script,VB Script" />



- تعیین یک توضیح درباره مطالب صفحه :

< meta name ="discription" content="Free web teaching on Html,CSS,XML,Java Script and VB script" />



- تعیین آخرین زمان بازبینی و به روز کردن صفحه :

< meta name ="rivised" content="6/11/07" />



-تعیین زمان refresh شدن صفحه برای هر 5 ثانیه یکبار :

< meta http - equiv ="refresh" content="5" />

 

خواص مهم

 

نام خاصیت

نوع خاصیت

شرح

content

متن Text

اطلاعات مربوط به خاصیت تعیین شده در قسمت name یا http-equiv را نگهداری می کند .

http - equiv

content-type

اطلاعات درون content خود را به سرور اتقال می دهد .

name

auther 
description
keywords
generator
revised
others

اطلاعات درون content خود را به نام تعیین شده ارتباط می دهد که می تواند یکی از حالت های زیر را داشته باشد : 
- auther : نام نویسنده یا گروه نویسندگان و طراحان صفحه وب را مشخص می کند . 
- description : توضیح مختصری راجع به محتویات درون صفحه ارائه می دهد . 
- keywords : کلیدواژه های مورد استفاده موتورهای جستجو را تعیین می کند . 
- generator : مشخصاتی راجع به نرم افزاری که صفحه با آن طراحی و تولید شده است را ارائه می دهد . 
- revised : برای اعمال آخرین تاریخ به روز رسانی سایت استفاده می شود . 
- others : برای ذرج سایر اطلاعات مورد نظر استفاده می شود .

scheme

متن Text

قالبی را برای تفسیر و اجرای اطلاعات درون خاصیت content مشخص میکند .

 

 

تگ توضیح <!-- ... --> :

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

 

 

 

Example

کد

خروجی

< !-- This text will not display -- >
< p > This text will display < /p >

 

This text will display

 

 

تگ < base > :

این تگ یک آدرس پایه برای کلیه لینک های موجود در صفحه تعیین می کند . 
مثال : فرض کنید که آدرس یک عکس در صفحه به صورت زیر است :

< img src="http://www.DeveloperStudio.ir/images/smile.gif" / >

در صورتی که تگ < base > در قسمت head به صورت زیر وارد شود :

< head >
  < base href="http://www.DeveloperStudio.ir/images/" > 
< /head >

در هنگام وارد کردن عکس فوق در صفحه ، می توان برای وارد کردن آدرس عکس فقط ادامه مقدار آدرس عکس را در تگ < img > به صورت زیر وارد کرد :

< img src="smile.gif" />

خواص مهم

 

نام خاصیت

نوع خاصیت

شرح

href

URL

مشخص کننده آدرس پیش فرض برای کلیه لینک های صفحه است .

target

blank
self
parent
top

مقصد باز شدن پنجره کلیه لینک های صفحه را تعیین می کند .چنانچه درون تگ یک لینک ، مقدار این خاصیت به صورت جدا تعیین شود این قاعده برای آن لینک زیر پا گذاشته می شود .
این خاصیت میتواند یکی از مقادیر زیر را داشته باشد : 
- blank : تمام لینک ها در یک پنجره جدید باز خواهند شد . 
- self : تمام لینک ها در همان پنجره یا قابی که کلیک شده اند باز خواهند شد . 
-parent : تمام لینک ها در قاب اصلی یا مادر باز خواهند شد . 
-top : تمام لینک ها در همان پنجره ای که کلیک شده اند به طور کامل باز خواهند شد .