جلسه ۴۴ : آموزش کار با تگ figure در HTML

• جزئیات
• نوع محتواآموزشی

مقدمه

سلام پی وی لرنی های عزیز!
به دوره آموزش تگ های HTML خوش آمدید!
HTML یا Hypertext Markup Language یک نوع زبان نشانه‌گذاری استاندارد برای ایجاد صفحات اینترنت و وب محسوب می شود.
می توان ادعا کرد که HTML دروازه ورود و پیشرفت برای یادگیری سایر زبان های برنامه نویسی هم چون CSS و جاوا اسکریپت است.
HTML ساختار و اسکلت صفحات وب را تشکیل می دهد و بدون آن نمی توان هیچ صفحه وبی را ساخت.
دوست دارید طراح وب شوید؟
خب باید HTML را بیاموزید!
نگران نشوید! یادگیری HTML کار دشواری نیست و با کمی تلاش خیلی زود در آن استاد می شوید.
در جلسه گذشته با تگ figcaption آشنا شدیم؛ تگ figcaption تگی است که به تعیین عنوان یا کپشن برای تگ figure می پردازد.
در این جلسه قصد داریم به آموزش کار با تگ figure در HTML بپردازیم.

آموزش کار با تگ figure در HTML

به مثال زیر توجه نمایید.
در این مثال یک تگ figure به کار رفته است که به نشانه گذاری یک تصویر در یک سند می پردازد.

تعریف و کاربرد

تگ figure تگی است که محتواهایی چون تصاویر، نمودارها، عکس ها، لیست کد ها و غیره را شامل می شود.

محتوای تگ figure مربوط به جریان اصلی است و موقعیت آن مستقل از جریان اصلی است و در صورت حذف آن نباید بر جریان سند تأثیر بگذارد.

پشتیبانی مرورگر ها

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

عنصر
<figure>	۶٫۰	۴٫۰	۱۱٫۱	۵٫۰	۹٫۰

نکات و توصیه ها

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

تفاوت بین HTML 4.01 و HTML5

تگ <figure> در HTML5 تگ جدیدی محسوب می شود.

خصیصه های سراسری Global Attributes

تگ <figure> از خصیصه های سراسری در HTML پشتیبانی می کند.

 خصیصه رویداد Event Attributes

تگ <figure> از خصیصه رویداد در HTML پشتیبانی می کند.

تنظیمات پیش فرض CSS

بیشتر مرورگرها عنصر <figure> را با مقادیر پیش فرض زیر نمایش می دهند:

کلام آخر

در این جلسه به کار با تگ figure پرداختیم و آموختیم که این تگ حاوی محتواهایی چون تصاویر، نمودارها، عکس ها، لیست کد ها و غیره است.
در جلسه آینده به آشنایی با تگ font می پردازیم.
با پی وی لرن همراه باشید.