تگ Html

در زبان HTML کدهای وب بین تگ های html و body قرار میگیرند و تگ html مشخص کننده ی شروع و پایان یک سند Html میباشد.

تگ Head

تگ head نخستین تگ در بدنه تگ html است که شامل یک سری اطلاعات برای مرورگر و نیز جستجوگر های وب می باشد.

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

تگ title

یکی از مهمترین تگ ها برای جستجوگرهای وب تگ عنوان ( Title ) می باشد . متنی که داخل این تگ قرار میگیرد عنوان صفحه را مشخص میکند که در title bar مرورگر به کاربران نشان داده می شود، این تگ در همه سندهای HTML الزامی است.

دقت کنید که متن داخل این تگ در صورت زیاد بودن ادامه ی آن توسط مرورگر حذف میشود به همین علت باید از عناوین کوتاه استفاده کنید. این تگ حتما بایستی درون تگ head قرار بگیرد.

ویژگی های مشترک در بین تگ ها در HTML

یک سری از ویژگی ها هستند که در بین تگ های html مشترک هستند و در همه آنها کار مشترکی را انجام میدهند.

این ویژگی ها به شرح زیر میباشند:

  • class
  • style
  • id
  • dir
  • hidden
  • title
  • lang
  • tabindex
  • translate
  • Event Attributes
  • accesskey
  • contenteditable
  • contextmenuelement
  • dropzone
  • draggable
  • spellcheck

خاصیت Style:

تگ های html می توانند با استفاده از این خصوصیت از دیگر تگ های مشابه متمایز گردند. این خاصیت درون تگ های html قرار میگیرد و با استفاده از آن میتوان شکل ظاهری یک تگ را تعیین کرد.

<p style=”background-color:#ccc; color:red; font-size:14px; text-align:center; “> متن پاراگراف </p>

ویژگی های رویداد(Event) در HTML:

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

هر عنصرشامل رویدادهای مختص به خود است که هر کدام از آنها را می توان در درون تگ آن تعیین کرد .

ویژگی های رویداد در HTML به چند قسمت تقسم می شوند:

  • رویدادهای پنجره
  • رویدادهای عناصر فرم
  • رویدادهای موس
  • رویدادهای صفحه کلید
  • رویدادهای حافظه کلیپ بورد (Clipboard)
  • رویدادهای پرینت
  • رویدادهای مربوط به مدیا
  • رویدادهای مربوط به سمت سرور

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

رویداد توضیحات
onclick این رویداد، زمانی که کاربر روی عنصر کلیک می کند، اتفاق می افتد.
oncontextmenu این رویداد، زمانی روی می دهد که، کاربر برای باز کردن منوی زمینه، روی یک عنصر راست کلیک می کند.
ondblclick این رویداد، زمانی روی می دهد که، کاربر روی یک عنصر دبل-کلیک کند .
onmousedown این رویداد، زمانی روی می دهد که، کاربر دکمه ی موس را روی یک عنصر فشار دهد.
onmouseenter این رویداد، زمانی روی می دهد که،  کاربر نشانگر ماوس را به روی یک عنصر وارد کند.
onmouseleave این رویداد، زمانی روی می دهد که،  نشانگر موس از روی یک عنصر خارج شود.
onmousemove این رویداد،زمانی روی می دهد که، اشاره گر موس بر روی یک عنصر، حرکت کند.
onmouseover این رویداد، زمانی روی می دهد که،کاربر اشاره گر ماوس را  بر روی یک عنصر یا فرزندان آن عنصر وارد کند.
onmouseout این رویداد، زمانی روی می دهد که، کاربر اشاره گر ماوس را از روی یک عنصر یا فرزندان آن عنصر بیرون ببرد.
onmouseup این رویداد، زمانی روی می دهد که کاربر،دکمه ی ماوس را بر روی یک عنصر رها کند.

کلیه رویدادهای مربوط به کیبورد (keyboard)

رویداد توضیحات
onkeydown این رویداد زمانی روی می دهد که، کاربر در حال فشار دادن یک دکمه است.
onkeypress این رویداد زمانی روی می دهد که، کاربر یک دکمه را فشار دهد.
onkeyup این رویداد زمانی روی می دهد که، کاربر یک دکمه را رها کند. 

کلیه رویدادهای مربوط به فرم (form)

رویداد توضیحات
onblur این رویداد زمانی روی می دهد که، یک عنصر focus(فوکس) را از دست می دهد.
onchange این رویداد زمانی روی می دهد که، مقدار یک عنصر تغییر کند. این عنصر می تواند <input> یا <keygen> یا <textarea> باشد.
onfocus این رویداد زمانی روی می دهد که، یک عنصر focus(فوکس) را به دست آورد.
onfocusin این رویداد زمانی روی می دهد که، یک عنصر در آستانه ی گرفتن focus(فوکس)می باشد.
onfocusout  این رویداد زمانی روی می دهد که، یک عنصر در آستانه ی از دست دادن focus(فوکس)می باشد.
oninput  این رویداد زمانی روی می دهد که، یک عنصر ورودی را از کاربر دریافت می کند
oninvalid  این رویداد زمانی روی می دهد که، یک عنصر نامعتبر است.
onreset  این رویداد زمانی روی می دهد که، یک فرم reset شود.
onsearch  این رویداد زمانی روی می دهد که، یک کاربر در فیلد search چیزی را بنویسد.
onselect  این رویداد زمانی روی می دهد که، کاربر مقداری از یک متن را انتخاب کند(select کند).
onsubmit  این رویداد زمانی روی می دهد که، یک فرم submit شود.
آموزش Html(بخش هشتم)
شاید این مطلب را نیز بپسندید

