آموزش html5 و css3 معرفی تگهای HTML5 قسمت دوم | پاسخ وردپرس |

باسلام خدمت تمام شما کاربران وب سایت پاسخ وردپرس دخدمت شما هستم با یکی دیگه از آموزش های HTML5 و CSS3 .

توی این جلسه میخواهیم تگهای figure  و figcaption  و input type  های html5 خدمت شما آموزش بدیم پس با من همراه باشید .

تگ figure در HTML5

تگ <figure> محتوای خود مانند تصاویر، نمودار ها، عکس ها، لیست کد و … را مشخص می کند.

در حالی که محتوای تگ <figure> با جریان اصلی سند مرتبط است، جایگاهی مستقل دارد و در صورتی که این تگ حذف شود، نباید تاثیری بر جریان اصلی بگذارد.

تگ <figure> یک تگ جدید در HTML5 است. و در نسخه های قبلی html وجود نداشت.

تگ <figure> مانند بسیاری از تگ های html دارای یک تگ باز ( opening tag ) و یک تگ بسته ( closing tag ) می باشد.

 تگهای figure و figcaptin

نکته مهم :

تگ figcaption یک عنوان یا caption به تگ <figure> اضافه می کند.

این تگ می تواند به عنوان اولین یا آخرین عنصر داخل تگ <figure> قرار بگیرد. استفاده از این تگ اختیاری است .

مثال در مورد تگ figure در HTML

انواع ورودی ها در HTML5

اضافه شدن چند نوع ورودی در HTML5 :

[starlist]

  • color
  • date
  • email
  • month
  • number
  • range
  • search
  • tel
  • time
  • url
  • week

[/starlist]

انواع ورودی های جدید که توسط مرورگرهای وب قدیمی تر پشتیبانی نمی شود، به صورت <input= “text”> رفتار می کنند .

آموزش تگها html5

نوع ورودی Color

<input type=”color”> مورد استفاده برای رنگ فیلد ورودی است .

بسته به پشتیبانی از مرورگر، جمع کننده رنگ می توانید در فیلد ورودی نشان می دهد .

بیشتر بخوانید :
آموزش html و css ساخت منوی سایدبار به صورت حرفه ای | پاسخ وردپرس |

نوع ورودی Date

<input type=”date”> مورد استفاده برای ورودی یک تاریخ است .

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

نوع ورودی Datetime-local

<input type=”datetime-local”> مورد استفاده برای یک فیلد ورودی تاریخ و زمان، با ناحیه (جدول) تاریخ است .

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

نوع ورودی Email

<input type=”email”> مورد استفاده برای یک فیلد ورودی که باید حاوی یک نشانی ایمیل باشد .

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

بعضی گوشی های هوشمند نوع فیلد ایمیل را تشخیص می دهند ، و برای ورودی ایمیل “com.” و “@” را به صفحه کلید اضافه می کند .

نوع ورودی Month

<input type=”month”> مورد استفاده برای یک فیلد ورودی ماه و سال همراه با جدول تاریخ کند .

بیشتر بخوانید :
آموزش حل مشکل لیست خالی سفارشات ووکامرس در وردپرس

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

نوع ورودی Number

<input type=”number”> مورد استفاده برای یک فیلد ورودی عدد است .

شما همین طور می توانید محدودیتی در اعدادی که پذیرفته می شوند تنظیم کنید .

در مثال زیر نمایش یک فیلد ورودی عددی ، در آن شما می توانید یک مقدار از ۱ تا ۵ را وارد کنید :

نوع ورودی Range

<input type=”range”> یک رنج کنترل بین شماره هاست برای وارد کردن یک شماره که مقدار دقیق مهم نیست . رنج در حالت پیش فرض بین ۰ تا ۱۰۰ است .

با این حال ، شما می توانید محدودیت هایی از اعداد را ایجاد کنید با مقدار دادن به min و max ، حتی می توانید ویژگی step برای تغییر روند اعداد تعریف کنید :

نوع ورودی Search

<input type=”search”> مورد استفاده برای فیلدهای جستجو (فیلد جستوجو از یک فیلد متنی و یک دکمه جستوجو تشکیل می شود).

نوع ورودی Tel

<input type=”tel”> مورد استفاده برای فیلد ورودی شماره تلفن ها است .

بیشتر بخوانید :
آموزش HTML و CSS آشنایی با CSS Float جلسه 15 | پاسخ وردپرس |

نوع tel در حال حاضر فقط در نسخه سافاری ۸ پشتیبانی می شود .

نوع ورودی Time

<input type=”time”> مورد استفاده برای فیلد ورودی زمان تنها است .

نشان دادن یک فیلد ورودی زمان ، به پشتیبانی مرورگر بستگی دارد .

نوع ورودی Url

<input type=”url”> مورد استفاده برای یک فیلد ورودی آدرس URL است .

نشان دادن یک فیلد ورودی آدرس URL ، به پشتیبانی مرورگر بستگی دارد .

بعضی گوشی های هوشمند نوع فیلد آدرس URL را تشخیص می دهند ، و برای ورودی آدرس “com.” را به صفحه کلید اضافه می کند .

نوع ورودی Week

<input type=”week”> مورد استفاده برای یک فیلد ورودی انتخاب هفته و سال است .

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

این جلسه آموزش هم همین جا به پایان رسید امید وارم که مفید بوده باشه تا یکی دیگه از جلسات آموزش وب سایت پاسخ وردپرس خدا نگهدار

 

یک برنامه نویس آزاد که علاقه زیادی به اشتراک گذاری اطلاعات خود با دیگران داردم. همیشه به وردپرس فکر می کنم و عاشق وردپرس هستم. من یک web developer هستم و هدف من آسان کردن ورود سایر دوستان به این شغل جذاب هست. زبان برنامه نویسی محبوب من PHP هست.

لینک کپی شد!

نظر شما در این‌باره چیست؟

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