آموزش Html(بخش دوم)

آموزش Html(بخش دوم)

تگ 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 شود.
طراحی سایت ریسپانسیو(واکنش گرا)
شاید این مطلب را نیز بپسندید

کلیه رویدادهای مربوط به حافظه کلیپ بورد (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این رویداد زمانی روی می دهد که، دکمه ی چرخان ماوس، بر روی یک عنصر به سمت بالا یا پایین بچرخد.
برچسب‌ها:

پاسخ دهید

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

11 + شانزده =

    DESIGNESTAN
    0912-0292081