کلیه رویدادهای مربوط به حافظه کلیپ بورد (Clipboard)

رویداد توضیحات
oncopy این رویداد زمانی روی می دهد که، کاربر محتوای یک عنصر را کپی می کند.
oncut این رویداد زمانی روی می دهد که، کاربر محتوای یک عنصر را cut می کند.
onpaste این رویداد زمانی روی می دهد که، یک کاربر محتوایی را در یک عنصر paste(الصاق) می کند.

کلیه رویدادهای مربوط به پرینت (Print )

رویداد توضیحات
onafterprint این رویداد زمانی روی می دهد که، یک صفحه شروع به print می کند یا اینکه پنجره مربوط به print بسته می شود.
onbeforeprint این رویداد زمانی روی می دهد که، یک صفحه در آستانه ی پرینت شدن است.

کلیه رویدادهای مربوط به مدیا (Media )

رویداد توضیحات
onabort این رویداد زمانی روی می دهد که لود شدن یک مدیا بی نتیجه باشد.
oncanplay این رویداد زمانی روی می دهد که، مرورگر بتواند نمایش مدیا را شروع کند. 
oncanplaythrough این رویداد زمانی روی می دهد که، مرورگر بتواند بدون توقف برای لود کردن، مدیا را نمایش دهد.
ondurationchange این رویداد زمانی روی می دهد که، مدت یک مدیا تغییر کند.
onemptied این رویداد زمانی روی می دهد که به علت یک اتفاق بد، فایل مدیا ناگهان از دسترس خارج می شود.
onended این رویداد زمانی روی می دهد که، مدیا به پایان می رسد (قابل استفاده برای پیام اتمام  مدیا).
onerror این رویداد زمانی روی می دهد که، یک error در طول لود شدن فایل مدیا رخ دهد.
onloadeddata این رویداد زمانی روی می دهد که، داده های مدیا، لود شده اند.
onloadedmetadata  این رویداد زمانی روی می دهد که، داده های متا، لود شوند.
onloadstart  این رویداد زمانی روی می دهد که، مرورگر شروع به جستجوی مدیای مورد نظر می کند.
onpause  این رویداد زمانی روی می دهد که، مدیا متوقف شود، خواه توسط کاربر یا بصورت برنامه نویسی.
onplay  این رویداد زمانی روی می دهد که، پخش مدیا شروع شود or is no longer paused
onplaying  این رویداد زمانی روی می دهد که، مدیا بعد از متوقف شدن(pause) یا توقف برای دانلود ادامه(buffering)، شروع به پخش کند.
onprogress  این رویداد زمانی روی می دهد که، مرورگر در پروسه ی گرفتن داده های مدیا می باشد(دانلود کردن مدیا).
onratechange  این رویداد زمانی روی می دهد که، سرعت پخش مدیا تغییر کند.
onseeked  این رویداد زمانی روی می دهد که، کاربر حرکت/پرش به یک مکان پخش جدید در مدیا را به پایان ببرد.
onseeking  این رویداد زمانی روی می دهد که، کاربر حرکت/پرش به یک مکان پخش جدید در مدیا را شروع می کند.
onstalled  این رویداد زمانی روی می دهد که، مرورگر در حال تلاش برای دریافت داده های مدیا می باشد اما این داده ها غیر قابل دسترس می باشند.
onsuspend  این رویداد زمانی روی می دهد که، مرورگر به طور عمدی داده های مدیا را دریافت نمی کند.
ontimeupdate  این رویداد زمانی روی می دهد که، مکان پخش تغییر کند(درست مانند زمانی که کاربر به سرعت مدیا را از نقطه ای به نقطه ی دیگر می برد)
onvolumechange  این رویداد زمانی روی می دهد که، میزان صدای مدیا تغییر کند(همچنین هنگامی که صدا در حالت mute قرار دارد)
onwaiting  این رویداد زمانی روی می دهد که، مدیا برای دانلود فریم بعدی متوقف شده است و در حالت(resume)قرار دارد.

کلیه رویدادهای مربوط به سمت سرور (Server-Sent)

رویداد توضیحات
onerror  این رویداد زمانی روی می دهد که یک error در منبع رویداد(event source) ایجاد شود.
onmessage  این رویداد زمانی روی می دهدکه، یک پیام از منبع رویداد(event source)دریافت شود.
onopen  این رویداد زمانی روی می دهد که، یک اتصال با منبع رویداد(event source) باز شود.

سایر رویدادها

رویداد توضیحات
onmessage این رویداد زمانی روی می دهد که، یک پیام از منبع رویداد(event source) دریافت شود.
onmousewheel غیر قابل استفاده. به جای آن از رویداد onwheel استفاده کنید.
ononline این رویداد زمانی روی می دهد که، مرورگر شروع به کار در حالت آنلاین می کند.
onoffline این رویداد زمانی روی می دهد که، مرورگر شروع به کار در حالت آفلاین می کند.
onpopstate این رویداد زمانی روی می دهد که، تاریخچه ی(history) پنجره تغییر می کند.
onshow  این رویداد زمانی روی می دهد که، یک عنصر <menu> بصورت منوی محتوا(context menu)، نشان داده شود.
onstorage این رویداد زمانی روی می دهد که، یک منطقه ی ذخیره سازی وب بروز رسانی شود.
ontoggle این رویداد زمانی روی می دهد که، یک کاربر عنصر <details> را باز کند یا ببندد.
onwheel این رویداد زمانی روی می دهد که، دکمه ی چرخان ماوس، بر روی یک عنصر به سمت بالا یا پایین بچرخد.
آموزش Html(بخش سوم)