آموزش HTML: تصاویر و ارقام

مقدمه Introduction

• خوش آمدی Welcome

• آنچه باید بدانید What you should know

• رایانه خود را تنظیم کنید Setting up your computer

1. ملزومات تصویر 1. Image Essentials

• با استفاده از عنصر img و ویژگی src Using the img element and src attribute

• قابلیت دسترسی: عناصر alt و عنوان Accessibility: alt and title attributes

• اندازه تصویر: عرض و ارتفاع Image size: Width and height

• به دست آوردن تصاویر Obtaining images

2. قالب های تصویر 2. Image Formats

• نمای کلی قالب قالب Image format overview

• GIF و PNG: فرمت هنر خط GIF and PNG: The format for line art

• JPEG: قالب برای عکس ها JPEG: The format for photos

• SVG: قالب برای هنر خط بردار SVG: The format for vector line art

3. تصاویر و CSS 3. Images and CSS

• مرزها ، بالشتکها و فاصله ها Borders, padding, and spacing

• هم ترازی Alignment

• چالش: تصاویر و متن Challenge: Images and text

• راه حل: تصاویر و متن Solution: Images and text

• جلوه های ویژه Special effects

• تصاویر پس زمینه Background images

4. تصاویر پاسخگو 4. Responsive Images

• رزولوشن و تراکم پیکسل Resolution and pixel density

• دست زدن به تراکم پیکسل Handling pixel density

• با استفاده از srcset و اندازه Using srcset and sizes

• وضوح صفحه نمایش را آزمایش کنید Testing screen resolutions

• چالش: از srcset استفاده کنید Challenge: Use srcset

• راه حل: از srcset استفاده کنید Solution: Use srcset

• جهت هنری: عنصر تصویر Art direction: The picture element

5- ارقام 5. Figures

• با استفاده از عناصر شکل و انجیر Using figure and figcaption elements

• چهره های خودکار با CSS Autonumbering figures with CSS

نتیجه Conclusion

• مراحل بعدی Next steps